cask.sass

// cask.sass
// simple responsive mixins

$site-width-max: 1400px !default
$site-width-mid: 800px !default
$site-width-narrow: 480px !default

= min-width($width)
  @media screen and (min-width: #{$width})
    @content

= max-width($width)
  @media screen and (max-width: #{$width})
    @content

= tablet
  +max-width($site-width-mid)
    @content

= mobile
  +max-width($site-width-narrow)
    @content

= print
  @media print
    @content

= hide-print
  @media print
    display: none !important

= responsive($attr, $full, $mid:false, $narrow:false)
  #{$attr}: #{$full}
  @if $mid
    +max-width($site-width-mid)
      #{$attr}: #{$mid}
  @if $narrow
    +max-width($site-width-narrow)
      #{$attr}: #{$narrow}