Sha256: d461b2c82ffc3d20d1930faecbe7f0007143b2d02717aea200a05d9797d9d690
Contents?: true
Size: 1.77 KB
Versions: 7
Compression:
Stored size: 1.77 KB
Contents
// Margin spacer utilities
// stylelint-disable block-opening-brace-space-before, declaration-colon-space-before, primer/selector-no-utility
@for $i from 1 through length($spacers) {
$size: #{nth($spacers, $i)};
$scale: #{$i - 1};
// .m-0, .m-1, .m-2...
.m-#{$scale} { margin : #{$size} !important; }
.mt-#{$scale} { margin-top : #{$size} !important; }
.mr-#{$scale} { margin-right : #{$size} !important; }
.mb-#{$scale} { margin-bottom: #{$size} !important; }
.ml-#{$scale} { margin-left : #{$size} !important; }
.mx-#{$scale} {
margin-right: #{$size} !important;
margin-left : #{$size} !important;
}
.my-#{$scale} {
margin-top : #{$size} !important;
margin-bottom: #{$size} !important;
}
}
// Loop through the breakpoint values
@each $breakpoint in map-keys($breakpoints) {
// Loop through the spacer values
@for $i from 1 through length($spacers) {
@include breakpoint($breakpoint) {
$size: #{nth($spacers, $i)}; // sm, md, lg, xl
$scale: #{$i - 1}; // 0, 1, 2, 3, 4, 5, 6
// .m-sm-0, .m-md-1, .m-lg-2...
.m-#{$breakpoint}-#{$scale} { margin: #{$size} !important; }
.mt-#{$breakpoint}-#{$scale} { margin-top: #{$size} !important; }
.mr-#{$breakpoint}-#{$scale} { margin-right: #{$size} !important; }
.mb-#{$breakpoint}-#{$scale} { margin-bottom: #{$size} !important; }
.ml-#{$breakpoint}-#{$scale} { margin-left: #{$size} !important; }
.mx-#{$breakpoint}-#{$scale} {
margin-right: #{$size} !important;
margin-left: #{$size} !important;
}
.my-#{$breakpoint}-#{$scale} {
margin-top: #{$size} !important;
margin-bottom: #{$size} !important;
}
}
}
}
// Auto
.mx-auto {
margin-right: auto !important;
margin-left: auto !important;
}
Version data entries
7 entries across 7 versions & 1 rubygems