From b822f648e63bcde3550d960aa21b8746bf70b8ab Mon Sep 17 00:00:00 2001 From: David Rapson Date: Wed, 2 May 2012 14:44:42 +0100 Subject: [PATCH 1/5] default-family helper variable --- style/scss/_variables.scss | 7 ++++--- style/scss/common/_typography.scss | 2 +- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/style/scss/_variables.scss b/style/scss/_variables.scss index c34c968..80c4b3e 100644 --- a/style/scss/_variables.scss +++ b/style/scss/_variables.scss @@ -44,8 +44,9 @@ $notice-color : #66b; $base-fs : 16; // Base font-size $base-lh : 24; // Base line-height +$sans-family : Verdana, sans-serif; +$serif-family : Georgia, serif; +$default-family : $sans-family; $display-family : "Helvetica Neue", Helvetica, Arial, sans-serif; -$caption-family : verdana, sans-serif; -$sans-family : verdana, sans-serif; -$serif-family : georgia, serif; +$caption-family : Verdana, sans-serif; $monospace-family : "Menlo", "Bitstream Vera Sans", Monaco, "Andale Mono", "Lucida Console", "Droid Mono", monospace; diff --git a/style/scss/common/_typography.scss b/style/scss/common/_typography.scss index 098dc63..a304669 100644 --- a/style/scss/common/_typography.scss +++ b/style/scss/common/_typography.scss @@ -7,7 +7,7 @@ body { font: #{$base-fs/16*100}%/($base-lh/$base-fs) sans-serif; } ---------------------------------------------------------------------- */ /* Default font stack */ - body, select, input, textarea, button { font-family: $sans-family; } + body, select, input, textarea, button { font-family: $default-family; } /* Display font stack */ h1,h2,h3,h4,h5,h6 { font-family: $display-family; } From 87c8d1f8946e277619f072f7bb2a6c68dbc35526 Mon Sep 17 00:00:00 2001 From: David Rapson Date: Wed, 2 May 2012 14:45:16 +0100 Subject: [PATCH 2/5] Convert mixed tabs to spaces --- style/scss/_variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/style/scss/_variables.scss b/style/scss/_variables.scss index 80c4b3e..5dac24b 100644 --- a/style/scss/_variables.scss +++ b/style/scss/_variables.scss @@ -46,7 +46,7 @@ $base-lh : 24; // Base line-height $sans-family : Verdana, sans-serif; $serif-family : Georgia, serif; -$default-family : $sans-family; +$default-family : $sans-family; $display-family : "Helvetica Neue", Helvetica, Arial, sans-serif; $caption-family : Verdana, sans-serif; $monospace-family : "Menlo", "Bitstream Vera Sans", Monaco, "Andale Mono", "Lucida Console", "Droid Mono", monospace; From 96b5a74bf01432c21f43654abee1c374257cb406 Mon Sep 17 00:00:00 2001 From: David Rapson Date: Wed, 2 May 2012 14:45:38 +0100 Subject: [PATCH 3/5] Sync _print styles with H5BP --- style/scss/media/_print.scss | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/style/scss/media/_print.scss b/style/scss/media/_print.scss index 3e730cd..442bf1f 100644 --- a/style/scss/media/_print.scss +++ b/style/scss/media/_print.scss @@ -1,19 +1,19 @@ /*= @group Print ---------------------------------------------------------------------- */ - @media print { +@media print { - * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */ - a, a:visited { color: #444 !important; text-decoration: underline; } + * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; } /* Black prints faster: h5bp.com/s */ + a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } - .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ + .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } - thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ + thead { display: table-header-group; } /* h5bp.com/t */ tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } - h2, h3{ page-break-after: avoid; } + h2, h3 { page-break-after: avoid; } - } \ No newline at end of file +} From 125ab04910b2701fe7c29095aa57a963af8ddca2 Mon Sep 17 00:00:00 2001 From: David Rapson Date: Wed, 2 May 2012 14:46:17 +0100 Subject: [PATCH 4/5] Comment out default media queries --- style/scss/media/_respond.scss | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/style/scss/media/_respond.scss b/style/scss/media/_respond.scss index e3af586..57e741d 100644 --- a/style/scss/media/_respond.scss +++ b/style/scss/media/_respond.scss @@ -2,12 +2,12 @@ ---------------------------------------------------------------------- */ // Default @media declarations from HTML5 Boilerplate. Modify as required -@media only screen and (min-width: 480px) { - /* Style adjustments for viewports 480px and over go here */ +// @media only screen and (min-width: 480px) { +// /* Style adjustments for viewports 480px and over go here */ -} +// } -@media only screen and (min-width: 768px) { - /* Style adjustments for viewports 768px and over go here */ +// @media only screen and (min-width: 768px) { +// /* Style adjustments for viewports 768px and over go here */ -} \ No newline at end of file +// } \ No newline at end of file From 9baad33d9f0da112282082509b598b74f1cf6ccc Mon Sep 17 00:00:00 2001 From: David Rapson Date: Wed, 2 May 2012 15:19:42 +0100 Subject: [PATCH 5/5] Release 0.9.3 --- README.md | 3 ++- style/scss/style.scss | 15 ++++----------- 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index 74bdf0f..f72e5a4 100644 --- a/README.md +++ b/README.md @@ -13,7 +13,8 @@ Styles are broken down into the following groups: **Reset, Typography, Elements, This project attempts to adhere to the [Semantic Versioning Specification](http://semver.org/) as much as possible. -- **0.9.2** relative-size function now uses $base-fs as a default value for $context so it can be used with a single argument +- **0.9.3** Don't wrap layout styles in @media screen { } call. Causes issues with inline media queries. +- 0.9.2 relative-size function now uses $base-fs as a default value for $context so it can be used with a single argument - 0.9.1 Reset styles in sync with HTML5 Boilerplate 3. Including removal of hot pink. - 0.9.0 Added base font-size and line-height variables to help when defining a baseline rhythm - 0.8.1 Minor bugfix, borked comment stopping styles from compiling diff --git a/style/scss/style.scss b/style/scss/style.scss index d272675..2b25a9b 100644 --- a/style/scss/style.scss +++ b/style/scss/style.scss @@ -26,18 +26,11 @@ @import "common/reset", "common/typography", "common/elements"; // Layout -// Layout = major components, e.g., header, footer etc. -// Module = minor components, e.g., navigation bar, callout, widgets etc. -// State = a state is something that augments + overrides all other styles, e.g., success or error state -// -// The @media declaration ensures that every medium gets typography and colour styles, -// but only mediums which implement `screen` get the layout styles. -// -// This has the added benefit of being ignored by older browsers (I mean *really* old, e.g. Netscape 4), -// so if for any reason the site *is* viewed by legacy browsers they just get basic, but accessible, styling. -// - from Adaptive Web Design, http://easy-readers.net/ +// Layout = major components, e.g., header, footer etc. +// Module = minor components, e.g., navigation bar, callout, widgets etc. +// State = a state is something that augments + overrides all other styles, e.g., success or error state -@media screen { @import "components/layout", "components/module", "components/state"; } +@import "components/layout", "components/module", "components/state"; // Media queries @import "media/respond";