diff options
Diffstat (limited to '.themes/classic/sass/base')
-rw-r--r-- | .themes/classic/sass/base/_layout.scss | 35 | ||||
-rw-r--r-- | .themes/classic/sass/base/_theme.scss | 4 | ||||
-rw-r--r-- | .themes/classic/sass/base/_typography.scss | 25 |
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; }} |