github-migration/compass
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use placeholder selectors to make the blueprint reset module much cleaner.

Browse Source
This commit is contained in:
Chris Eppstein 2012-03-18 01:43:11 -07:00
parent 7a04b55aca
commit af645fa991
3 changed files with 43 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
frameworks/blueprint/stylesheets/blueprint/reset/_utilities.scss
View File

@ -1,32 +1,31 @@
// Global reset rules.
// For more specific resets, use the reset mixins provided below
@mixin blueprint-global-reset {
html { @include blueprint-reset-box-model; }
body { @extend .bp-reset-element; }
@include blueprint-nested-reset; }
html { @extend %bp-reset-box-model; }
body { @extend %bp-reset-element; }
@include blueprint-nested-reset;
}
// Reset all elements within some selector scope.To reset the selector itself,
// mixin the appropriate reset mixin for that element type as well. This could be
// useful if you want to style a part of your page in a dramatically different way.
@mixin blueprint-nested-reset {
.bp-reset-element,
div, span, object, iframe, p,
pre, a, abbr, acronym, address,
code, del, dfn, em, img,
dl, dt, dd, ol, ul, li, fieldset,
form, label, legend,
caption, tbody, tfoot, thead, tr { @include blueprint-basic-reset; }
#{headers(all)} { @include blueprint-basic-reset(bp-reset-element); }
#{elements-of-type(html5-block)} { @include blueprint-reset-html5-element(bp-reset-element); }
blockquote, q { @include blueprint-reset-quotation(bp-reset-element); }
th, td, caption { @include blueprint-reset-table-cell(bp-reset-element); }
table { @include blueprint-reset-table(bp-reset-element); }
a img { border: none; }
caption, tbody, tfoot, thead, tr { @extend %bp-reset-element; }
#{headers(all)} { @extend %bp-reset-element; }
#{elements-of-type(html5-block)} { @extend %bp-reset-html5-element; }
blockquote, q { @extend %bp-reset-quotation; }
th, td, caption { @extend %bp-reset-table-cell; }
table { @extend %bp-reset-table; }
a img { @extend %bp-reset-linked-image; }
}
@mixin blueprint-reset-html5-element($reset-base-class: false) {
@if $reset-base-class { @extend .#{$reset-base-class}; }
@else { @include blueprint-reset; }
@mixin blueprint-reset-html5-element {
@extend %bp-reset-element;
display: block;
}
@ -36,18 +35,9 @@
border: 0;
}
@mixin blueprint-reset {
@warn "The blueprint-reset mixin is deprecated. Please use blueprint-basic-reset instead.";
@include blueprint-basic-reset;
}
@mixin blueprint-basic-reset($reset-base-class: false) {
@if $reset-base-class {
@extend .#{$reset-base-class};
} @else {
@include blueprint-reset-box-model;
@include blueprint-reset-typography;
}
@mixin blueprint-basic-reset {
@include blueprint-reset-box-model;
@include blueprint-reset-typography;
}
@mixin blueprint-reset-typography {
@ -55,29 +45,36 @@
weight: inherit;
style: inherit;
size: 100%;
family: inherit; };
family: inherit;
}
vertical-align: baseline;
}
@mixin blueprint-reset-quotation($reset-base-class: false) {
@if $reset-base-class { @extend .#{$reset-base-class}; }
@else { @include blueprint-reset; }
@mixin blueprint-reset-quotation {
@extend %bp-reset-element;
quotes: "" "";
&:before,
&:after {
content: ""; } }
&:before, &:after { content: ""; }
}
@mixin blueprint-reset-table-cell($reset-base-class: false) {
@if $reset-base-class { @extend .#{$reset-base-class}; }
@else { @include blueprint-reset; }
@mixin blueprint-reset-table-cell {
@extend %bp-reset-element;
float: none !important;
text-align: left;
font-weight: normal;
vertical-align: middle; }
vertical-align: middle;
}
@mixin blueprint-reset-table($reset-base-class: false) {
@if $reset-base-class { @extend .#{$reset-base-class}; }
@else { @include blueprint-reset; }
@mixin blueprint-reset-table {
@extend %bp-reset-element;
border-collapse: separate;
border-spacing: 0;
vertical-align: middle; }
vertical-align: middle;
}
%bp-reset-box-model { @include blueprint-reset-box-model; }
%bp-reset-element { @include blueprint-basic-reset; }
%bp-reset-html5-element { @include blueprint-reset-html5-element; }
%bp-reset-quotation { @include blueprint-reset-quotation; }
%bp-reset-table-cell { @include blueprint-reset-table-cell; }
%bp-reset-table { @include blueprint-reset-table; }
%bp-reset-linked-image { border: none; }

37
test/fixtures/stylesheets/blueprint/css/single-imports/reset-utilities.css vendored
View File

@ -3,7 +3,7 @@ html {
padding: 0;
border: 0; }
.bp-reset-element, body, h1, h2, h3, h4, h5, h6, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, blockquote, q, th, td, caption, table, body.testing h1, body.testing h2, body.testing h3, body.testing h4, body.testing h5, body.testing h6, body.testing article, body.testing aside, body.testing details, body.testing figcaption, body.testing figure, body.testing footer, body.testing header, body.testing hgroup, body.testing menu, body.testing nav, body.testing section, body.testing summary, body.testing blockquote, body.testing q, body.testing th, body.testing td, body.testing caption, body.testing table, div, span, object, iframe, p, pre, a, abbr, acronym, address, code, del, dfn, em, img, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr {
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, blockquote, q, th, td, caption, table, body, div, span, object, iframe, p, pre, a, abbr, acronym, address, code, del, dfn, em, img, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, tbody, tfoot, thead, tr, h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
border: 0;
@ -18,7 +18,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav,
blockquote, q {
quotes: "" ""; }
blockquote:before, blockquote:after, q:before, q:after {
blockquote:before, q:before, blockquote:after, q:after {
content: ""; }
th, td, caption {
@ -34,36 +34,3 @@ table {
a img {
border: none; }
body.testing .bp-reset-element, body.testing body, body.testing h1, body.testing h2, body.testing h3, body.testing h4, body.testing h5, body.testing h6, body.testing article, body.testing aside, body.testing details, body.testing figcaption, body.testing figure, body.testing footer, body.testing header, body.testing hgroup, body.testing menu, body.testing nav, body.testing section, body.testing summary, body.testing blockquote, body.testing q, body.testing th, body.testing td, body.testing caption, body.testing table, body.testing h1, body.testing h2, body.testing h3, body.testing h4, body.testing h5, body.testing h6, body.testing article, body.testing aside, body.testing details, body.testing figcaption, body.testing figure, body.testing footer, body.testing header, body.testing hgroup, body.testing menu, body.testing nav, body.testing section, body.testing summary, body.testing blockquote, body.testing q, body.testing th, body.testing td, body.testing caption, body.testing table,
body.testing div, body.testing span, body.testing object, body.testing iframe, body.testing p,
body.testing pre, body.testing a, body.testing abbr, body.testing acronym, body.testing address,
body.testing code, body.testing del, body.testing dfn, body.testing em, body.testing img,
body.testing dl, body.testing dt, body.testing dd, body.testing ol, body.testing ul, body.testing li, body.testing fieldset,
body.testing form, body.testing label, body.testing legend,
body.testing caption, body.testing tbody, body.testing tfoot, body.testing thead, body.testing tr {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline; }
body.testing article, body.testing aside, body.testing details, body.testing figcaption, body.testing figure, body.testing footer, body.testing header, body.testing hgroup, body.testing menu, body.testing nav, body.testing section, body.testing summary {
display: block; }
body.testing blockquote, body.testing q {
quotes: "" ""; }
body.testing blockquote:before, body.testing blockquote:after, body.testing q:before, body.testing q:after {
content: ""; }
body.testing th, body.testing td, body.testing caption {
float: none !important;
text-align: left;
font-weight: normal;
vertical-align: middle; }
body.testing table {
border-collapse: separate;
border-spacing: 0;
vertical-align: middle; }
body.testing a img {
border: none; }

8
test/fixtures/stylesheets/blueprint/css/single-imports/reset.css vendored
View File

@ -3,13 +3,11 @@ html {
padding: 0;
border: 0; }
.bp-reset-element, body, h1, h2, h3, h4, h5, h6, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, blockquote, q, th, td, caption, table,
div, span, object, iframe, p,
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, blockquote, q, th, td, caption, table, body, div, span, object, iframe, p,
pre, a, abbr, acronym, address,
code, del, dfn, em, img,
dl, dt, dd, ol, ul, li, fieldset,
form, label, legend,
caption, tbody, tfoot, thead, tr {
form, label, legend, tbody, tfoot, thead, tr, h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
border: 0;
@ -24,7 +22,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav,
blockquote, q {
quotes: "" ""; }
blockquote:before, blockquote:after, q:before, q:after {
blockquote:before, q:before, blockquote:after, q:after {
content: ""; }
th, td, caption {