Created
January 20, 2020 18:46
-
-
Save zastrow/18b3339ba9969c319df383e0c3e49984 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
// ---- | |
// Sass (vundefined) | |
// Compass (vundefined) | |
// dart-sass (v1.18.0) | |
// ---- | |
$grid-breakpoints: ( | |
sm: 30rem, | |
md: 40rem, | |
lg: 60rem, | |
xl: 80rem, | |
print: print | |
); | |
// | |
// SPACING | |
// | |
$spacer: 1rem; | |
$spacers: () !default; | |
$spacers: map-merge( | |
( | |
none: 0, | |
xs: $spacer * 0.25, | |
sm: $spacer * 0.5, | |
md: $spacer, | |
lg: $spacer * 1.5, | |
xl: $spacer * 3, | |
xxl: $spacer * 5, | |
), | |
$spacers | |
); | |
$side: ( | |
bottom, | |
top, | |
left, | |
right | |
); | |
.util-margin { | |
// This outputs regular spacing classes | |
@each $side in $side { | |
&-#{$side} { | |
@each $spacer-key, $spacer-value in $spacers { | |
&-#{$spacer-key} { | |
margin-#{$side}: space($spacer-key); | |
} | |
} | |
} | |
} | |
// This outputs responsive spacing classes | |
@each $bp-key, $bp-value in $grid-breakpoints { | |
@each $side in $side { | |
&-#{$side} { | |
@each $spacer-key, $spacer-value in $spacers { | |
@media (min-width: #{$bp-value}) { | |
&-#{$spacer-key}\@#{$bp-key} { | |
margin-#{$side}: space($spacer-key); | |
} | |
} | |
} | |
} | |
} | |
} | |
} | |
.util-padding { | |
// This outputs regular spacing classes | |
@each $side in $side { | |
&-#{$side} { | |
@each $spacer-key, $spacer-value in $spacers { | |
&-#{$spacer-key} { | |
padding-#{$side}: space($spacer-key); | |
} | |
} | |
} | |
} | |
// This outputs responsive spacing classes | |
@each $bp-key, $bp-value in $grid-breakpoints { | |
@each $side in $side { | |
&-#{$side} { | |
@each $spacer-key, $spacer-value in $spacers { | |
@media (min-width: #{$bp-value}) { | |
&-#{$spacer-key}\@#{$bp-key} { | |
padding-#{$side}: space($spacer-key); | |
} | |
} | |
} | |
} | |
} | |
} | |
} |
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-margin-bottom-none { | |
margin-bottom: space(none); | |
} | |
.util-margin-bottom-xs { | |
margin-bottom: space(xs); | |
} | |
.util-margin-bottom-sm { | |
margin-bottom: space(sm); | |
} | |
.util-margin-bottom-md { | |
margin-bottom: space(md); | |
} | |
.util-margin-bottom-lg { | |
margin-bottom: space(lg); | |
} | |
.util-margin-bottom-xl { | |
margin-bottom: space(xl); | |
} | |
.util-margin-bottom-xxl { | |
margin-bottom: space(xxl); | |
} | |
.util-margin-top-none { | |
margin-top: space(none); | |
} | |
.util-margin-top-xs { | |
margin-top: space(xs); | |
} | |
.util-margin-top-sm { | |
margin-top: space(sm); | |
} | |
.util-margin-top-md { | |
margin-top: space(md); | |
} | |
.util-margin-top-lg { | |
margin-top: space(lg); | |
} | |
.util-margin-top-xl { | |
margin-top: space(xl); | |
} | |
.util-margin-top-xxl { | |
margin-top: space(xxl); | |
} | |
.util-margin-left-none { | |
margin-left: space(none); | |
} | |
.util-margin-left-xs { | |
margin-left: space(xs); | |
} | |
.util-margin-left-sm { | |
margin-left: space(sm); | |
} | |
.util-margin-left-md { | |
margin-left: space(md); | |
} | |
.util-margin-left-lg { | |
margin-left: space(lg); | |
} | |
.util-margin-left-xl { | |
margin-left: space(xl); | |
} | |
.util-margin-left-xxl { | |
margin-left: space(xxl); | |
} | |
.util-margin-right-none { | |
margin-right: space(none); | |
} | |
.util-margin-right-xs { | |
margin-right: space(xs); | |
} | |
.util-margin-right-sm { | |
margin-right: space(sm); | |
} | |
.util-margin-right-md { | |
margin-right: space(md); | |
} | |
.util-margin-right-lg { | |
margin-right: space(lg); | |
} | |
.util-margin-right-xl { | |
margin-right: space(xl); | |
} | |
.util-margin-right-xxl { | |
margin-right: space(xxl); | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-none\@sm { | |
margin-bottom: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-xs\@sm { | |
margin-bottom: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-sm\@sm { | |
margin-bottom: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-md\@sm { | |
margin-bottom: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-lg\@sm { | |
margin-bottom: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-xl\@sm { | |
margin-bottom: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-bottom-xxl\@sm { | |
margin-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-none\@sm { | |
margin-top: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-xs\@sm { | |
margin-top: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-sm\@sm { | |
margin-top: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-md\@sm { | |
margin-top: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-lg\@sm { | |
margin-top: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-xl\@sm { | |
margin-top: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-top-xxl\@sm { | |
margin-top: space(xxl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-none\@sm { | |
margin-left: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-xs\@sm { | |
margin-left: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-sm\@sm { | |
margin-left: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-md\@sm { | |
margin-left: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-lg\@sm { | |
margin-left: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-xl\@sm { | |
margin-left: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-left-xxl\@sm { | |
margin-left: space(xxl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-none\@sm { | |
margin-right: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-xs\@sm { | |
margin-right: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-sm\@sm { | |
margin-right: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-md\@sm { | |
margin-right: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-lg\@sm { | |
margin-right: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-xl\@sm { | |
margin-right: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-margin-right-xxl\@sm { | |
margin-right: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-none\@md { | |
margin-bottom: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-xs\@md { | |
margin-bottom: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-sm\@md { | |
margin-bottom: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-md\@md { | |
margin-bottom: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-lg\@md { | |
margin-bottom: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-xl\@md { | |
margin-bottom: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-bottom-xxl\@md { | |
margin-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-none\@md { | |
margin-top: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-xs\@md { | |
margin-top: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-sm\@md { | |
margin-top: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-md\@md { | |
margin-top: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-lg\@md { | |
margin-top: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-xl\@md { | |
margin-top: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-top-xxl\@md { | |
margin-top: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-none\@md { | |
margin-left: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-xs\@md { | |
margin-left: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-sm\@md { | |
margin-left: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-md\@md { | |
margin-left: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-lg\@md { | |
margin-left: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-xl\@md { | |
margin-left: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-left-xxl\@md { | |
margin-left: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-none\@md { | |
margin-right: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-xs\@md { | |
margin-right: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-sm\@md { | |
margin-right: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-md\@md { | |
margin-right: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-lg\@md { | |
margin-right: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-xl\@md { | |
margin-right: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-margin-right-xxl\@md { | |
margin-right: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-none\@lg { | |
margin-bottom: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-xs\@lg { | |
margin-bottom: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-sm\@lg { | |
margin-bottom: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-md\@lg { | |
margin-bottom: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-lg\@lg { | |
margin-bottom: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-xl\@lg { | |
margin-bottom: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-bottom-xxl\@lg { | |
margin-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-none\@lg { | |
margin-top: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-xs\@lg { | |
margin-top: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-sm\@lg { | |
margin-top: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-md\@lg { | |
margin-top: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-lg\@lg { | |
margin-top: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-xl\@lg { | |
margin-top: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-top-xxl\@lg { | |
margin-top: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-none\@lg { | |
margin-left: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-xs\@lg { | |
margin-left: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-sm\@lg { | |
margin-left: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-md\@lg { | |
margin-left: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-lg\@lg { | |
margin-left: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-xl\@lg { | |
margin-left: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-left-xxl\@lg { | |
margin-left: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-none\@lg { | |
margin-right: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-xs\@lg { | |
margin-right: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-sm\@lg { | |
margin-right: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-md\@lg { | |
margin-right: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-lg\@lg { | |
margin-right: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-xl\@lg { | |
margin-right: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-margin-right-xxl\@lg { | |
margin-right: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-none\@xl { | |
margin-bottom: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-xs\@xl { | |
margin-bottom: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-sm\@xl { | |
margin-bottom: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-md\@xl { | |
margin-bottom: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-lg\@xl { | |
margin-bottom: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-xl\@xl { | |
margin-bottom: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-bottom-xxl\@xl { | |
margin-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-none\@xl { | |
margin-top: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-xs\@xl { | |
margin-top: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-sm\@xl { | |
margin-top: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-md\@xl { | |
margin-top: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-lg\@xl { | |
margin-top: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-xl\@xl { | |
margin-top: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-top-xxl\@xl { | |
margin-top: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-none\@xl { | |
margin-left: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-xs\@xl { | |
margin-left: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-sm\@xl { | |
margin-left: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-md\@xl { | |
margin-left: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-lg\@xl { | |
margin-left: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-xl\@xl { | |
margin-left: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-left-xxl\@xl { | |
margin-left: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-none\@xl { | |
margin-right: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-xs\@xl { | |
margin-right: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-sm\@xl { | |
margin-right: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-md\@xl { | |
margin-right: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-lg\@xl { | |
margin-right: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-xl\@xl { | |
margin-right: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-margin-right-xxl\@xl { | |
margin-right: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-none\@print { | |
margin-bottom: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-xs\@print { | |
margin-bottom: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-sm\@print { | |
margin-bottom: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-md\@print { | |
margin-bottom: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-lg\@print { | |
margin-bottom: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-xl\@print { | |
margin-bottom: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-bottom-xxl\@print { | |
margin-bottom: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-none\@print { | |
margin-top: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-xs\@print { | |
margin-top: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-sm\@print { | |
margin-top: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-md\@print { | |
margin-top: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-lg\@print { | |
margin-top: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-xl\@print { | |
margin-top: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-top-xxl\@print { | |
margin-top: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-none\@print { | |
margin-left: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-xs\@print { | |
margin-left: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-sm\@print { | |
margin-left: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-md\@print { | |
margin-left: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-lg\@print { | |
margin-left: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-xl\@print { | |
margin-left: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-left-xxl\@print { | |
margin-left: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-none\@print { | |
margin-right: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-xs\@print { | |
margin-right: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-sm\@print { | |
margin-right: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-md\@print { | |
margin-right: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-lg\@print { | |
margin-right: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-xl\@print { | |
margin-right: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-margin-right-xxl\@print { | |
margin-right: space(xxl); | |
} | |
} | |
.util-padding-bottom-none { | |
padding-bottom: space(none); | |
} | |
.util-padding-bottom-xs { | |
padding-bottom: space(xs); | |
} | |
.util-padding-bottom-sm { | |
padding-bottom: space(sm); | |
} | |
.util-padding-bottom-md { | |
padding-bottom: space(md); | |
} | |
.util-padding-bottom-lg { | |
padding-bottom: space(lg); | |
} | |
.util-padding-bottom-xl { | |
padding-bottom: space(xl); | |
} | |
.util-padding-bottom-xxl { | |
padding-bottom: space(xxl); | |
} | |
.util-padding-top-none { | |
padding-top: space(none); | |
} | |
.util-padding-top-xs { | |
padding-top: space(xs); | |
} | |
.util-padding-top-sm { | |
padding-top: space(sm); | |
} | |
.util-padding-top-md { | |
padding-top: space(md); | |
} | |
.util-padding-top-lg { | |
padding-top: space(lg); | |
} | |
.util-padding-top-xl { | |
padding-top: space(xl); | |
} | |
.util-padding-top-xxl { | |
padding-top: space(xxl); | |
} | |
.util-padding-left-none { | |
padding-left: space(none); | |
} | |
.util-padding-left-xs { | |
padding-left: space(xs); | |
} | |
.util-padding-left-sm { | |
padding-left: space(sm); | |
} | |
.util-padding-left-md { | |
padding-left: space(md); | |
} | |
.util-padding-left-lg { | |
padding-left: space(lg); | |
} | |
.util-padding-left-xl { | |
padding-left: space(xl); | |
} | |
.util-padding-left-xxl { | |
padding-left: space(xxl); | |
} | |
.util-padding-right-none { | |
padding-right: space(none); | |
} | |
.util-padding-right-xs { | |
padding-right: space(xs); | |
} | |
.util-padding-right-sm { | |
padding-right: space(sm); | |
} | |
.util-padding-right-md { | |
padding-right: space(md); | |
} | |
.util-padding-right-lg { | |
padding-right: space(lg); | |
} | |
.util-padding-right-xl { | |
padding-right: space(xl); | |
} | |
.util-padding-right-xxl { | |
padding-right: space(xxl); | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-none\@sm { | |
padding-bottom: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-xs\@sm { | |
padding-bottom: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-sm\@sm { | |
padding-bottom: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-md\@sm { | |
padding-bottom: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-lg\@sm { | |
padding-bottom: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-xl\@sm { | |
padding-bottom: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-bottom-xxl\@sm { | |
padding-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-none\@sm { | |
padding-top: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-xs\@sm { | |
padding-top: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-sm\@sm { | |
padding-top: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-md\@sm { | |
padding-top: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-lg\@sm { | |
padding-top: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-xl\@sm { | |
padding-top: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-top-xxl\@sm { | |
padding-top: space(xxl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-none\@sm { | |
padding-left: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-xs\@sm { | |
padding-left: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-sm\@sm { | |
padding-left: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-md\@sm { | |
padding-left: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-lg\@sm { | |
padding-left: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-xl\@sm { | |
padding-left: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-left-xxl\@sm { | |
padding-left: space(xxl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-none\@sm { | |
padding-right: space(none); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-xs\@sm { | |
padding-right: space(xs); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-sm\@sm { | |
padding-right: space(sm); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-md\@sm { | |
padding-right: space(md); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-lg\@sm { | |
padding-right: space(lg); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-xl\@sm { | |
padding-right: space(xl); | |
} | |
} | |
@media (min-width: 30rem) { | |
.util-padding-right-xxl\@sm { | |
padding-right: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-none\@md { | |
padding-bottom: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-xs\@md { | |
padding-bottom: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-sm\@md { | |
padding-bottom: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-md\@md { | |
padding-bottom: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-lg\@md { | |
padding-bottom: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-xl\@md { | |
padding-bottom: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-bottom-xxl\@md { | |
padding-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-none\@md { | |
padding-top: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-xs\@md { | |
padding-top: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-sm\@md { | |
padding-top: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-md\@md { | |
padding-top: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-lg\@md { | |
padding-top: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-xl\@md { | |
padding-top: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-top-xxl\@md { | |
padding-top: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-none\@md { | |
padding-left: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-xs\@md { | |
padding-left: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-sm\@md { | |
padding-left: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-md\@md { | |
padding-left: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-lg\@md { | |
padding-left: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-xl\@md { | |
padding-left: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-left-xxl\@md { | |
padding-left: space(xxl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-none\@md { | |
padding-right: space(none); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-xs\@md { | |
padding-right: space(xs); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-sm\@md { | |
padding-right: space(sm); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-md\@md { | |
padding-right: space(md); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-lg\@md { | |
padding-right: space(lg); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-xl\@md { | |
padding-right: space(xl); | |
} | |
} | |
@media (min-width: 40rem) { | |
.util-padding-right-xxl\@md { | |
padding-right: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-none\@lg { | |
padding-bottom: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-xs\@lg { | |
padding-bottom: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-sm\@lg { | |
padding-bottom: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-md\@lg { | |
padding-bottom: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-lg\@lg { | |
padding-bottom: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-xl\@lg { | |
padding-bottom: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-bottom-xxl\@lg { | |
padding-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-none\@lg { | |
padding-top: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-xs\@lg { | |
padding-top: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-sm\@lg { | |
padding-top: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-md\@lg { | |
padding-top: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-lg\@lg { | |
padding-top: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-xl\@lg { | |
padding-top: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-top-xxl\@lg { | |
padding-top: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-none\@lg { | |
padding-left: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-xs\@lg { | |
padding-left: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-sm\@lg { | |
padding-left: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-md\@lg { | |
padding-left: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-lg\@lg { | |
padding-left: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-xl\@lg { | |
padding-left: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-left-xxl\@lg { | |
padding-left: space(xxl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-none\@lg { | |
padding-right: space(none); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-xs\@lg { | |
padding-right: space(xs); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-sm\@lg { | |
padding-right: space(sm); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-md\@lg { | |
padding-right: space(md); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-lg\@lg { | |
padding-right: space(lg); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-xl\@lg { | |
padding-right: space(xl); | |
} | |
} | |
@media (min-width: 60rem) { | |
.util-padding-right-xxl\@lg { | |
padding-right: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-none\@xl { | |
padding-bottom: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-xs\@xl { | |
padding-bottom: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-sm\@xl { | |
padding-bottom: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-md\@xl { | |
padding-bottom: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-lg\@xl { | |
padding-bottom: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-xl\@xl { | |
padding-bottom: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-bottom-xxl\@xl { | |
padding-bottom: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-none\@xl { | |
padding-top: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-xs\@xl { | |
padding-top: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-sm\@xl { | |
padding-top: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-md\@xl { | |
padding-top: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-lg\@xl { | |
padding-top: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-xl\@xl { | |
padding-top: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-top-xxl\@xl { | |
padding-top: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-none\@xl { | |
padding-left: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-xs\@xl { | |
padding-left: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-sm\@xl { | |
padding-left: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-md\@xl { | |
padding-left: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-lg\@xl { | |
padding-left: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-xl\@xl { | |
padding-left: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-left-xxl\@xl { | |
padding-left: space(xxl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-none\@xl { | |
padding-right: space(none); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-xs\@xl { | |
padding-right: space(xs); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-sm\@xl { | |
padding-right: space(sm); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-md\@xl { | |
padding-right: space(md); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-lg\@xl { | |
padding-right: space(lg); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-xl\@xl { | |
padding-right: space(xl); | |
} | |
} | |
@media (min-width: 80rem) { | |
.util-padding-right-xxl\@xl { | |
padding-right: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-none\@print { | |
padding-bottom: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-xs\@print { | |
padding-bottom: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-sm\@print { | |
padding-bottom: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-md\@print { | |
padding-bottom: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-lg\@print { | |
padding-bottom: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-xl\@print { | |
padding-bottom: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-bottom-xxl\@print { | |
padding-bottom: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-none\@print { | |
padding-top: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-xs\@print { | |
padding-top: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-sm\@print { | |
padding-top: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-md\@print { | |
padding-top: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-lg\@print { | |
padding-top: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-xl\@print { | |
padding-top: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-top-xxl\@print { | |
padding-top: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-none\@print { | |
padding-left: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-xs\@print { | |
padding-left: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-sm\@print { | |
padding-left: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-md\@print { | |
padding-left: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-lg\@print { | |
padding-left: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-xl\@print { | |
padding-left: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-left-xxl\@print { | |
padding-left: space(xxl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-none\@print { | |
padding-right: space(none); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-xs\@print { | |
padding-right: space(xs); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-sm\@print { | |
padding-right: space(sm); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-md\@print { | |
padding-right: space(md); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-lg\@print { | |
padding-right: space(lg); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-xl\@print { | |
padding-right: space(xl); | |
} | |
} | |
@media (min-width: print) { | |
.util-padding-right-xxl\@print { | |
padding-right: space(xxl); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment