aboutsummaryrefslogtreecommitdiff
path: root/.themes/classic/sass/base
diff options
context:
space:
mode:
Diffstat (limited to '.themes/classic/sass/base')
-rw-r--r--.themes/classic/sass/base/_layout.scss35
-rw-r--r--.themes/classic/sass/base/_theme.scss4
-rw-r--r--.themes/classic/sass/base/_typography.scss25
3 files changed, 49 insertions, 15 deletions
diff --git a/.themes/classic/sass/base/_layout.scss b/.themes/classic/sass/base/_layout.scss
index 40240fff..f9f3a41a 100644
--- a/.themes/classic/sass/base/_layout.scss
+++ b/.themes/classic/sass/base/_layout.scss
@@ -14,6 +14,10 @@ $sidebar-width-wide: 300px !default;
$indented-lists: false !default;
+$header-font-size: 1em !default;
+$header-padding-top: 1.5em !default;
+$header-padding-bottom: 1.5em !default;
+
.group { @include pie-clearfix; }
@mixin collapse-sidebar {
@@ -44,7 +48,7 @@ body {
max-width: $max-width;
position: relative;
margin: 0 auto;
- > header, > nav, > footer, #content > article, #content > div > article, #content > div > section, nav.pagination {
+ > header, > nav, > footer, #content > article, #content > div > article, #content > div > section {
@extend .group;
padding-left: $pad-min;
padding-right: $pad-min;
@@ -61,10 +65,27 @@ body {
padding-right: $pad-wide;
}
}
+ 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;
+ }
+ }
> header {
- font-size: 1em;
- padding-top: 1.5em;
- padding-bottom: 1.5em;
+ font-size: $header-font-size;
+ padding-top: $header-padding-top;
+ padding-bottom: $header-padding-bottom;
}
}
@@ -98,14 +119,14 @@ body.sidebar-footer {
}
@media only screen and (min-width: 550px) {
- body > header { font-size: 1em; }
+ body > header { font-size: $header-font-size; }
}
@media only screen and (min-width: 750px) {
aside.sidebar { @include collapse-sidebar; }
}
@media only screen and (min-width: 768px) {
body { -webkit-text-size-adjust: auto; }
- body > header { font-size: 1.2em; }
+ body > header { font-size: $header-font-size * 1.2; }
#main {
@extend .group;
padding: 0;
@@ -142,7 +163,7 @@ body.sidebar-footer {
}
@media only screen and (min-width: 992px) {
- body > header { font-size: 1.3em; }
+ body > header { font-size: $header-font-size * 1.3; }
#content { margin-right: $sidebar-width-wide; }
#content {
> div, > article {
diff --git a/.themes/classic/sass/base/_theme.scss b/.themes/classic/sass/base/_theme.scss
index e5539b1f..62e06890 100644
--- a/.themes/classic/sass/base/_theme.scss
+++ b/.themes/classic/sass/base/_theme.scss
@@ -23,6 +23,8 @@ $type-border: #ddd !default;
/* Navigation */
$nav-bg: #ccc !default;
+$nav-bg-front: image-url('noise.png') !default;
+$nav-bg-back: linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11)) !default;
$nav-color: darken($nav-bg, 38) !default;
$nav-color-hover: darken($nav-color, 25) !default;
$nav-placeholder: desaturate(darken($nav-bg, 10), 15) !default;
@@ -46,6 +48,8 @@ $twitter-status-link: lighten($sidebar-link-color-subdued, 15) !default;
$footer-color: #888 !default;
$footer-bg: #ccc !default;
+$footer-bg-front: image-url('noise.png') !default;
+$footer-bg-back: linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11)) !default;
$footer-color: darken($footer-bg, 38) !default;
$footer-color-hover: darken($footer-color, 10) !default;
$footer-border-top: lighten($footer-bg, 15) !default;
diff --git a/.themes/classic/sass/base/_typography.scss b/.themes/classic/sass/base/_typography.scss
index 60556752..b68753fa 100644
--- a/.themes/classic/sass/base/_typography.scss
+++ b/.themes/classic/sass/base/_typography.scss
@@ -1,21 +1,30 @@
$blockquote: $type-border !default;
-$mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
+$sans: "PT Sans", "Helvetica Neue", Arial, sans-serif !default;
+$serif: "PT Serif", Georgia, Times, "Times New Roman", serif !default;
+$mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !default;
+$heading-font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif !default;
+$header-title-font-family: $heading-font-family !default;
+$header-subtitle-font-family: $heading-font-family !default;
// Fonts
.heading {
- font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif;
+ font-family: $heading-font-family;
}
-.sans { font-family: "PT Sans", "Helvetica Neue", Arial, sans-serif; }
-.serif { font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; }
+.sans { font-family: $sans; }
+.serif { font-family: $serif; }
.mono { font-family: $mono; }
body > header h1 {
font-size: 2.2em;
@extend .heading;
+ font-family: $header-title-font-family;
font-weight: normal;
line-height: 1.2em;
margin-bottom: 0.6667em;
}
+body > header h2 {
+ font-family: $header-subtitle-font-family;
+}
body {
line-height: 1.5em;
@@ -56,12 +65,12 @@ h6, section h5, section section h4, section section section h3 {
p, blockquote, ul, ol { margin-bottom: 1.5em; }
ul { list-style-type: disc;
- ul { list-style-type: circle;
- ul { list-style-type: square; }}}
+ ul { list-style-type: circle; margin-bottom: 0px;
+ ul { list-style-type: square; margin-bottom: 0px; }}}
ol { list-style-type: decimal;
- ol { list-style-type: lower-alpha;
- ol { list-style-type: lower-roman; }}}
+ ol { list-style-type: lower-alpha; margin-bottom: 0px;
+ ol { list-style-type: lower-roman; margin-bottom: 0px; }}}
ul, ol { &, ul, ol { margin-left: 1.3em; }}