Source on Github

Blueprint Reset Utilities

Utility mixins for applying a reset and base styling.

This file can be imported using: @import "blueprint/reset/utilities"

Mixins

view source

=blueprint-global-reset
  html
    +blueprint-reset-box-model
  body
    @extend .bp-reset-element
  +blueprint-nested-reset
@mixin blueprint-global-reset {
  html {
    @include blueprint-reset-box-model;
  }
  body {
    @extend .bp-reset-element;
  }
  @include blueprint-nested-reset;
}

Global reset rules. For more specific resets, use the reset mixins provided below

view source

=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
    +blueprint-basic-reset
  #{headers(all)}
    +blueprint-basic-reset(bp-reset-element)
  #{elements-of-type(html5-block)}
    +blueprint-reset-html5-element(bp-reset-element)
  blockquote, q
    +blueprint-reset-quotation(bp-reset-element)
  th, td, caption
    +blueprint-reset-table-cell(bp-reset-element)
  table
    +blueprint-reset-table(bp-reset-element)
  a img
    border: none
@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;
  }
}

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.

view source

=blueprint-reset-html5-element($reset-base-class: false)
  @if $reset-base-class
    @extend .#{$reset-base-class}
  @else
    +blueprint-reset
  display: block
@mixin blueprint-reset-html5-element($reset-base-class: false) {
  @if $reset-base-class {
    @extend .#{$reset-base-class};
  }
  @else {
    @include blueprint-reset;
  }
  display: block;
}
view source

=blueprint-reset-box-model
  margin: 0
  padding: 0
  border: 0
@mixin blueprint-reset-box-model {
  margin: 0;
  padding: 0;
  border: 0;
}
view source

=blueprint-reset
  @warn "The blueprint-reset mixin is deprecated. Please use blueprint-basic-reset instead."
  +blueprint-basic-reset
@mixin blueprint-reset {
  @warn "The blueprint-reset mixin is deprecated. Please use blueprint-basic-reset instead.";
  @include blueprint-basic-reset;
}
view source

=blueprint-basic-reset($reset-base-class: false)
  @if $reset-base-class
    @extend .#{$reset-base-class}
  @else
    +blueprint-reset-box-model
    +blueprint-reset-typography
@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;
  }
}
view source

=blueprint-reset-typography
  font:
    weight: inherit
    style: inherit
    size: 100%
    family: inherit
  vertical-align: baseline
@mixin blueprint-reset-typography {
  font: {
    weight: inherit;
    style: inherit;
    size: 100%;
    family: inherit;
  };
  vertical-align: baseline;
}
view source

=blueprint-reset-quotation($reset-base-class: false)
  @if $reset-base-class
    @extend .#{$reset-base-class}
  @else
    +blueprint-reset
  quotes: "" ""
  &:before,
  &:after
    content: ""
@mixin blueprint-reset-quotation($reset-base-class: false) {
  @if $reset-base-class {
    @extend .#{$reset-base-class};
  }
  @else {
    @include blueprint-reset;
  }
  quotes: "" "";
  &:before,
  &:after {
    content: "";
  }
}
view source

=blueprint-reset-table-cell($reset-base-class: false)
  @if $reset-base-class
    @extend .#{$reset-base-class}
  @else
    +blueprint-reset
  float: none !important
  text-align: left
  font-weight: normal
  vertical-align: middle
@mixin blueprint-reset-table-cell($reset-base-class: false) {
  @if $reset-base-class {
    @extend .#{$reset-base-class};
  }
  @else {
    @include blueprint-reset;
  }
  float: none !important;
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
view source

=blueprint-reset-table($reset-base-class: false)
  @if $reset-base-class
    @extend .#{$reset-base-class}
  @else
    +blueprint-reset
  border-collapse: separate
  border-spacing: 0
  vertical-align: middle
@mixin blueprint-reset-table($reset-base-class: false) {
  @if $reset-base-class {
    @extend .#{$reset-base-class};
  }
  @else {
    @include blueprint-reset;
  }
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
}