diff --git a/bower.json b/bower.json index 87445dc..3e17d35 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "KNACSS", - "version": "3.0.9", + "version": "3.1.0", "homepage": "http://www.knacss.com/", "authors": [ "Raphaël GOETTER, Alsacreations" diff --git a/less/_00-config.less b/less/_00-config.less index 9032bff..10b1144 100644 --- a/less/_00-config.less +++ b/less/_00-config.less @@ -48,15 +48,6 @@ // misc (choose unit you prefer) @gutter : 20px; // gutter value for grid layouts. Unit can be: %, px, em, rem -// booleans -@enable-ie678 : true; // "true" to activate IE6/IE7/IE8 support -@enable-styling : true; // "true" to design basic elements like code, mark, blockquotes, etc. -@enable-gmaps : true; // if google maps is used -@enable-skip-links : true; // "true" to design skip links for accessibility concerns -@enable-hyphens : true; // activate automatic hyphens on small screens -@enable-helpers-width : true; // decide whether or not you need width helpers -@enable-helpers-spacing : true; // decide whether or not you need spacing helpers - // LESS mixins : don't touch or you'll be banned ;) // px to em/rem .rem(@size, @bf: @base-font-size){ diff --git a/less/_01-base.less b/less/_01-base.less index 3ae72ef..2d5ef7b 100644 --- a/less/_01-base.less +++ b/less/_01-base.less @@ -1,5 +1,5 @@ /*! -* www.KNACSS.com V3.0.9 (2014-09-12) @author: Raphael Goetter, Alsacreations +* www.KNACSS.com V3.1.0 (2014-10-20) @author: Raphael Goetter, Alsacreations * Licence WTFPL http://www.wtfpl.net/ */ diff --git a/less/_09-booleans.less b/less/_09-booleans.less index 39d0b90..e8a4380 100644 --- a/less/_09-booleans.less +++ b/less/_09-booleans.less @@ -1,44 +1,39 @@ /* ----------------------------- */ -/* ==booleans */ +/* ==skip-hyphens */ /* ----------------------------- */ -// skip-links boolean -& when (@enable-skip-links = true) { - /* styling skip links */ - .skip-links { + +/* styling skip links */ + +.skip-links { + position: absolute; + a { position: absolute; - - a { - position: absolute; - overflow: hidden; - clip: rect(1px, 1px, 1px, 1px); - padding: 0.5em; - background: black; - color: white; - text-decoration: none; - - &:focus { - position: static; - overflow: visible; - clip: auto; - } + overflow: hidden; + clip: rect(1px, 1px, 1px, 1px); + padding: 0.5em; + background: black; + color: white; + text-decoration: none; + &: focus { + position: static; + overflow: visible; + clip: auto; } } } -// hyphens boolean -& when (@enable-hyphens = true) { - @media (max-width: @small-screen) { - /* you shall not pass */ - div, - textarea, - table, - td, - th, - code, - pre, - samp { - word-wrap: break-word; - hyphens: auto; - } +// hyphens +@media (max-width: @small-screen) { + /* you shall not pass */ + div, + textarea, + table, + td, + th, + code, + pre, + samp { + word-wrap: break-word; + hyphens: auto; } -} +} \ No newline at end of file diff --git a/less/_10-gmaps.less b/less/_10-gmaps.less index 2276f55..93ac3b5 100644 --- a/less/_10-gmaps.less +++ b/less/_10-gmaps.less @@ -1,20 +1,18 @@ /* ----------------------------- */ /* ==gmaps support */ /* ----------------------------- */ -// google maps boolean -& when (@enable-gmaps = true) { - /* Google Gmap3 bug fix on images */ - .gm-style img { - height: 100%; - } - - :not(.gm-style) img { - height: auto; - } - - .gm-style img, - .gmnoscreen img, - .gmnoprint img { - max-width: none !important; - } + +/* Google Gmap3 bug fix on images */ +.gm-style img { + height: 100%; } + +:not(.gm-style) img { + height: auto; +} + +.gm-style img, +.gmnoscreen img, +.gmnoprint img { + max-width: none !important; +} \ No newline at end of file diff --git a/less/_11-ie.less b/less/_11-ie.less index 366b8b8..0bdb465 100644 --- a/less/_11-ie.less +++ b/less/_11-ie.less @@ -1,111 +1,107 @@ /* ----------------------------- */ /* ==IE6, IE7, IE8 support */ /* ----------------------------- */ -// IE6, 7, 8 support boolean -& when (@enable-ie678 = true) { - /* Active box-sizing for IE6/IE7 */ - /* @source https://github.com/Schepp/box-sizing-polyfill */ - - .ie67 * { - behavior: url(/js/boxsizing.htc); - } - - - .ie678 h1, .ie678 .h1-like { - @em: @h1-size * 10 / @base-font-size; - font-size: unit(round(@em,2), em); - } - - .ie678 h2, .ie678 .h2-like { - @em: @h2-size * 10 / @base-font-size; - font-size: unit(round(@em,2), em); - } - - .ie678 h3, .ie678 .h3-like { - @em: @h3-size * 10 / @base-font-size; - font-size: unit(round(@em,2), em); - } - - .ie678 h4, .ie678 .h4-like { - @em: @h4-size * 10 / @base-font-size; - font-size: unit(round(@em,2), em); - } - - .ie678 h5, .ie678 .h5-like { - @em: @h5-size * 10 / @base-font-size; - font-size: unit(round(@em,2), em); - } - - .ie678 h6, .ie678 .h6-like { - @em: @h6-size * 10 / @base-font-size; - font-size: unit(round(@em,2), em); - } - - /* @bugfix for IE8 */ - .ie678 img { - width: auto; - } - - .ie678 .gm-style img { - height: 100%; - } +/* Active box-sizing for IE6/IE7 */ +/* @source https://github.com/Schepp/box-sizing-polyfill */ - /* hasLayout for IE6/IE7 */ - .clearfix, - .line, - .mod, - .row, - .col { - *zoom: 1; - } - - /*! inline-block and table-cell for IE6/IE7 */ - /*! warning: .col needs width on IE6/IE7 */ - .btn, - .col, - .inbl { - *display: inline; - *zoom: 1; - } - - /* old syntax of clip for IE6/IE7 */ - .visually-hidden { - *clip: rect(1px 1px 1px 1px); - } - - /* IE8 grid hack */ - .ie8 .grid > *, - .ie8 [class*="autogrid"] > * { - letter-spacing: -0.31em; - text-rendering: optimizespeed; - } - - .ie8 .grid > * > *, - .ie8 [class*="autogrid"] > * > *{ - letter-spacing: normal; - word-spacing: normal; - text-rendering: auto; - } - - /* IE7 grid hack */ - .grid > * > *, - [class*="autogrid"] > * > *{ - *display: inline; - *zoom: 1; - } - - /* forms */ - /* Corrects excess space around these inputs in IE8/9 */ - .ie678 input[type="checkbox"], - .ie678 input[type="radio"] { - padding: 0; - } - - /* Removes default vertical scrollbar on empty textarea in IE6/7/8/9 */ - .ie678 textarea { - overflow: auto; - } - +.ie67 * { + behavior: url(/js/boxsizing.htc); } +.ie678 h1, .ie678 .h1-like { + @em: @h1-size * 10 / @base-font-size; + font-size: unit(round(@em,2), em); +} + +.ie678 h2, .ie678 .h2-like { + @em: @h2-size * 10 / @base-font-size; + font-size: unit(round(@em,2), em); +} + +.ie678 h3, .ie678 .h3-like { + @em: @h3-size * 10 / @base-font-size; + font-size: unit(round(@em,2), em); +} + +.ie678 h4, .ie678 .h4-like { + @em: @h4-size * 10 / @base-font-size; + font-size: unit(round(@em,2), em); +} + +.ie678 h5, .ie678 .h5-like { + @em: @h5-size * 10 / @base-font-size; + font-size: unit(round(@em,2), em); +} + +.ie678 h6, .ie678 .h6-like { + @em: @h6-size * 10 / @base-font-size; + font-size: unit(round(@em,2), em); +} + +/* @bugfix for IE8 */ +.ie678 img { + width: auto; +} + +.ie678 .gm-style img { + height: 100%; +} + +/* hasLayout for IE6/IE7 */ +.clearfix, +.line, +.mod, +.row, +.col { + *zoom: 1; +} + +/*! inline-block and table-cell for IE6/IE7 */ +/*! warning: .col needs width on IE6/IE7 */ +.btn, +.col, +.inbl { + *display: inline; + *zoom: 1; +} + +/* old syntax of clip for IE6/IE7 */ +.visually-hidden { + *clip: rect(1px 1px 1px 1px); +} + +/* IE8 grid hack */ +.ie8 .grid > *, +.ie8 [class*="autogrid"] > * { + letter-spacing: -0.31em; + text-rendering: optimizespeed; +} + +.ie8 .grid > * > *, +.ie8 [class*="autogrid"] > * > *{ + letter-spacing: normal; + word-spacing: normal; + text-rendering: auto; +} + +/* IE7 grid hack */ +.grid > * > *, +[class*="autogrid"] > * > *{ + *display: inline; + *zoom: 1; +} + +/* forms */ +/* Corrects excess space around these inputs in IE8/9 */ +.ie678 input[type="checkbox"], +.ie678 input[type="radio"] { + padding: 0; +} + +/* Removes default vertical scrollbar on empty textarea in IE6/7/8/9 */ +.ie678 textarea { + overflow: auto; +} + + diff --git a/less/_12-styling.less b/less/_12-styling.less index f5aceec..d16e54a 100644 --- a/less/_12-styling.less +++ b/less/_12-styling.less @@ -2,138 +2,135 @@ /* ==minor stylings */ /* ----------------------------- */ -// Styling boolean -& when (@enable-styling = true) { - /* styling elements */ - code, - kbd, - mark { - border-radius: 2px; - } - - kbd { - padding: 0 2px; - border: 1px solid #999; - } - - code { - padding: 2px 4px; - background: rgba(0,0,0,0.04); - color: #b11; - } - - pre code { - padding: none; - background: none; - color: inherit; - border-radius: 0; - } - - mark { - padding:2px 4px; - background: #ff0; - } - - sup, - sub { - vertical-align: 0; - position: relative; - } - - sup { - bottom: 1ex; - } - - sub { - top: 0.5ex; - } - - blockquote { - position: relative; - padding-left: 3em; - } - blockquote:before { - content: "\201C"; - position: absolute; - left: 0; - top: 0; - font-family: georgia, serif; - font-size: 5em; - line-height: 0.9; - color: rgba(0, 0, 0, .3); - } - blockquote > footer { - margin-top: .75em; - font-size: 0.9em; - color: rgba(0, 0, 0, .7); - } - blockquote > footer:before { - content: "\2014 \0020"; - } - - - q { - font-style: normal; - } - - q, - .q { - quotes: "“\00a0" "\00a0”"; - } - - q:lang(fr), - .q:lang(fr) { - quotes: "«\00a0" "\00a0»"; - } - - hr { - display: block; - clear: both; - height: 1px; - margin: 1em 0 2em; - padding: 0; - border: 0; - color: #ccc; - background-color: #ccc; - } - - /* alternate tables */ - .alternate { border: 0; } - .alternate tbody { - border: 1px solid #ccc; - } - - .alternate thead tr > * + * { - border-left: 0; - } - - .alternate tbody tr > * + * { - border-left: 1px solid #ccc; - } - - /* alternate-vert tables */ - .alternate-vert { - border: 0; - border-right: 1px solid #ccc; - } - - .alternate-vert tr > :first-child { - border-bottom: 0; - } - - .alternate-vert tr > * + * { - border-top: 1px solid #ccc; - } - - /* striped tables */ - .striped tbody tr:nth-child(odd) { - background: #eee; - background: rgba(0, 0, 0, .05); - } - - /* striped-vert tables */ - .striped-vert tr > :first-child { - background: #eee; - background: rgba(0, 0, 0, .05); - } +/* styling elements */ +code, +kbd, +mark { + border-radius: 2px; +} + +kbd { + padding: 0 2px; + border: 1px solid #999; +} + +code { + padding: 2px 4px; + background: rgba(0,0,0,0.04); + color: #b11; +} + +pre code { + padding: none; + background: none; + color: inherit; + border-radius: 0; +} + +mark { + padding:2px 4px; + background: #ff0; +} + +sup, +sub { + vertical-align: 0; + position: relative; +} + +sup { + bottom: 1ex; +} + +sub { + top: 0.5ex; +} + +blockquote { + position: relative; + padding-left: 3em; +} +blockquote:before { + content: "\201C"; + position: absolute; + left: 0; + top: 0; + font-family: georgia, serif; + font-size: 5em; + line-height: 0.9; + color: rgba(0, 0, 0, .3); +} +blockquote > footer { + margin-top: .75em; + font-size: 0.9em; + color: rgba(0, 0, 0, .7); +} +blockquote > footer:before { + content: "\2014 \0020"; +} + + +q { + font-style: normal; +} + +q, +.q { + quotes: "“\00a0" "\00a0”"; +} + +q:lang(fr), +.q:lang(fr) { + quotes: "«\00a0" "\00a0»"; +} + +hr { + display: block; + clear: both; + height: 1px; + margin: 1em 0 2em; + padding: 0; + border: 0; + color: #ccc; + background-color: #ccc; +} + +/* alternate tables */ +.alternate { border: 0; } +.alternate tbody { + border: 1px solid #ccc; +} + +.alternate thead tr > * + * { + border-left: 0; +} + +.alternate tbody tr > * + * { + border-left: 1px solid #ccc; +} + +/* alternate-vert tables */ +.alternate-vert { + border: 0; + border-right: 1px solid #ccc; +} + +.alternate-vert tr > :first-child { + border-bottom: 0; +} + +.alternate-vert tr > * + * { + border-top: 1px solid #ccc; +} + +/* striped tables */ +.striped tbody tr:nth-child(odd) { + background: #eee; + background: rgba(0, 0, 0, .05); +} + +/* striped-vert tables */ +.striped-vert tr > :first-child { + background: #eee; + background: rgba(0, 0, 0, .05); } diff --git a/sass/_00-config.scss b/sass/_00-config.scss index 197dedd..a559d02 100644 --- a/sass/_00-config.scss +++ b/sass/_00-config.scss @@ -48,16 +48,6 @@ $ultra-large-screen : 1920px; // ultra large screens // misc (choose unit you prefer) $gutter : 20px; // gutter value for grid layouts. Unit can be: %, px, em, rem -// booleans -$enable-ie678 : true; // "true" to activate IE6/IE7/IE8 support -$enable-styling : true; // "true" to design basic elements like code, mark, blockquotes, etc. -$enable-gmaps : true; // if google maps is used -$enable-skip-links : true; // "true" to design skip links for accessibility concerns -$enable-hyphens : true; // activate automatic hyphens on small screens -$enable-helpers-width : true; // decide whether or not you need width helpers -$enable-helpers-spacing : true; // decide whether or not you need spacing helpers - - // Sass mixins : don't touch or you'll be banned ;) // px to em/rem diff --git a/sass/_01-base.scss b/sass/_01-base.scss index dc7323f..4846e77 100644 --- a/sass/_01-base.scss +++ b/sass/_01-base.scss @@ -1,5 +1,5 @@ /*! -* www.KNACSS.com V3.0.9 (2014-09-12) @author: Raphael Goetter, Alsacreations (with help from Hugo Giraudel) +* www.KNACSS.com V3.1.0 (2014-10-20) @author: Raphael Goetter, Alsacreations (with help from Hugo Giraudel) * Licence WTFPL http://www.wtfpl.net/ */ diff --git a/sass/_09-booleans.scss b/sass/_09-booleans.scss index 6f274f1..412d2f2 100644 --- a/sass/_09-booleans.scss +++ b/sass/_09-booleans.scss @@ -1,44 +1,40 @@ /* ----------------------------- */ -/* ==booleans */ +/* ==skip-hyphens */ /* ----------------------------- */ -// skip-links boolean -@if $enable-skip-links == true { - /* styling skip links */ - .skip-links { - position: absolute; +/* styling skip links */ +.skip-links { + position: absolute; - a { - position: absolute; - overflow: hidden; - clip: rect(1px, 1px, 1px, 1px); - padding: 0.5em; - background: black; - color: white; - text-decoration: none; - - &:focus { - position: static; - overflow: visible; - clip: auto; - } + a { + position: absolute; + overflow: hidden; + clip: rect(1px, 1px, 1px, 1px); + padding: 0.5em; + background: black; + color: white; + text-decoration: none; + + &:focus { + position: static; + overflow: visible; + clip: auto; } } } // hyphens boolean -@if $enable-hyphens == true { - @media (max-width: $small-screen) { - /* you shall not pass */ - div, - textarea, - table, - td, - th, - code, - pre, - samp { - word-wrap: break-word; - hyphens: auto; - } +@media (max-width: $small-screen) { + /* you shall not pass */ + div, + textarea, + table, + td, + th, + code, + pre, + samp { + word-wrap: break-word; + hyphens: auto; } } + diff --git a/sass/_10-gmaps.scss b/sass/_10-gmaps.scss index c4fa06d..3364e8b 100644 --- a/sass/_10-gmaps.scss +++ b/sass/_10-gmaps.scss @@ -1,20 +1,18 @@ /* ----------------------------- */ /* ==gmaps support */ /* ----------------------------- */ -// google maps boolean -@if $enable-gmaps == true { - /* Google Gmap3 bug fix on images */ - .gm-style img { - height: 100%; - } - - :not(.gm-style) img { - height: auto; - } - - .gm-style img, - .gmnoscreen img, - .gmnoprint img { - max-width: none !important; - } + +/* Google Gmap3 bug fix on images */ +.gm-style img { + height: 100%; +} + +:not(.gm-style) img { + height: auto; +} + +.gm-style img, +.gmnoscreen img, +.gmnoprint img { + max-width: none !important; } diff --git a/sass/_11-ie.scss b/sass/_11-ie.scss index 272afa6..a222cdd 100644 --- a/sass/_11-ie.scss +++ b/sass/_11-ie.scss @@ -2,112 +2,110 @@ /* ==IE6, IE7, IE8 support */ /* ----------------------------- */ // IE6, 7, 8 support boolean -@if $enable-ie678 == true { - $bf: $base-font-size / 1px; - /* IE678 support */ - .ie678 h1, .ie678 .h1-like { - $val: $h1-size / 1rem; - $em : $val * 10 / $bf; - font-size: $em +0em; - } - - .ie678 h2, .ie678 .h2-like { - $val: $h2-size / 1rem; - $em : $val * 10 / $bf; - font-size: $em +0em; - } - - .ie678 h3, .ie678 .h3-like { - $val: $h3-size / 1rem; - $em : $val * 10 / $bf; - font-size: $em +0em; - } - - .ie678 h4, .ie678 .h4-like { - $val: $h4-size / 1rem; - $em : $val * 10 / $bf; - font-size: $em +0em; - } - - .ie678 h5, .ie678 .h5-like { - $val: $h5-size / 1rem; - $em : $val * 10 / $bf; - font-size: $em +0em; - } - - .ie678 h6, .ie678 .h6-like { - $val: $h6-size / 1rem; - $em : $val * 10 / $bf; - font-size: $em +0em; - } - - .ie678 img { - width: auto; /* @bugfix for IE8 */ - } - - .ie678 .gm-style img { - height: 100%; - } +$bf: $base-font-size / 1px; +/* IE678 support */ +.ie678 h1, .ie678 .h1-like { + $val: $h1-size / 1rem; + $em : $val * 10 / $bf; + font-size: $em +0em; +} - /* hasLayout for IE6/IE7 */ - .clearfix, - .line, - .mod, - .row, - .col { - *zoom: 1; - } - - /* inline-block and table-cell for IE6/IE7 */ - /* warning: .col needs width on IE6/IE7 */ - .btn, - .col, - .inbl { - *display: inline; - *zoom: 1; - } - .visually-hidden { - *clip: rect(1px 1px 1px 1px); - } - - /* IE8 grid hack */ - .ie8 .grid > *, - .ie8 [class*="autogrid"] > * { - letter-spacing: -0.31em; - text-rendering: optimizespeed; - } - - .ie8 .grid > * > *, - .ie8 [class*="autogrid"] > * > *{ - letter-spacing: normal; - word-spacing: normal; - text-rendering: auto; - } +.ie678 h2, .ie678 .h2-like { + $val: $h2-size / 1rem; + $em : $val * 10 / $bf; + font-size: $em +0em; +} - /* IE7 grid hack */ - .grid > * > *, - [class*="autogrid"] > * > *{ - *display: inline; - *zoom: 1; - } - - /* forms */ - /* Corrects excess space around these inputs in IE8/9 */ - .ie678 input[type="checkbox"], - .ie678 input[type="radio"] { - padding: 0; - } - - /* Removes default vertical scrollbar on empty textarea in IE6/7/8/9 */ - .ie678 textarea { - overflow: auto; - } +.ie678 h3, .ie678 .h3-like { + $val: $h3-size / 1rem; + $em : $val * 10 / $bf; + font-size: $em +0em; +} - /* Active box-sizing for IE6/IE7 */ - /* @source https://github.com/Schepp/box-sizing-polyfill */ - /* - .ie67 * { - behavior: url(/lib/box-sizing-polyfill/boxsizing.htc); - } - */ -} \ No newline at end of file +.ie678 h4, .ie678 .h4-like { + $val: $h4-size / 1rem; + $em : $val * 10 / $bf; + font-size: $em +0em; +} + +.ie678 h5, .ie678 .h5-like { + $val: $h5-size / 1rem; + $em : $val * 10 / $bf; + font-size: $em +0em; +} + +.ie678 h6, .ie678 .h6-like { + $val: $h6-size / 1rem; + $em : $val * 10 / $bf; + font-size: $em +0em; +} + +.ie678 img { + width: auto; /* @bugfix for IE8 */ +} + +.ie678 .gm-style img { + height: 100%; +} + +/* hasLayout for IE6/IE7 */ +.clearfix, +.line, +.mod, +.row, +.col { + *zoom: 1; +} + +/* inline-block and table-cell for IE6/IE7 */ +/* warning: .col needs width on IE6/IE7 */ +.btn, +.col, +.inbl { + *display: inline; + *zoom: 1; +} +.visually-hidden { + *clip: rect(1px 1px 1px 1px); +} + +/* IE8 grid hack */ +.ie8 .grid > *, +.ie8 [class*="autogrid"] > * { + letter-spacing: -0.31em; + text-rendering: optimizespeed; +} + +.ie8 .grid > * > *, +.ie8 [class*="autogrid"] > * > *{ + letter-spacing: normal; + word-spacing: normal; + text-rendering: auto; +} + +/* IE7 grid hack */ +.grid > * > *, +[class*="autogrid"] > * > *{ + *display: inline; + *zoom: 1; +} + +/* forms */ + /* Corrects excess space around these inputs in IE8/9 */ +.ie678 input[type="checkbox"], +.ie678 input[type="radio"] { + padding: 0; +} + +/* Removes default vertical scrollbar on empty textarea in IE6/7/8/9 */ +.ie678 textarea { + overflow: auto; +} + +/* Active box-sizing for IE6/IE7 */ +/* @source https://github.com/Schepp/box-sizing-polyfill */ +/* +.ie67 * { + behavior: url(/lib/box-sizing-polyfill/boxsizing.htc); +} +*/ \ No newline at end of file diff --git a/sass/_12-styling.scss b/sass/_12-styling.scss index 65cb98b..e4072bb 100644 --- a/sass/_12-styling.scss +++ b/sass/_12-styling.scss @@ -2,135 +2,132 @@ /* ==minor stylings */ /* ----------------------------- */ -// Styling boolean -@if $enable-styling == true { - /* styling elements */ - code, kbd, mark { - border-radius: 2px; - } - - kbd { - padding: 0 2px; - border: 1px solid #999; - } - - code { - padding: 2px 4px; - background: rgba(0,0,0,0.04); - color: #b11; - } - - pre code { - padding: none; - background: none; - color: inherit; - border-radius: 0; - } - - mark { - padding:2px 4px; - background: #ff0; - } - - sup, - sub { - vertical-align: 0; - position: relative; - } - - sup { - bottom: 1ex; - } - - sub { - top: 0.5ex; - } - - blockquote { - position: relative; - padding-left: 3em; - } - blockquote:before { - content: "\201C"; - position: absolute; - left: 0; - top: 0; - font-family: georgia, serif; - font-size: 5em; - line-height: 0.9; - color: rgba(0, 0, 0, .3); - } - blockquote > footer { - margin-top: .75em; - font-size: 0.9em; - color: rgba(0, 0, 0, .7); - } - blockquote > footer:before { - content: "\2014 \0020"; - } - - q { - font-style: normal; - } - - q, - .q { - quotes: "“\00a0" "\00a0”"; - } - - q:lang(fr), - .q:lang(fr) { - quotes: "«\00a0" "\00a0»"; - } - - hr { - display: block; - clear: both; - height: 1px; - margin: 1em 0 2em; - padding: 0; - border: 0; - color: #ccc; - background-color: #ccc; - } - - /* alternate tables */ - .alternate { border: 0; } - .alternate tbody { - border: 1px solid #ccc; - } - - .alternate thead tr > * + * { - border-left: 0; - } - - .alternate tbody tr > * + * { - border-left: 1px solid #ccc; - } - - /* alternate-vert tables */ - .alternate-vert { - border: 0; - border-right: 1px solid #ccc; - } - - .alternate-vert tr > :first-child { - border-bottom: 0; - } - - .alternate-vert tr > * + * { - border-top: 1px solid #ccc; - } - - /* striped tables */ - .striped tbody tr:nth-child(odd) { - background: #eee; - background: rgba(0, 0, 0, .05); - } - - /* striped-vert tables */ - .striped-vert tr > :first-child { - background: #eee; - background: rgba(0, 0, 0, .05); - } +/* styling elements */ +code, kbd, mark { + border-radius: 2px; +} + +kbd { + padding: 0 2px; + border: 1px solid #999; +} + +code { + padding: 2px 4px; + background: rgba(0,0,0,0.04); + color: #b11; +} + +pre code { + padding: none; + background: none; + color: inherit; + border-radius: 0; +} + +mark { + padding:2px 4px; + background: #ff0; +} + +sup, +sub { + vertical-align: 0; + position: relative; +} + +sup { + bottom: 1ex; +} + +sub { + top: 0.5ex; +} + +blockquote { + position: relative; + padding-left: 3em; +} +blockquote:before { + content: "\201C"; + position: absolute; + left: 0; + top: 0; + font-family: georgia, serif; + font-size: 5em; + line-height: 0.9; + color: rgba(0, 0, 0, .3); +} +blockquote > footer { + margin-top: .75em; + font-size: 0.9em; + color: rgba(0, 0, 0, .7); +} +blockquote > footer:before { + content: "\2014 \0020"; +} + +q { + font-style: normal; +} + +q, +.q { + quotes: "“\00a0" "\00a0”"; +} + +q:lang(fr), +.q:lang(fr) { + quotes: "«\00a0" "\00a0»"; +} + +hr { + display: block; + clear: both; + height: 1px; + margin: 1em 0 2em; + padding: 0; + border: 0; + color: #ccc; + background-color: #ccc; +} + +/* alternate tables */ +.alternate { border: 0; } +.alternate tbody { + border: 1px solid #ccc; +} + +.alternate thead tr > * + * { + border-left: 0; +} + +.alternate tbody tr > * + * { + border-left: 1px solid #ccc; +} + +/* alternate-vert tables */ +.alternate-vert { + border: 0; + border-right: 1px solid #ccc; +} + +.alternate-vert tr > :first-child { + border-bottom: 0; +} + +.alternate-vert tr > * + * { + border-top: 1px solid #ccc; +} + +/* striped tables */ +.striped tbody tr:nth-child(odd) { + background: #eee; + background: rgba(0, 0, 0, .05); +} + +/* striped-vert tables */ +.striped-vert tr > :first-child { + background: #eee; + background: rgba(0, 0, 0, .05); }