linear-gradient.scss

linear-gradient.scss

$css3-ie-support: 0 !default;

@mixin linear-gradient($topColor, $bottomColor) {
    background-image: -moz-linear-gradient(top, $topColor, $bottomColor);
    background-image: -webkit-gradient(linear, left top, left bottom, from($topColor), to($bottomColor));
    
    // If you set the output style as "compressed", it doesn't work well... 
    @if $css3-ie-support == 1 {
        $ieTopColor: rgb(red($topColor), green($topColor), blue($topColor));
        $ieBottomColor: rgb(red($bottomColor), green($bottomColor), blue($bottomColor));
        filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#{$ieTopColor}', endColorstr='#{$ieBottomColor}'); // IE6 & IE7
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#{$ieTopColor}', endColorstr='#{$ieBottomColor}')"; // IE8
    }
}