%PDF- %PDF-
Direktori : /var/www/html/friendstravel.al/wp-content/themes/friendstravel/scss/base/mixins/ |
Current File : /var/www/html/friendstravel.al/wp-content/themes/friendstravel/scss/base/mixins/_rem.scss |
// ---------------------------------------------------------------------- // REM Units with PX fallback // ---------------------------------------------------------------------- // example: @include rem("margin", 10, 5, 10, 5); // example: @include rem("font-size", 14); @mixin rem($property, $values...) { $n: length($values); $i: 1; $pxlist: (); $remlist: (); @while $i <= $n { $itemVal: (nth($values, $i)); @if $itemVal != "auto"{ $pxlist: append($pxlist, $itemVal + px); //$remlist: append($remlist, ($itemVal / 10) + rem); // Use this if you've set HTML font size value to 62.5% $remlist: append($remlist, ($itemVal / 16) + rem); } @else { $pxlist: append($pxlist, auto); $remlist: append($remlist, auto); } $i: $i + 1; } #{$property}: $pxlist; #{$property}: $remlist; } @mixin em($property, $values...) { $n: length($values); $i: 1; $pxlist: (); $remlist: (); @while $i <= $n { $itemVal: (nth($values, $i)); @if $itemVal != "auto"{ $pxlist: append($pxlist, $itemVal + px); //$remlist: append($remlist, ($itemVal / 10) + rem); // Use this if you've set HTML font size value to 62.5% $remlist: append($remlist, ($itemVal / 16) + em); } @else { $pxlist: append($pxlist, auto); $remlist: append($remlist, auto); } $i: $i + 1; } #{$property}: $pxlist; #{$property}: $remlist; } //use @include font-size(16) @mixin font-size($size) { @include rem('font-size', $size); } //use @include line-height(20) @mixin line-height($size) { @include rem('line-height', $size); }