responsive

responsive.sass

=responsive($to)
  @if $to == phone
    @media only screen and (max-width: 479px)
      @content
  @else if $to == landscape
    @media only screen and (min-width: 480px) and (max-width: 767px)
      @content
  @else if $to == tablet
    @media only screen and (min-width: 768px) and (max-width: 959px)
      @content
  @else if type-of($to) == number
    @media only screen and (max-width: $to + px)
      @content
  @else if type-of($to) == list
    @media only screen and (min-width: nth($to, 1) + px) and (max-width: nth($to, 2) + px)
      @content
  @else
    @warn The mixin doesn't want what you're servin up. Check the documentation for usage details

// Usage

.header
  width: 200px
  float: left
  +responsive(phone)
    width: 100%
    color: blue