Contents

// https://gist.github.com/1215856#file_7_media_queries.sass

$respond-to-handhelds-max: 479px !default

$respond-to-wide-handhelds-min: ($respond-to-handhelds-max + 1px) !default
$respond-to-wide-handhelds-max: 767px !default

$respond-to-high-handhelds-max: 568px !default

$respond-to-tablets-min: ($respond-to-wide-handhelds-max + 1) !default
$respond-to-tablets-max: 959px !default

$respond-to-desktops-min: ($respond-to-tablets-max + 1) !default

=respond-to($device)
  @if $device == handhelds
    @media only screen and (max-width: $respond-to-handhelds-max)
      @content
  @else if $device == high-handhelds
    @media only screen and (max-width: $respond-to-handhelds-max) and (device-height: $respond-to-high-handhelds-max)
      @content
  @else if $device == wide-handhelds
    @media only screen and (min-width: $respond-to-wide-handhelds-min) and (max-width: $respond-to-wide-handhelds-max)
      @content
  @else if $device == tablets
    @media only screen and (min-width: $respond-to-tablets-min) and (max-width: $respond-to-tablets-max)
      @content
  @else if $device == desktops
    @media only screen and (min-width: $respond-to-desktops-min)
      @content
  @else if $device == retina
    @media only screen and (-webkit-min-device-pixel-ratio: 2)
      @content
  @else if $device == landscape
    @media only screen and (orientation: landscape)
      @content
  @else if $device == portrait
    @media only screen and (orientation: portrait)
      @content

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
compass-respond-0.3.0	lib/stylesheets/_respond-to.sass