Last active
March 4, 2022 14:34
-
-
Save zastrow/54e6ecc67cb8ea66aef4e6bdb3c4f3ef to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
> 1% | |
last 2 versions |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ---- | |
// libsass (v3.5.4) | |
// ---- | |
$spacing-limit: 4; | |
$spacing-key: ( | |
"top": "top", | |
"right": "right", | |
"left": "left", | |
"btm": "bottom", | |
"all": null, | |
"vert": null, | |
"horiz": null | |
); | |
@mixin spacing-loop($property, $space, $value) { | |
@each $poskey, $posvalue in $spacing-key { | |
&-#{$poskey}-#{$space} { | |
@if $poskey == "all" { | |
#{$property}: $value; | |
} | |
@else if $poskey == "vert" { | |
#{$property}-top: $value; | |
#{$property}-bottom: $value; | |
} | |
@else if $poskey == "horiz" { | |
#{$property}-right: $value; | |
#{$property}-left: $value; | |
} | |
@else { | |
#{$property}-#{$posvalue}: $value; | |
} | |
} | |
} | |
} | |
@for $space from 0 through $spacing-limit { | |
$value: $space + rem; | |
.util-pad { | |
@include spacing-loop("padding", $space, $value); | |
} | |
.util-margin { | |
@include spacing-loop("margin", $space, $value); | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.util-pad-top-0 { | |
padding-top: 0rem; | |
} | |
.util-pad-right-0 { | |
padding-right: 0rem; | |
} | |
.util-pad-left-0 { | |
padding-left: 0rem; | |
} | |
.util-pad-btm-0 { | |
padding-bottom: 0rem; | |
} | |
.util-pad-all-0 { | |
padding: 0rem; | |
} | |
.util-pad-vert-0 { | |
padding-top: 0rem; | |
padding-bottom: 0rem; | |
} | |
.util-pad-horiz-0 { | |
padding-right: 0rem; | |
padding-left: 0rem; | |
} | |
.util-margin-top-0 { | |
margin-top: 0rem; | |
} | |
.util-margin-right-0 { | |
margin-right: 0rem; | |
} | |
.util-margin-left-0 { | |
margin-left: 0rem; | |
} | |
.util-margin-btm-0 { | |
margin-bottom: 0rem; | |
} | |
.util-margin-all-0 { | |
margin: 0rem; | |
} | |
.util-margin-vert-0 { | |
margin-top: 0rem; | |
margin-bottom: 0rem; | |
} | |
.util-margin-horiz-0 { | |
margin-right: 0rem; | |
margin-left: 0rem; | |
} | |
.util-pad-top-1 { | |
padding-top: 1rem; | |
} | |
.util-pad-right-1 { | |
padding-right: 1rem; | |
} | |
.util-pad-left-1 { | |
padding-left: 1rem; | |
} | |
.util-pad-btm-1 { | |
padding-bottom: 1rem; | |
} | |
.util-pad-all-1 { | |
padding: 1rem; | |
} | |
.util-pad-vert-1 { | |
padding-top: 1rem; | |
padding-bottom: 1rem; | |
} | |
.util-pad-horiz-1 { | |
padding-right: 1rem; | |
padding-left: 1rem; | |
} | |
.util-margin-top-1 { | |
margin-top: 1rem; | |
} | |
.util-margin-right-1 { | |
margin-right: 1rem; | |
} | |
.util-margin-left-1 { | |
margin-left: 1rem; | |
} | |
.util-margin-btm-1 { | |
margin-bottom: 1rem; | |
} | |
.util-margin-all-1 { | |
margin: 1rem; | |
} | |
.util-margin-vert-1 { | |
margin-top: 1rem; | |
margin-bottom: 1rem; | |
} | |
.util-margin-horiz-1 { | |
margin-right: 1rem; | |
margin-left: 1rem; | |
} | |
.util-pad-top-2 { | |
padding-top: 2rem; | |
} | |
.util-pad-right-2 { | |
padding-right: 2rem; | |
} | |
.util-pad-left-2 { | |
padding-left: 2rem; | |
} | |
.util-pad-btm-2 { | |
padding-bottom: 2rem; | |
} | |
.util-pad-all-2 { | |
padding: 2rem; | |
} | |
.util-pad-vert-2 { | |
padding-top: 2rem; | |
padding-bottom: 2rem; | |
} | |
.util-pad-horiz-2 { | |
padding-right: 2rem; | |
padding-left: 2rem; | |
} | |
.util-margin-top-2 { | |
margin-top: 2rem; | |
} | |
.util-margin-right-2 { | |
margin-right: 2rem; | |
} | |
.util-margin-left-2 { | |
margin-left: 2rem; | |
} | |
.util-margin-btm-2 { | |
margin-bottom: 2rem; | |
} | |
.util-margin-all-2 { | |
margin: 2rem; | |
} | |
.util-margin-vert-2 { | |
margin-top: 2rem; | |
margin-bottom: 2rem; | |
} | |
.util-margin-horiz-2 { | |
margin-right: 2rem; | |
margin-left: 2rem; | |
} | |
.util-pad-top-3 { | |
padding-top: 3rem; | |
} | |
.util-pad-right-3 { | |
padding-right: 3rem; | |
} | |
.util-pad-left-3 { | |
padding-left: 3rem; | |
} | |
.util-pad-btm-3 { | |
padding-bottom: 3rem; | |
} | |
.util-pad-all-3 { | |
padding: 3rem; | |
} | |
.util-pad-vert-3 { | |
padding-top: 3rem; | |
padding-bottom: 3rem; | |
} | |
.util-pad-horiz-3 { | |
padding-right: 3rem; | |
padding-left: 3rem; | |
} | |
.util-margin-top-3 { | |
margin-top: 3rem; | |
} | |
.util-margin-right-3 { | |
margin-right: 3rem; | |
} | |
.util-margin-left-3 { | |
margin-left: 3rem; | |
} | |
.util-margin-btm-3 { | |
margin-bottom: 3rem; | |
} | |
.util-margin-all-3 { | |
margin: 3rem; | |
} | |
.util-margin-vert-3 { | |
margin-top: 3rem; | |
margin-bottom: 3rem; | |
} | |
.util-margin-horiz-3 { | |
margin-right: 3rem; | |
margin-left: 3rem; | |
} | |
.util-pad-top-4 { | |
padding-top: 4rem; | |
} | |
.util-pad-right-4 { | |
padding-right: 4rem; | |
} | |
.util-pad-left-4 { | |
padding-left: 4rem; | |
} | |
.util-pad-btm-4 { | |
padding-bottom: 4rem; | |
} | |
.util-pad-all-4 { | |
padding: 4rem; | |
} | |
.util-pad-vert-4 { | |
padding-top: 4rem; | |
padding-bottom: 4rem; | |
} | |
.util-pad-horiz-4 { | |
padding-right: 4rem; | |
padding-left: 4rem; | |
} | |
.util-margin-top-4 { | |
margin-top: 4rem; | |
} | |
.util-margin-right-4 { | |
margin-right: 4rem; | |
} | |
.util-margin-left-4 { | |
margin-left: 4rem; | |
} | |
.util-margin-btm-4 { | |
margin-bottom: 4rem; | |
} | |
.util-margin-all-4 { | |
margin: 4rem; | |
} | |
.util-margin-vert-4 { | |
margin-top: 4rem; | |
margin-bottom: 4rem; | |
} | |
.util-margin-horiz-4 { | |
margin-right: 4rem; | |
margin-left: 4rem; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"sass": { | |
"compiler": "dart-sass/1.32.12", | |
"extensions": { | |
"libsass": "3.5.4" | |
}, | |
"syntax": "SCSS", | |
"outputStyle": "expanded" | |
}, | |
"autoprefixer": false | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment