ch4o5/locomotive-boilerplate
Template
1
0
Fork 0
mirror of https://github.com/locomotivemtl/locomotive-boilerplate.git synced 2026-01-15 00:55:08 +08:00
Code Issues Projects Releases Wiki Activity

Fix spacing loop

Browse Source
This commit is contained in:
Lucas Vallenet
2023-06-16 10:13:10 +02:00
parent d0fcfaac86
commit c1bcf7fb0d
5 changed files with 17 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets.json
View File

@@ -1,3 +1,3 @@
{ {
"version": 1686842849362 "version": 1686903176638
} }

2
assets/styles/main.scss
View File

@@ -73,5 +73,5 @@
// @import "utilities/align"; // @import "utilities/align";
// @import "utilities/helpers"; // @import "utilities/helpers";
// @import "utilities/states"; // @import "utilities/states";
@import "utilities/spacing"; // @import "utilities/spacing";
// @import "utilities/print"; // @import "utilities/print";

20
assets/styles/utilities/_spacing.scss
View File

@@ -42,31 +42,37 @@ $spacing-sizes: join($spacers, (
@each $breakpoint, $mediaquery in $breakpoints { @each $breakpoint, $mediaquery in $breakpoints {
@each $property-namespace, $property in $spacing-properties { @each $property-namespace, $property in $spacing-properties {
@each $direction-namespace, $direction-rules in $spacing-directions { @each $direction-namespace, $directions in $spacing-directions {
@each $size-namespace, $size in $spacing-sizes { @each $size-namespace, $size in $spacing-sizes {
// Prepend "-" to spacing sizes if not null
$size-namespace: if($size-namespace != null, "-" + $size-namespace, $size-namespace);
// Base class
$base-class: ".u-" + #{$property-namespace}#{$direction-namespace}#{$size-namespace};
// Spacer without media query // Spacer without media query
@if $breakpoint == "tiny" { @if $breakpoint == "tiny" {
.u-#{$property-namespace}#{$direction-namespace}-#{$size-namespace} { #{$base-class} {
@each $direction in $direction-rules { @each $direction in $directions {
#{$property}#{$direction}: $size !important; #{$property}#{$direction}: $size !important;
} }
} }
} }
// Spacer min-width breakpoints `@from-*` // Spacer min-width breakpoints `@from-*`
.u-#{$property-namespace}#{$direction-namespace}-#{$size-namespace}\@from-#{$breakpoint} { #{$base-class}\@from-#{$breakpoint} {
@media #{mq-min($breakpoint)} { @media #{mq-min($breakpoint)} {
@each $direction in $direction-rules { @each $direction in $directions {
#{$property}#{$direction}: $size !important; #{$property}#{$direction}: $size !important;
} }
} }
} }
// Spacer max-width breakpoints @to-*` // Spacer max-width breakpoints @to-*`
.u-#{$property-namespace}#{$direction-namespace}-#{$size-namespace}\@to-#{$breakpoint} { #{$base-class}\@to-#{$breakpoint} {
@media #{mq-max($breakpoint)} { @media #{mq-max($breakpoint)} {
@each $direction in $direction-rules { @each $direction in $directions {
#{$property}#{$direction}: $size !important; #{$property}#{$direction}: $size !important;
} }
} }

2
www/assets/styles/main.css
View File

File diff suppressed because one or more lines are too long

2
www/assets/styles/main.css.map
View File

File diff suppressed because one or more lines are too long