Contents

@mixin html5-boilerplate-media {
  @media print {
    @include media-print;
  }

  @media all and (orientation:portrait) { 
    @include media-orientation-portrait;
  }

  @media all and (orientation:landscape) {
    @include media-orientation-landscape;
  }

  @media screen and (max-device-width: 480px) {
    @include media-mobile;
  }
}

//
// print styles
// inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/

@mixin media-print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  /* Don't show links for images */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ 
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}


//
// Media queries for responsive design
// These follow after primary styles so they will successfully override.
//

@mixin media-orientation-portrait {
  // Style adjustments for portrait mode goes here
}

@mixin media-orientation-landscape {
  // Style adjustments for landscape mode goes here
}

// Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)  
// Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/
@mixin media-mobile($optimize: true) {
  // j.mp/textsizeadjust
  @if not $optimize {
    // don't allow iOS and WinMobile to mobile-optimize text
    html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; }
  }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
html5-boilerplate-0.2.6	stylesheets/html5-boilerplate/_media.scss
html5-boilerplate-0.2.5	stylesheets/html5-boilerplate/_media.scss