Skip to content

Instantly share code, notes, and snippets.

@alexrdz

alexrdz/gist:75e44e08cc30a2e7ffff481af2d7ef1a

Last active September 11, 2018 01:57
Show Gist options
  • Save alexrdz/75e44e08cc30a2e7ffff481af2d7ef1a to your computer and use it in GitHub Desktop.
Save alexrdz/75e44e08cc30a2e7ffff481af2d7ef1a to your computer and use it in GitHub Desktop.
Download ZIP
utility gen
Raw
gistfile1.scss
@mixin utility-generator($prop, $direction, $iterator) {
@for $index from 1 through $iterator {
@if ($prop == 'padding') {
.p#{$direction}-#{$index} {
@if ($direction == 'x') {
#{$prop}-left: $index * $utility-unit;
#{$prop}-right: $index * $utility-unit;
}
@if ($direction == 'y') {
#{$prop}-bottom: $index * $utility-unit;
#{$prop}-top: $index * $utility-unit;
}
@if ($direction == 'l') {
#{$prop}-left: $index * $utility-unit;
}
@if ($direction == 'r') {
#{$prop}-right: $index * $utility-unit;
}
}
}
@if ($prop == 'margin') {
.m#{$direction}-#{$index} {
@if ($direction == 'x') {
#{$prop}-left: $index * $utility-unit;
#{$prop}-right: $index * $utility-unit;
}
@if ($direction == 'y') {
#{$prop}-bottom: $index * $utility-unit;
#{$prop}-top: $index * $utility-unit;
}
@if ($direction == 'l') {
#{$prop}-left: $index * $utility-unit;
}
@if ($direction == 'r') {
#{$prop}-right: $index * $utility-unit;
}
}
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment