Responsive, semantic markup using Twitter Bootstrap and Sass/SCSS

While working on the front-end for an upcoming conference website using Twitter Bootstrap (via bootstrap-sass), I tried to use the default semantic markup helper mixins (makeRow() and makeColumn()) but found that they were not responsive.

Here are some helper mixins I created to fix that problem.

@mixin respond-to($media) {
    @if $media == phone {
        @media (max-width: 767px) { @content; }
    }
    @if $media == except-phone {
        @media (min-width: 768px) { @content; }
    }
    @if $media == tablet {
        @media (min-width: 768px) and (max-width: 979px) { @content; }
    }
    @if $media == desktop {
        @media (min-width: 1200px) { @content; }
    }
}

@mixin row() {
    margin-left: $gridGutterWidth * -1;
    @media (max-width: 767px) { margin-left: 0; }
    @media (min-width: 768px) and (max-width: 979px) { margin-left: $gridGutterWidth768 * -1; }
    @media (min-width: 1200px) { margin-left: $gridGutterWidth1200 * -1; }
    @include clearfix();
}

@mixin column($columns: 1, $offset: 0) {
    float: left;
    margin-left: ($gridColumnWidth * $offset) + ($gridGutterWidth * ($offset - 1)) + ($gridGutterWidth * 2);
    width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1));
    @media (max-width: 767px) {
        float: none;
        display: block;
        width: 100%;
        margin-left: 0;
        @include box-sizing(border-box);
    }
    @media (min-width: 768px) and (max-width: 979px) {
    margin-left: ($gridColumnWidth768 * $offset) + ($gridGutterWidth768 * ($offset - 1)) + ($gridGutterWidth768 * 2);
    width: ($gridColumnWidth768 * $columns) + ($gridGutterWidth768 * ($columns - 1));
}
    @media (min-width: 1200px) {
        margin-left: ($gridColumnWidth1200 * $offset) + ($gridGutterWidth1200 * ($offset - 1)) + ($gridGutterWidth1200 * 2);
        width: ($gridColumnWidth1200 * $columns) + ($gridGutterWidth1200 * ($columns - 1));
    }
}

You can find the maintained and updated code here: https://gist.github.com/4527826