Skip to content

Instantly share code, notes, and snippets.

@IcarusFW
Last active July 18, 2018 16:51
Show Gist options
  • Save IcarusFW/e12c825e5fbe6722a6e7a66a4133ba52 to your computer and use it in GitHub Desktop.
Save IcarusFW/e12c825e5fbe6722a6e7a66a4133ba52 to your computer and use it in GitHub Desktop.
Automatic em-calc mixins for Sass and Less (requires up-to-date compilers)
@font-context: 16;
.em-calc(@target, @property, @context: @font-context) {
.loop(length(@target));
.loop(@i) when (@i > 0) {
.loop(@i - 1);
@{property}+_: (extract(@target, @i) / @context) + 0em;
}
}
$font-context: 16;
@function em-calculation($target, $context: $font-context) {
@return ($target / $context) + 0em;
}
@mixin em-calc($list, $property, $context: 16) {
$values: ();
@each $i in $list {
$values: append($values, em-calculation($i, $context));
}
#{$property}: $values;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment