diff --git a/src/type/mixins/_fluid-type.scss b/src/type/mixins/_fluid-type.scss index ced76a4..ad5edb6 100644 --- a/src/type/mixins/_fluid-type.scss +++ b/src/type/mixins/_fluid-type.scss @@ -9,13 +9,10 @@ // Set base properties --#{$css-ns}-#{$type}-#{$size}-family: #{type-property-check($theme-config, $size, 'family')}; --#{$css-ns}-#{$type}-#{$size}-family-fallback: #{type-property-check($theme-config, $size, 'familyFallback')}; + --#{$css-ns}-#{$type}-#{$size}-letter-spacing: #{type-property-check($theme-config, $size, 'letter-spacing')}; --#{$css-ns}-#{$type}-#{$size}-weight: #{type-property-check($theme-config, $size, 'weight')}; --#{$css-ns}-#{$type}-#{$size}-line-height: #{type-property-check($theme-config, $size, 'line-height')}; - @if type-property-check($theme-config, $size, 'letter-spacing') != null { - --#{$css-ns}-#{$type}-#{$size}-letter-spacing: #{type-property-check($theme-config, $size, 'letter-spacing')}; - } - // Get min, preferred and max values from the config $min-size: auro_map-deep-get($theme-config, 'sizes', $size, 'font-size', 'min'); $preferred-size: auro_map-deep-get($theme-config, 'sizes', $size, 'font-size', 'preferred'); diff --git a/src/type/mixins/_theme-generator.scss b/src/type/mixins/_theme-generator.scss index e78602e..a37f142 100644 --- a/src/type/mixins/_theme-generator.scss +++ b/src/type/mixins/_theme-generator.scss @@ -5,7 +5,14 @@ @import "../mixins/type-generator"; // Theme generator -@mixin generate-theme($theme-name, $body-config, $display-config, $heading-config, $accent-config) { +@mixin generate-theme( + $theme-name, + $body-config, + $display-config, + $heading-config, + $accent-config, + $accent-uses-letter-spacing: true +) { // Map of all type configs for the theme $theme-configs: ( 'body': $body-config, @@ -13,13 +20,10 @@ 'heading': $heading-config, 'accent': $accent-config ); - - // Derive letter-spacing behavior from accent config data rather than theme name - $accent-uses-letter-spacing: type-property-check($accent-config, '2xl', 'letter-spacing') != null; // Generate CSS variables for the theme @include generate-theme-type-css-vars($theme-configs); // Generate theme type classes - @include generate-theme-type-classes($use-letter-spacing: $accent-uses-letter-spacing); + @include generate-theme-type-classes($accent-use-letter-spacing: $accent-uses-letter-spacing); } diff --git a/src/type/mixins/_type-generator.scss b/src/type/mixins/_type-generator.scss index 69779dc..3eee9af 100644 --- a/src/type/mixins/_type-generator.scss +++ b/src/type/mixins/_type-generator.scss @@ -14,9 +14,9 @@ } // Generate theme type classes -@mixin generate-theme-type-classes($use-fallback: false, $fallback-configs: null, $use-letter-spacing: true) { +@mixin generate-theme-type-classes($use-fallback: false, $fallback-configs: null, $accent-use-letter-spacing: true) { @include generate-body-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'body'), null)); @include generate-display-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'display'), null)); @include generate-heading-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'heading'), null)); - @include generate-accent-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'accent'), null), $use-letter-spacing); + @include generate-accent-classes($use-fallback, if($fallback-configs != null, map-get($fallback-configs, 'accent'), null), $accent-use-letter-spacing); } diff --git a/src/type/themes/hawaiian/index.scss b/src/type/themes/hawaiian/index.scss index afaac0f..b063b6c 100644 --- a/src/type/themes/hawaiian/index.scss +++ b/src/type/themes/hawaiian/index.scss @@ -6,5 +6,6 @@ $hawaiian-type-body-config, $hawaiian-type-display-config, $hawaiian-type-heading-config, - $hawaiian-type-accent-config + $hawaiian-type-accent-config, + $accent-uses-letter-spacing: false );