The latest version of Compass at the time of writing (0.12.0) doesn't add the -ms-
experimental prefix to linear-gradient
and radial-gradient
.
To find a way around this problem and make the gauge work smoothly also on IE10, we have to apply some modifications to our .scss
code. In particular, we need to change the
gauge-tick-marks
function inside _gauge.scss
as follows:
@function gauge-tick-marks($n, $rest, $ms){ $linear: null; @for $i from 1 through $n { $p: -90deg + 180 / ($n+1) * $i; $gradient: null; @if $ms == true { $gradient: -ms-linear-gradient( $p, transparent 46%, rgba(99,99,99,0.5) 47%, rgba(99,99,99,0.5) 53%, transparent 54%); } @else{ $gradient: linear-gradient( $p, transparent 46%, rgba(99,99,99,0.5) 47%, rgba(99,99,99,0.5) 53%, transparent 54%); } $linear: append($linear, $gradient, comma); } @if $ms == true { @return append($linear, #{'-ms-' + $rest} ); } @else{ @return append($linear...