// @doc off // The blueprint IE mixins should be mixed into a stylesheet that gets conditionally included // into IE like so: // <!–[if lt IE 8]><link rel=“stylesheet” href=“ie.css” // type=“text/css” media=“screen, projection”>–> // @doc on

//| Usage Examples //| ————– //| //| As a top-level mixin, apply to any page that includes the stylesheet: //| <pre class=“source-code sass”> //| +blueprint-ie //| </pre> //| Scoped by a presentational class: //| <pre class=“source-code sass”> //| body.blueprint //| +blueprint-ie(true) //| </pre> //| Scoped by semantic selectors: //| <pre class=“source-code sass”> //| body#page-1, body#page-2, body.a-special-page-type //| +blueprint-ie(true) //| </pre> //| Deprecated: You can pass the body selector as the first argument when used as a top-level mixin //| <pre class=“source-code sass”> //| +blueprint-ie(“body#page-1, body#page-2, body.a-special-page-type”) //| </pre> @mixin blueprint-ie($body_selector: body) {

@if $body_selector == true {
  @include blueprint-ie-body;
  @include blueprint-ie-defaults; }
@else {
  #{$body_selector} {
    @include blueprint-ie-body;
    @if $body_selector != "body" {
      @warn "[DEPRECATED] To specify a the selector \"#{$body_selector}\" to +blueprint-ie, pass true as the first argument and mix it into #{$body_selector}.";
      @include blueprint-ie-defaults; } }
  @if $body_selector == "body" {
    @include blueprint-ie-defaults; } } }

@mixin blueprint-ie-body {

text-align: center;
@include blueprint-ie-hacks; }

@mixin blueprint-ie-hacks {

* html & {
  legend {
    margin: 0px -8px 16px 0;
    padding: 0; } }
html>& {
  p code {
    *white-space: normal; } } }

// Fixes for Blueprint “inline” forms in IE @mixin blueprint-inline-form-ie {

div, p {
  vertical-align: middle; }
label {
  position: relative;
  top: -0.25em; }
input {
  &.checkbox, &.radio, &.button, button {
    margin: 0.5em 0; } } }

@mixin blueprint-ie-defaults {

.container {
  text-align: left; }
sup {
  vertical-align: text-top; }
sub {
  vertical-align: text-bottom; }
hr {
  margin: -8px auto 11px; }
img {
  -ms-interpolation-mode: bicubic; }
fieldset {
  padding-top: 0; }
textarea {
  overflow: auto; }
input {
  &.text {
    margin: 0.5em 0;
    background-color: white;
    border: 1px solid #bbbbbb;
    &:focus {
      border: 1px solid #666666; } }
  &.title {
    margin: 0.5em 0;
    background-color: white;
    border: 1px solid #bbbbbb;
    &:focus {
      border: 1px solid #666666; } }
  &.checkbox {
    position: relative;
    top: 0.25em; }
  &.radio {
    position: relative;
    top: 0.25em; }
  &.button {
    position: relative;
    top: 0.25em; } }
textarea {
  margin: 0.5em 0; }
select {
  margin: 0.5em 0; }
button {
  position: relative;
  top: 0.25em; } }