You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
95 lines
1.8 KiB
SCSS
95 lines
1.8 KiB
SCSS
a {
|
|
color: $link_color;
|
|
&:hover, &:focus {
|
|
color: saturate(darken($link_color, 15), 20); }
|
|
&:visited {
|
|
color: darken(adjust_hue($link_color, 70), 10);
|
|
}
|
|
}
|
|
|
|
$min-width: 320px;
|
|
$max-width: 1440px;
|
|
$default-border-radius: 4px;
|
|
|
|
.group { @include pie-clearfix; }
|
|
.core-layout { > div { @extend .inner-wrap; } }
|
|
|
|
body {
|
|
> header, > nav, > footer {
|
|
@extend .core-layout;
|
|
min-width: $min-width;
|
|
}
|
|
}
|
|
|
|
|
|
@mixin media-layout($page-pad, $sidebar-width, $sidebar-pad) {
|
|
$side-nav: $sidebar-width - $page-pad - $sidebar-pad;
|
|
|
|
.inner-wrap {
|
|
padding: 0 $page-pad;
|
|
position: relative;
|
|
margin: 0 auto;
|
|
max-width: $max-width;
|
|
@extend .group;
|
|
}
|
|
|
|
body > nav + div {
|
|
@extend .group;
|
|
padding: 0;
|
|
max-width: $max-width + $page-pad*2;
|
|
margin: 0 auto;
|
|
> div {
|
|
@extend .group;
|
|
margin-right: $sidebar-width;
|
|
}
|
|
}
|
|
body > nav > div > div { width: $side-nav;
|
|
.search { width: $side-nav - 70px; }
|
|
}
|
|
|
|
#articles {
|
|
float: left;
|
|
width: 100%;
|
|
padding-top: 25px;
|
|
padding-bottom: 25px;
|
|
> * {
|
|
padding-right: $page-pad;
|
|
padding-left: $page-pad;
|
|
}
|
|
> article {
|
|
margin-bottom: 1.5em;
|
|
padding-bottom: 1.5em;
|
|
padding-right: $page-pad;
|
|
padding-left: $page-pad;
|
|
}
|
|
+ aside {
|
|
display: block;
|
|
float: left;
|
|
width: $sidebar-width - $sidebar-pad*2;
|
|
margin: 0 -100% 0 0;
|
|
padding: 0 $sidebar-pad $sidebar-pad;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media only screen and (min-width: 320px) {
|
|
@import "../media/480";
|
|
}
|
|
|
|
@media only screen and (min-width: 768px) {
|
|
@include media-layout(15px, 240px, 15px);
|
|
@import "../media/768";
|
|
}
|
|
|
|
@media only screen and (min-width: 992px) {
|
|
@include media-layout(40px, 320px, 30px);
|
|
@import "../media/992";
|
|
}
|
|
|
|
|
|
//*{
|
|
//transition: width .5s;
|
|
//-moz-transition: width .5s;
|
|
//-webkit-transition: margin .5s;
|
|
//}
|