bootstrap-sass mixin for responsive designs

respond_to.sass

// bootstrap-sass mixin for responsive designs
// this mixin requires sass support for content blocks (sass >= 3.2.0)

// Media widths:
// http://twitter.github.com/bootstrap/scaffolding.html#responsive
// https://github.com/digineo/bootstrap-sass/commit/20828376f7cf72ec1ca808633dde186c5682ea97

=respond-to($media)
  @if $media == phone
    @media only screen and (max-width: $mediaPhone)
      @content
  @else if $media == tablet
    @media only screen and (max-width: $mediaTablet - 1)
      @content
  @else if $media == portrait
    @media only screen and (min-width: $mediaTablet) and (max-width: $mediaDesktop - 1)
      @content
  @else if $media == desktop
    @media only screen and (min-width: $mediaDesktop)
      @content
  @else if $media == large
    @media only screen and (min-width: $mediaLarge)
      @content

Usage:

.your-selector
  +respond-to(tablet)
    width: 95%
    margin: auto

This is very cool. I'll see what we can do with it.