1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-14 00:55:16 +01:00
blog/_src/assets/less/scaffolding.less

120 lines
1.9 KiB
Plaintext

html {
// remove tap highlight cause we're using the active styles
-webkit-tap-highlight-color: rgba(0,0,0,0);
tap-highlight-color: rgba(0,0,0,0);
}
body {
background: @body-bg;
}
// Banner
/////////////////////////////////////
.banner {
float: left;
width: 15%;
min-width: 160px;
.banner-title {
width: 128px;
margin-top: .1em;
margin-bottom: 0;
// display toned down logo
// by default
.logo;
}
.banner-logo {
.ir;
// repeat logo
// but display hover version
.logo;
background-position: center -61px;
width: 128px;
// hide by default
opacity: 0;
// show smooooothly on hover
&:hover { opacity: 1 }
&:active { top: 0 }
}
}
// Footer
/////////////////////////////////////
.footer {
text-align: center;
background: fade(@brand-dark, 5%);
.footer-description {
.h5;
}
&,
.footer-description {
color: @text-color-light;
line-height: @line-height-computed;
}
.footer-copyright {
.divider-top;
padding-top: @line-height-computed;
padding-bottom: @line-height-computed;
p {
margin-bottom: 0;
font-size: @font-size-mini;
}
}
}
// Subscribe component
.subscribe {
margin: @line-height-computed auto;
p {
margin: 0;
.clearfix;
.btn {
margin-bottom: 0;
padding: .3em 1em;
&:first-child {
margin-left:0
}
&:last-child {
margin-right: 0;
}
span {
.visuallyhidden;
}
}
}
i {
display: block;
color: @text-color-light;
&:before {
// Icon resets for color animations
.transition(color .3s ease-in-out);
color: inherit;
margin-right: 0;
}
}
}
.footer:hover .subscribe .rss i:before {
color: #e15a00;
}
.footer:hover .subscribe .twitter i:before {
color: #019ad2;
}
.footer:hover .subscribe .google i:before {
color: #c63b1e;
}
.footer:hover .subscribe .facebook i:before {
color: #3b5998;
}