diff options
| -rw-r--r-- | partials/_base-normalize.scss | 14 | ||||
| -rw-r--r-- | partials/_base.scss | 1 | ||||
| -rw-r--r-- | partials/_x-normalize.scss | 250 | ||||
| -rw-r--r-- | style.scss | 18 |
4 files changed, 270 insertions, 13 deletions
diff --git a/partials/_base-normalize.scss b/partials/_base-normalize.scss new file mode 100644 index 0000000..c0ad83b --- /dev/null +++ b/partials/_base-normalize.scss @@ -0,0 +1,14 @@ +// Normalize integration +// +// No styleguide reference. +@import "compass/typography/vertical_rhythm"; + +$x-normalize-typography-p-margin: rhythm(1) 0; +$x-normalize-typography-h1-fontsize: false; +$x-normalize-typography-h2-fontsize: false; +$x-normalize-typography-h3-fontsize: false; +$x-normalize-typography-h1-margin: false; +$x-normalize-typography-h2-margin: false; +$x-normalize-typography-h3-margin: false; +$x-normalize-typography-blockquote-margin: rhythm(1) 40px; +$x-normalize-lists-lists-margin: rhythm(1) 0; diff --git a/partials/_base.scss b/partials/_base.scss index 9c71b6f..ff75a30 100644 --- a/partials/_base.scss +++ b/partials/_base.scss @@ -10,3 +10,4 @@ $headerFontSize: 24px; // // No styleguide reference. @import "base-compass"; +@import "base-normalize"; diff --git a/partials/_x-normalize.scss b/partials/_x-normalize.scss new file mode 100644 index 0000000..4cf2de3 --- /dev/null +++ b/partials/_x-normalize.scss @@ -0,0 +1,250 @@ +// fork of compass-h5bp 0.1.2, with overridable sizes +// +// No styleguide reference. +@import "h5bp"; + +$x-normalize-typography-p-margin: 1em 0 !default; +$x-normalize-typography-h1-fontsize: 2em !default; +$x-normalize-typography-h2-fontsize: 1.5em !default; +$x-normalize-typography-h3-fontsize: 1.17em !default; +$x-normalize-typography-h4-fontsize: 1em !default; +$x-normalize-typography-h5-fontsize: 0.83em !default; +$x-normalize-typography-h6-fontsize: 0.67em !default; +$x-normalize-typography-h1-margin: 0.67em 0 !default; +$x-normalize-typography-h2-margin: 0.83em 0 !default; +$x-normalize-typography-h3-margin: 1em 0 !default; +$x-normalize-typography-h4-margin: 1.33em 0 !default; +$x-normalize-typography-h5-margin: 1.67em 0 !default; +$x-normalize-typography-h6-margin: 2.33em 0 !default; +$x-normalize-typography-blockquote-margin: 1em 40px !default; +$x-normalize-typography-pre-fontsize: 1em !default; +$x-normalize-lists-lists-margin: 1em 0 !default; +$x-normalize-lists-dd-margin: 0 0 0 40px !default; +$x-normalize-lists-lists-padding: 0 0 0 40px !default; +$x-normalize-typography-small-fontsize: 80% !default; +$x-normalize-typography-supsub-fontsize: 75% !default; +$x-normalize-typography-sup-top: -0.5em !default; +$x-normalize-typography-sub-bottom: -0.25em !default; + +@mixin x-normalize { + @include x-normalize-display; + @include x-normalize-base; + @include x-normalize-links; + @include x-normalize-typography; + @include x-normalize-lists; + @include x-normalize-embeds; + @include x-normalize-figures; + @include x-normalize-forms; + @include x-normalize-tables; +} + +@mixin x-normalize-display { + @include h5bp-display; +} + +@mixin x-normalize-base { + @include h5bp-base; +} + +@mixin x-normalize-links { + @include h5bp-links; +} + +@mixin x-normalize-typography ( + $p-margin: $x-normalize-typography-p-margin, + $h1-fontsize: $x-normalize-typography-h1-fontsize, + $h2-fontsize: $x-normalize-typography-h2-fontsize, + $h3-fontsize: $x-normalize-typography-h3-fontsize, + $h4-fontsize: $x-normalize-typography-h4-fontsize, + $h5-fontsize: $x-normalize-typography-h5-fontsize, + $h6-fontsize: $x-normalize-typography-h6-fontsize, + $h1-margin: $x-normalize-typography-h1-margin, + $h2-margin: $x-normalize-typography-h2-margin, + $h3-margin: $x-normalize-typography-h3-margin, + $h4-margin: $x-normalize-typography-h4-margin, + $h5-margin: $x-normalize-typography-h5-margin, + $h6-margin: $x-normalize-typography-h6-margin, + $blockquote-margin: $x-normalize-typography-blockquote-margin, + $pre-fontsize: $x-normalize-typography-pre-fontsize, + $mall-fontsize: $x-normalize-typography-small-fontsize, + $supsub-fontsize: $x-normalize-typography-supsub-fontsize, + $sup-top: $x-normalize-typography-sup-top, + $sub-bottom: $x-normalize-typography-sub-bottom + ) { + + // Address font sizes and margins set differently in IE 6/7. + // Address font sizes within `section` and `article` in Firefox 4+, Safari 5, + // and Chrome. + h1 { + font-size: $h1-fontsize; + margin: $h1-margin; + } + + h2 { + font-size: $h2-fontsize; + margin: $h2-margin; + } + + h3 { + font-size: $h3-fontsize; + margin: $h3-margin; + } + + h4 { + font-size: $h4-fontsize; + margin: $h4-margin; + } + + h5 { + font-size: $h5-fontsize; + margin: $h5-margin; + } + + h6 { + font-size: $h6-fontsize; + margin: $h6-margin; + } + + // Address styling not present in IE 7/8/9, Safari 5, and Chrome. + abbr[title] { + border-bottom: 1px dotted; + } + + // Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. + b, + strong { + font-weight: bold; + } + + blockquote { + margin: $blockquote-margin; + } + + // Address styling not present in Safari 5 and Chrome. + dfn { + font-style: italic; + } + + // Address differences between Firefox and other browsers. + // Known issue: no IE 6/7 normalization. + hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; + } + + // Address styling not present in IE 6/7/8/9. + mark { + background: #ff0; + color: #000; + } + + // Address margins set differently in IE 6/7. + p, + pre { + margin: $p-margin; + } + + // Correct font family set oddly in IE 6, Safari 4/5, and Chrome. + code, + kbd, + pre, + samp { + font-family: monospace, serif; + _font-family: 'courier new', monospace; + font-size: $pre-fontsize; + } + + // Improve readability of pre-formatted text in all browsers. + pre { + white-space: pre; + white-space: pre-wrap; + word-wrap: break-word; + } + + // Address CSS quotes not supported in IE 6/7. + q { + quotes: none; + } + + // Address `quotes` property not supported in Safari 4. + q:before, + q:after { + content: ''; + content: none; + } + + // Address inconsistent and variable font size in all browsers. + small { + font-size: $mall-fontsize; + } + + // Prevent `sub` and `sup` affecting `line-height` in all browsers. + sub, + sup { + font-size: $supsub-fontsize; + line-height: 0; + position: relative; + vertical-align: baseline; + } + + sup { + top: $sup-top; + } + + sub { + bottom: $sub-bottom; + } + +} + +@mixin x-normalize-lists ( +// $margin-vertical: $x-normalize-lists-margin-vertical, + $lists-margin: $x-normalize-lists-lists-margin, + $dd-margin: $x-normalize-lists-dd-margin, + $lists-padding: $x-normalize-lists-lists-padding + ) { + + // Address margins set differently in IE 6/7. + dl, + menu, + ol, + ul { + margin: $lists-margin; + } + + dd { + margin: $dd-margin; + } + + // Address paddings set differently in IE 6/7. + menu, + ol, + ul { + padding: $lists-padding; + } + + // Correct list images handled incorrectly in IE 7. + nav ul, + nav ol { + list-style: none; + list-style-image: none; + } + +} + +@mixin x-normalize-embeds { + @include h5bp-embeds; +} + +@mixin x-normalize-figures { + @include h5bp-figures; +} + +@mixin x-normalize-forms { + @include h5bp-forms; +} + +@mixin x-normalize-tables { + @include h5bp-tables; +} @@ -1,37 +1,29 @@ @import "partials/base"; -@import "h5bp"; +@import "partials/x-normalize"; @import "../shared/themes/default/ikiwiki"; @import "compass/typography/lists"; // site defaults @import "compass/typography/vertical_rhythm"; -@include h5bp-normalize; +@include x-normalize; @include establish-baseline; -// patch normalize to fit rhythm -dl, -menu, -ol, -ul { - @include rhythm(1); -} - h1 { @include adjust-font-size-to(32px); - @include rhythm; + margin: 0; font-weight: normal; } h2 { @include adjust-font-size-to(24px); - @include rhythm; + margin: 0; } h3 { @include adjust-font-size-to(16px); - @include rhythm(1); + margin: rhythm(1) 0 0; font-weight: bold; } |