diff options
Diffstat (limited to 'scss/custom-properties/spacing/_mixins.scss')
| -rw-r--r-- | scss/custom-properties/spacing/_mixins.scss | 21 |
1 files changed, 21 insertions, 0 deletions
diff --git a/scss/custom-properties/spacing/_mixins.scss b/scss/custom-properties/spacing/_mixins.scss new file mode 100644 index 0000000..4e35ee7 --- /dev/null +++ b/scss/custom-properties/spacing/_mixins.scss @@ -0,0 +1,21 @@ +@use 'sass:map'; + +@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)}; +} + +@mixin grid($breakpoint: initial) { + --grid-padding: #{spacing-values.grid-padding($breakpoint: $breakpoint)}; + --grid-column-count: #{map.get(spacing-values.$grid-column-count, $breakpoint)}; + --grid-column-width: #{spacing-values.grid-column-width($breakpoint: $breakpoint)}; + --grid-gutter-width: #{spacing-values.grid-gutter-width($breakpoint: $breakpoint)}; + --grid-prose-column-count: #{map.get(spacing-values.$grid-prose-column-count, $breakpoint)}; + --grid-total-width: #{spacing-values.grid-total-width-absolute($breakpoint)}; +} |