91f01901 |
$max-width: 1200px !default;
// Padding used for layout margins
$pad-min: 18px !default;
$pad-narrow: 25px !default;
$pad-medium: 35px !default;
$pad-wide: 55px !default;
// Sidebar widths used in media queries
$sidebar-width-medium: 240px !default;
$sidebar-pad-medium: 15px !default;
$sidebar-pad-wide: 20px !default;
$sidebar-width-wide: 300px !default;
|
0f2686ef |
$indented-lists: false !default;
|
c1e6ad5e |
$header-font-size: 1em !default; |
fe28a3bd |
$header-padding-top: 1.5em !default;
$header-padding-bottom: 1.5em !default; |
c1e6ad5e |
|
91f01901 |
.group { @include pie-clearfix; }
|
0f2686ef |
@mixin collapse-sidebar {
float: none;
width: auto;
clear: left;
margin: 0;
padding: 0 $pad-medium 1px;
background-color: lighten($sidebar-bg, 2);
border-top: 1px solid lighten($sidebar-border, 4);
section {
&.odd, &.even { float: left; width: 48%; }
&.odd { margin-left: 0; }
&.even { margin-left: 4%; }
}
&.thirds section {
width: 30%;
margin-left: 5%; |
2f7d9f38 |
&.first {
margin-left: 0;
clear: both;
} |
0f2686ef |
}
}
|
91f01901 |
body {
-webkit-text-size-adjust: none;
max-width: $max-width;
position: relative;
margin: 0 auto; |
1362e9d5 |
> header, > nav, > footer, #content > article, #content > div > article, #content > div > section { |
91f01901 |
@extend .group;
padding-left: $pad-min;
padding-right: $pad-min;
@media only screen and (min-width: 480px) {
padding-left: $pad-narrow;
padding-right: $pad-narrow;
}
@media only screen and (min-width: 768px) {
padding-left: $pad-medium;
padding-right: $pad-medium;
}
@media only screen and (min-width: 992px) {
padding-left: $pad-wide;
padding-right: $pad-wide;
}
} |
1362e9d5 |
div.pagination {
@extend .group;
margin-left: $pad-min;
margin-right: $pad-min;
@media only screen and (min-width: 480px) {
margin-left: $pad-narrow;
margin-right: $pad-narrow;
}
@media only screen and (min-width: 768px) {
margin-left: $pad-medium;
margin-right: $pad-medium;
}
@media only screen and (min-width: 992px) {
margin-left: $pad-wide;
margin-right: $pad-wide;
}
} |
91f01901 |
> header { |
c1e6ad5e |
font-size: $header-font-size;
padding-top: $header-padding-top;
padding-bottom: $header-padding-bottom; |
91f01901 |
}
}
|
930747f0 |
#content {
overflow: hidden;
> div, > article { width: 100%; }
} |
0f2686ef |
|
a9a901c1 |
aside.sidebar { |
0f2686ef |
float: none;
padding: 0 $pad-min 1px;
background-color: lighten($sidebar-bg, 2);
border-top: 1px solid $sidebar-border;
@extend .group; |
91f01901 |
}
|
806d27db |
.flex-content { max-width: 100%; height: auto; }
.basic-alignment {
&.left { float: left; margin-right: 1.5em; }
&.right { float: right; margin-left: 1.5em; }
&.center { display:block; margin: 0 auto 1.5em; }
&.left, &.right { margin-bottom: .8em; }
}
|
0f2686ef |
.toggle-sidebar { &, .no-sidebar & { display: none; }}
body.sidebar-footer {
@media only screen and (min-width: 750px) { |
a9a901c1 |
aside.sidebar{ @include collapse-sidebar; } |
0f2686ef |
}
#content { margin-right: 0px; }
.toggle-sidebar { display: none; }
} |
5d1d04c5 |
|
91f01901 |
@media only screen and (min-width: 550px) { |
c1e6ad5e |
body > header { font-size: $header-font-size; } |
0f2686ef |
}
@media only screen and (min-width: 750px) { |
a9a901c1 |
aside.sidebar { @include collapse-sidebar; } |
91f01901 |
} |
d71223c6 |
#main, #content, .sidebar {
@extend .group;
} |
91f01901 |
@media only screen and (min-width: 768px) {
body { -webkit-text-size-adjust: auto; } |
c1e6ad5e |
body > header { font-size: $header-font-size * 1.2; } |
5d1d04c5 |
#main {
padding: 0;
margin: 0 auto; |
91f01901 |
} |
5d1d04c5 |
#content { |
930747f0 |
overflow: visible; |
5d1d04c5 |
margin-right: $sidebar-width-medium;
position: relative; |
376a22a3 |
.no-sidebar & { margin-right: 0; border-right: 0; } |
0f2686ef |
.collapse-sidebar & { margin-right: 20px; } |
5d1d04c5 |
> div, > article {
padding-top: $pad-medium/2;
padding-bottom: $pad-medium/2;
float: left;
} |
91f01901 |
} |
a9a901c1 |
aside.sidebar { |
0f2686ef |
width: $sidebar-width-medium - $sidebar-pad-medium*2;
padding: 0 $sidebar-pad-medium $sidebar-pad-medium;
background: none;
clear: none;
float: left;
margin: 0 -100% 0 0;
section {
width: auto; margin-left: 0;
&.odd, &.even { float: none; width: auto; margin-left: 0; } |
8b6d83ae |
} |
5d1d04c5 |
.collapse-sidebar & { |
0f2686ef |
@include collapse-sidebar; |
5d1d04c5 |
} |
91f01901 |
}
}
@media only screen and (min-width: 992px) { |
c1e6ad5e |
body > header { font-size: $header-font-size * 1.3; } |
5d1d04c5 |
#content { margin-right: $sidebar-width-wide; }
#content {
> div, > article {
padding-top: $pad-wide/2;
padding-bottom: $pad-wide/2;
} |
0f2686ef |
} |
a9a901c1 |
aside.sidebar { |
0f2686ef |
width: $sidebar-width-wide - $sidebar-pad-wide*2;
padding: 1.2em $sidebar-pad-wide $sidebar-pad-wide;
.collapse-sidebar & { |
5d1d04c5 |
padding: { left: $pad-wide; right: $pad-wide; }
} |
91f01901 |
}
} |
0f2686ef |
@if $indented-lists == false {
@media only screen and (min-width: 768px) {
ul, ol { margin-left: 0; }
}
} |
d71223c6 |
|