diff --git a/assets/styles/settings/_config.colors.scss b/assets/styles/settings/_config.colors.scss index 4966d3c..747abdb 100644 --- a/assets/styles/settings/_config.colors.scss +++ b/assets/styles/settings/_config.colors.scss @@ -23,13 +23,21 @@ $colors: ( // ``` // // @param {string} $key - The color key in $colors. +// @param {number} $alpha - The alpha for the color value. // @return {color} -@function color($key) { +@function color($key, $alpha: 1) { @if not map-has-key($colors, $key) { @error "Unknown '#{$key}' in $colors."; } - @return map-get($colors, $key); + + @if($alpha < 0 or $alpha > 1) { + @error "Alpha '#{$alpha}' must be in range [0, 1]."; + } + + $color: map-get($colors, $key); + + @return rgba($color, $alpha); } // Specifics diff --git a/assets/styles/settings/_config.spacers.scss b/assets/styles/settings/_config.spacers.scss index b2f50b2..d1121cc 100644 --- a/assets/styles/settings/_config.spacers.scss +++ b/assets/styles/settings/_config.spacers.scss @@ -7,7 +7,6 @@ $spacers: ( 'gutter': var(--grid-gutter), - 'gutter-2x': calc(2 * var(--grid-gutter)), 'xs': #{vh(5)}, 'sm': #{vh(7.5)}, 'md': #{vh(10)}, @@ -27,14 +26,15 @@ $spacers: ( // ``` // // @param {string} $key - The spacer key in $spacers. +// @param {number} $multiplier - The multiplier of the spacer value. // @return {size} -@function spacer($spacer) { +@function spacer($spacer: $spacer-default, $multiplier: 1) { @if not map-has-key($spacers, $spacer) { @error "Unknown master spacer: #{$spacer}"; } $index: map-get($spacers, $spacer); - @return $index; + @return calc(#{$index} * #{$multiplier}); } diff --git a/assets/styles/settings/_config.variables.scss b/assets/styles/settings/_config.variables.scss index a147257..000e038 100644 --- a/assets/styles/settings/_config.variables.scss +++ b/assets/styles/settings/_config.variables.scss @@ -7,7 +7,6 @@ // Grid --grid-columns: 4; --grid-gutter: #{rem(10px)}; - --grid-gutter-half: calc(0.5 * var(--grid-gutter)); --grid-margin: #{rem(10px)}; // Container