diff options
Diffstat (limited to 'scss/custom-properties/spacing')
| -rw-r--r-- | scss/custom-properties/spacing/_initial.scss | 4 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_mixins.scss | 36 |
2 files changed, 32 insertions, 8 deletions
diff --git a/scss/custom-properties/spacing/_initial.scss b/scss/custom-properties/spacing/_initial.scss index a38388f..d52515c 100644 --- a/scss/custom-properties/spacing/_initial.scss +++ b/scss/custom-properties/spacing/_initial.scss @@ -8,7 +8,7 @@ @include mixins.grid(); --width-prose: calc( - var(--grid-column-width) * var(--grid-prose-column-count) + - var(--grid-gutter-width) * (var(--grid-prose-column-count) - 1) + var(--grid-column-width) * var(--grid-prose-column-count) + var(--grid-gutter-width) * + (var(--grid-prose-column-count) - 1) ); } diff --git a/scss/custom-properties/spacing/_mixins.scss b/scss/custom-properties/spacing/_mixins.scss index 4e35ee7..3008b14 100644 --- a/scss/custom-properties/spacing/_mixins.scss +++ b/scss/custom-properties/spacing/_mixins.scss @@ -3,12 +3,36 @@ @use '../../values/spacing' as spacing-values; @mixin spacing($breakpoint: initial) { - --spacing-inline-lg: #{spacing-values.spacing($direction: inline, $size: lg, $breakpoint: $breakpoint)}; - --spacing-inline-md: #{spacing-values.spacing($direction: inline, $size: md, $breakpoint: $breakpoint)}; - --spacing-inline-sm: #{spacing-values.spacing($direction: inline, $size: sm, $breakpoint: $breakpoint)}; - --spacing-block-lg: #{spacing-values.spacing($direction: block, $size: lg, $breakpoint: $breakpoint)}; - --spacing-block-md: #{spacing-values.spacing($direction: block, $size: md, $breakpoint: $breakpoint)}; - --spacing-block-sm: #{spacing-values.spacing($direction: block, $size: sm, $breakpoint: $breakpoint)}; + --spacing-inline-lg: #{spacing-values.spacing( + $direction: inline, + $size: lg, + $breakpoint: $breakpoint + )}; + --spacing-inline-md: #{spacing-values.spacing( + $direction: inline, + $size: md, + $breakpoint: $breakpoint + )}; + --spacing-inline-sm: #{spacing-values.spacing( + $direction: inline, + $size: sm, + $breakpoint: $breakpoint + )}; + --spacing-block-lg: #{spacing-values.spacing( + $direction: block, + $size: lg, + $breakpoint: $breakpoint + )}; + --spacing-block-md: #{spacing-values.spacing( + $direction: block, + $size: md, + $breakpoint: $breakpoint + )}; + --spacing-block-sm: #{spacing-values.spacing( + $direction: block, + $size: sm, + $breakpoint: $breakpoint + )}; } @mixin grid($breakpoint: initial) { |
