@function get-rems ($nums, $delim: space) {
$max: length($nums);
$remValues: null;
@for $i from 1 through $max {
$value: nth($nums, $i);
@if type-of($value) == "number" and unitless($value) {
$remValues: append($remValues, #{$value / $base-px}rem, $delim);
} @else {
$remValues: append($remValues, $value, $delim);
}
}
@return $remValues;
}
$base-px: 10;
@mixin rem-calc ($property, $values...) {
$max: length($values);
$pxValues: null;
$remValues: null;
@if $property == "font" {
@for $i from 1 through $max {
$value: nth($values, $i);
@if type-of($value) == "string" or type-of($value) == "color" {
$pxValues: append($pxValues, $value, space);
} @else {
$pxValues: append($pxValues, #{$value}px, space);
}
}
}
@if $property == "font" {
#{$property}: $pxValues;
}
#{$property}: get-rems($values);
}
Generic function to return rems when pixels are input and mixin to output rems for CSS rules.
Be the first to comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.