diff options
| author | Joe Carstairs <118172583+jcarstairs-scottlogic@users.noreply.github.com> | 2024-01-19 09:33:11 +0000 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-01-19 09:33:11 +0000 |
| commit | 7140956da0820d4b818119eff7dfc72345f3328e (patch) | |
| tree | 503e1129a999fe834d2a7b98a4e82bf07264f49f /scss/custom-properties/spacing | |
| parent | a4f3cb02befe658594c076144be2e5200f36682a (diff) | |
| parent | 83c3460191a2089b56b091a7f4e09f39ac636e1e (diff) | |
Merge pull request #65 from joeacarstairs/deployment-staging
Update production
Diffstat (limited to 'scss/custom-properties/spacing')
| -rw-r--r-- | scss/custom-properties/spacing/_initial.scss | 14 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_lg.scss | 7 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_md.scss | 7 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_mixins.scss | 21 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_sm.scss | 7 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_xl.scss | 7 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_xs.scss | 7 | ||||
| -rw-r--r-- | scss/custom-properties/spacing/_xxl.scss | 7 |
8 files changed, 77 insertions, 0 deletions
diff --git a/scss/custom-properties/spacing/_initial.scss b/scss/custom-properties/spacing/_initial.scss new file mode 100644 index 0000000..a38388f --- /dev/null +++ b/scss/custom-properties/spacing/_initial.scss @@ -0,0 +1,14 @@ +@use 'sass:map'; + +@use '../../values/spacing' as spacing-values; +@use 'mixins'; + +:root { + @include mixins.spacing(); + @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) + ); +} diff --git a/scss/custom-properties/spacing/_lg.scss b/scss/custom-properties/spacing/_lg.scss new file mode 100644 index 0000000..1e9b090 --- /dev/null +++ b/scss/custom-properties/spacing/_lg.scss @@ -0,0 +1,7 @@ +@use 'mixins'; +@use '../../values/spacing' as spacing-values; + +:root { + // No need for spacing here, since it's the same as sm. + @include mixins.grid($breakpoint: lg); +} diff --git a/scss/custom-properties/spacing/_md.scss b/scss/custom-properties/spacing/_md.scss new file mode 100644 index 0000000..99b9352 --- /dev/null +++ b/scss/custom-properties/spacing/_md.scss @@ -0,0 +1,7 @@ +@use 'mixins'; +@use '../../values/spacing' as spacing-values; + +:root { + // No need for spacing here, since it's the same as sm. + @include mixins.grid($breakpoint: md); +} 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)}; +} diff --git a/scss/custom-properties/spacing/_sm.scss b/scss/custom-properties/spacing/_sm.scss new file mode 100644 index 0000000..0fdfcfe --- /dev/null +++ b/scss/custom-properties/spacing/_sm.scss @@ -0,0 +1,7 @@ +@use 'mixins'; +@use '../../values/spacing' as spacing-values; + +:root { + @include mixins.spacing($breakpoint: sm); + @include mixins.grid($breakpoint: sm); +} diff --git a/scss/custom-properties/spacing/_xl.scss b/scss/custom-properties/spacing/_xl.scss new file mode 100644 index 0000000..265c6e9 --- /dev/null +++ b/scss/custom-properties/spacing/_xl.scss @@ -0,0 +1,7 @@ +@use 'mixins'; +@use '../../values/spacing' as spacing-values; + +:root { + // No need for spacing here, since it's the same as sm. + @include mixins.grid($breakpoint: xl); +} diff --git a/scss/custom-properties/spacing/_xs.scss b/scss/custom-properties/spacing/_xs.scss new file mode 100644 index 0000000..13a14d6 --- /dev/null +++ b/scss/custom-properties/spacing/_xs.scss @@ -0,0 +1,7 @@ +@use 'mixins'; +@use '../../values/spacing' as spacing-values; + +:root { + @include mixins.spacing($breakpoint: xs); + @include mixins.grid($breakpoint: xs); +} diff --git a/scss/custom-properties/spacing/_xxl.scss b/scss/custom-properties/spacing/_xxl.scss new file mode 100644 index 0000000..600f74e --- /dev/null +++ b/scss/custom-properties/spacing/_xxl.scss @@ -0,0 +1,7 @@ +@use 'mixins'; +@use '../../values/spacing' as spacing-values; + +:root { + // No need for spacing here, since it's the same as sm. + @include mixins.grid($breakpoint: xxl); +} |
