summaryrefslogtreecommitdiff
path: root/scss/custom-properties/spacing
diff options
context:
space:
mode:
Diffstat (limited to 'scss/custom-properties/spacing')
-rw-r--r--scss/custom-properties/spacing/_initial.scss4
-rw-r--r--scss/custom-properties/spacing/_mixins.scss36
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) {