diff --git a/app/assets/stylesheets/_bourbon.scss b/app/assets/stylesheets/_bourbon.scss index adf3830e2..fc0df2d52 100644 --- a/app/assets/stylesheets/_bourbon.scss +++ b/app/assets/stylesheets/_bourbon.scss @@ -55,6 +55,7 @@ @import "addons/html5-input-types"; @import "addons/position"; @import "addons/prefixer"; +@import "addons/rem"; @import "addons/retina-image"; @import "addons/size"; @import "addons/timing-functions"; diff --git a/app/assets/stylesheets/addons/_rem.scss b/app/assets/stylesheets/addons/_rem.scss new file mode 100644 index 000000000..ddd7022b4 --- /dev/null +++ b/app/assets/stylesheets/addons/_rem.scss @@ -0,0 +1,33 @@ +@mixin rem($property, $size, $base: $em-base) { + @if not unitless($base) { + $base: strip-units($base); + } + + $unitless_values: (); + @each $num in $size { + @if not unitless($num) { + @if unit($num) == "em" { + $num: $num * $base; + } + + $num: strip-units($num); + } + + $unitless_values: append($unitless_values, $num); + } + $size: $unitless_values; + + $pixel_values: (); + $rem_values: (); + @each $value in $pxval { + $pixel_value: $value * 1px; + $pixel_values: append($pixel_values, $pixel_value); + + $rem_value: ($value / $base) * 1rem; + $rem_values: append($rem_values, $rem_value); + } + + #{$property}: $pixel_values; + #{$property}: $rem_values; +} +