1 files changed, 91 insertions, 23 deletions

diff --git a/src/objects/_heading.vars.scss b/src/objects/_heading.vars.scss
index 78413dd..cf07488 100644
--- a/src/objects/_heading.vars.scss
+++ b/src/objects/_heading.vars.scss
@@ -1,3 +1,5 @@
+@use 'sass:map';
+@use 'sass:string';
 @use 'iro-sass/src/props';
 @use '../core.vars' as core;
 
@@ -5,8 +7,22 @@ $offset:            props.def(--o-heading--offset, -.02em) !default;
 $margin-bs:         props.def(--o-heading--margin-bs, props.get(core.$size--700)) !default;
 $margin-bs-sibling: props.def(--o-heading--margin-bs-sibling, props.get(core.$size--325)) !default;
 
-$text-color: props.def(--o-heading--text-color, props.get(core.$theme, --heading), 'color') !default;
-$bg-color:   props.def(--o-heading--bg-color, props.get(core.$theme, --base, --50), 'color') !default;
+$text-color:     props.def(--o-heading--text-color, props.get(core.$theme, --heading), 'color') !default;
+$bg-color:       props.def(--o-heading--bg-color, props.get(core.$theme, --base, --50), 'color') !default;
+
+$text-color--xxl: props.def(--o-heading--xxl--text-color, props.get(core.$theme, --heading), 'color') !default;
+$text-color--xl:  props.def(--o-heading--xl--text-color, props.get($text-color--xxl), 'color') !default;
+$text-color--lg:  props.def(--o-heading--lg--text-color, props.get($text-color--xxl), 'color') !default;
+$text-color--md:  props.def(--o-heading--md--text-color, props.get($text-color--xxl), 'color') !default;
+$text-color--sm:  props.def(--o-heading--sm--text-color, props.get(core.$theme, --text-mute-more), 'color') !default;
+$text-color--xs:  props.def(--o-heading--xs--text-color, props.get($text-color--sm), 'color') !default;
+
+$display--text-color--xxl: props.def(--o-heading--display--xxl--text-color, props.get(core.$theme, --heading), 'color') !default;
+$display--text-color--xl:  props.def(--o-heading--display--xl--text-color, props.get($display--text-color--xxl), 'color') !default;
+$display--text-color--lg:  props.def(--o-heading--display--lg--text-color, props.get($display--text-color--xxl), 'color') !default;
+$display--text-color--md:  props.def(--o-heading--display--md--text-color, props.get($display--text-color--xxl), 'color') !default;
+$display--text-color--sm:  props.def(--o-heading--display--sm--text-color, props.get($display--text-color--xxl), 'color') !default;
+$display--text-color--xs:  props.def(--o-heading--display--xs--text-color, props.get(core.$theme, --text-mute-more), 'color') !default;
 
 $bg-start: props.def(--o-heading--bg-start, .05em) !default;
 $bg-end:   props.def(--o-heading--bg-end, .5em) !default;
@@ -20,7 +36,7 @@ $text-transform:   props.def(--o-heading--text-transform, none) !default;
 $font-family--xxl:      props.def(--o-heading--xxl--font-family, props.get(core.$font--standard--family)) !default;
 $line-height--xxl:      props.def(--o-heading--xxl--line-height, props.get(core.$font--standard--line-height)) !default;
 $font-size--xxl:        props.def(--o-heading--xxl--font-size, props.get(core.$font-size--300)) !default;
-$font-weight--xxl:      props.def(--o-heading--xxl--font-weight, props.get(core.$font--standard--weight)) !default;
+$font-weight--xxl:      props.def(--o-heading--xxl--font-weight, bold) !default;
 $letter-spacing--xxl:   props.def(--o-heading--xxl--letter-spacing, 0) !default;
 $feature-settings--xxl: props.def(--o-heading--xxl--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
 $text-transform--xxl:   props.def(--o-heading--xxl--text-transform, none) !default;
@@ -28,7 +44,7 @@ $text-transform--xxl:   props.def(--o-heading--xxl--text-transform, none) !defau
 $font-family--xl:      props.def(--o-heading--xl--font-family, props.get(core.$font--standard--family)) !default;
 $line-height--xl:      props.def(--o-heading--xl--line-height, props.get(core.$font--standard--line-height)) !default;
 $font-size--xl:        props.def(--o-heading--xl--font-size, props.get(core.$font-size--200)) !default;
-$font-weight--xl:      props.def(--o-heading--xl--font-weight, props.get(core.$font--standard--weight)) !default;
+$font-weight--xl:      props.def(--o-heading--xl--font-weight, bold) !default;
 $letter-spacing--xl:   props.def(--o-heading--xl--letter-spacing, 0) !default;
 $feature-settings--xl: props.def(--o-heading--xl--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
 $text-transform--xl:   props.def(--o-heading--xl--text-transform, none) !default;
@@ -51,27 +67,27 @@ $text-transform--md:   props.def(--o-heading--md--text-transform, none) !default
 
 $font-family--sm:      props.def(--o-heading--sm--font-family, props.get(core.$font--standard--family)) !default;
 $line-height--sm:      props.def(--o-heading--sm--line-height, props.get(core.$font--standard--line-height)) !default;
-$font-size--sm:        props.def(--o-heading--sm--font-size, props.get(core.$font-size--75)) !default;
-$font-weight--sm:      props.def(--o-heading--sm--font-weight, 500) !default;
-$letter-spacing--sm:   props.def(--o-heading--sm--letter-spacing, 1px) !default;
+$font-size--sm:        props.def(--o-heading--sm--font-size, props.get(core.$font-size--100)) !default;
+$font-weight--sm:      props.def(--o-heading--sm--font-weight, normal) !default;
+$letter-spacing--sm:   props.def(--o-heading--sm--letter-spacing, 0) !default;
 $feature-settings--sm: props.def(--o-heading--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
 $text-transform--sm:   props.def(--o-heading--sm--text-transform, none) !default;
 
 $font-family--xs:      props.def(--o-heading--xs--font-family, props.get(core.$font--standard--family)) !default;
 $line-height--xs:      props.def(--o-heading--xs--line-height, props.get(core.$font--standard--line-height)) !default;
 $font-size--xs:        props.def(--o-heading--xs--font-size, props.get(core.$font-size--50)) !default;
-$font-weight--xs:      props.def(--o-heading--xs--font-weight, 500) !default;
+$font-weight--xs:      props.def(--o-heading--xs--font-weight, normal) !default;
 $letter-spacing--xs:   props.def(--o-heading--xs--letter-spacing, 1px) !default;
 $feature-settings--xs: props.def(--o-heading--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
 $text-transform--xs:   props.def(--o-heading--xs--text-transform, none) !default;
 
 $sizes: (
-        'xs'  $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs $text-transform--xs,
-        'sm'  $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm $text-transform--sm,
-        'md'  $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md $text-transform--md,
-        'lg'  $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg $text-transform--lg,
-        'xl'  $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl $text-transform--xl,
-        'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl $text-transform--xxl,
+        'xs'  $font-family--xs $line-height--xs $font-size--xs $font-weight--xs $letter-spacing--xs $feature-settings--xs $text-transform--xs $text-color--xs,
+        'sm'  $font-family--sm $line-height--sm $font-size--sm $font-weight--sm $letter-spacing--sm $feature-settings--sm $text-transform--sm $text-color--sm,
+        'md'  $font-family--md $line-height--md $font-size--md $font-weight--md $letter-spacing--md $feature-settings--md $text-transform--md $text-color--md,
+        'lg'  $font-family--lg $line-height--lg $font-size--lg $font-weight--lg $letter-spacing--lg $feature-settings--lg $text-transform--lg $text-color--lg,
+        'xl'  $font-family--xl $line-height--xl $font-size--xl $font-weight--xl $letter-spacing--xl $feature-settings--xl $text-transform--xl $text-color--xl,
+        'xxl' $font-family--xxl $line-height--xxl $font-size--xxl $font-weight--xxl $letter-spacing--xxl $feature-settings--xxl $text-transform--xxl $text-color--xxl,
 ) !default;
 
 $display--font-family--xxl:      props.def(--o-heading--display--xxl--font-family, props.get(core.$font--headline--family)) !default;
@@ -101,14 +117,14 @@ $display--text-transform--lg:   props.def(--o-heading--display--lg--text-transfo
 $display--font-family--md:      props.def(--o-heading--display--md--font-family, props.get(core.$font--standard--family)) !default;
 $display--line-height--md:      props.def(--o-heading--display--md--line-height, props.get(core.$font--standard--line-height)) !default;
 $display--font-size--md:        props.def(--o-heading--display--md--font-size, props.get(core.$font-size--150)) !default;
-$display--font-weight--md:      props.def(--o-heading--display--md--font-weight, props.get(core.$font--standard--weight)) !default;
+$display--font-weight--md:      props.def(--o-heading--display--md--font-weight, bold) !default;
 $display--letter-spacing--md:   props.def(--o-heading--display--md--letter-spacing, 0) !default;
 $display--feature-settings--md: props.def(--o-heading--display--md--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
 $display--text-transform--md:   props.def(--o-heading--display--md--text-transform, none) !default;
 
 $display--font-family--sm:      props.def(--o-heading--display--sm--font-family, props.get(core.$font--standard--family)) !default;
 $display--line-height--sm:      props.def(--o-heading--display--sm--line-height, props.get(core.$font--standard--line-height)) !default;
-$display--font-size--sm:        props.def(--o-heading--display--sm--font-size, props.get(core.$font-size--75)) !default;
+$display--font-size--sm:        props.def(--o-heading--display--sm--font-size, props.get(core.$font-size--100)) !default;
 $display--font-weight--sm:      props.def(--o-heading--display--sm--font-weight, bold) !default;
 $display--letter-spacing--sm:   props.def(--o-heading--display--sm--letter-spacing, 0) !default;
 $display--feature-settings--sm: props.def(--o-heading--display--sm--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
@@ -117,7 +133,7 @@ $display--text-transform--sm:   props.def(--o-heading--display--sm--text-transfo
 $display--font-family--xs:      props.def(--o-heading--display--xs--font-family, props.get(core.$font--standard--family)) !default;
 $display--line-height--xs:      props.def(--o-heading--display--xs--line-height, props.get(core.$font--standard--line-height)) !default;
 $display--font-size--xs:        props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50)) !default;
-$display--font-weight--xs:      props.def(--o-heading--display--xs--font-weight, 500) !default;
+$display--font-weight--xs:      props.def(--o-heading--display--xs--font-weight, normal) !default;
 $display--letter-spacing--xs:   props.def(--o-heading--display--xs--letter-spacing, 1px) !default;
 $display--feature-settings--xs: props.def(--o-heading--display--xs--feature-settings, props.get(core.$font--standard--feature-settings)) !default;
 $display--text-transform--xs:   props.def(--o-heading--display--xs--text-transform, none) !default;
@@ -130,10 +146,62 @@ $display--font-size--sm--md:  props.def(--o-heading--display--sm--font-size, pro
 $display--font-size--xs--md:  props.def(--o-heading--display--xs--font-size, props.get(core.$font-size--50), 'md') !default;
 
 $display--sizes: (
-        'xs'  $display--font-family--xs $display--line-height--xs $display--font-size--xs $display--font-weight--xs $display--letter-spacing--xs $display--feature-settings--xs $display--text-transform--xs,
-        'sm'  $display--font-family--sm $display--line-height--sm $display--font-size--sm $display--font-weight--sm $display--letter-spacing--sm $display--feature-settings--sm $display--text-transform--sm,
-        'md'  $display--font-family--md $display--line-height--md $display--font-size--md $display--font-weight--md $display--letter-spacing--md $display--feature-settings--md $display--text-transform--md,
-        'lg'  $display--font-family--lg $display--line-height--lg $display--font-size--lg $display--font-weight--lg $display--letter-spacing--lg $display--feature-settings--lg $display--text-transform--lg,
-        'xl'  $display--font-family--xl $display--line-height--xl $display--font-size--xl $display--font-weight--xl $display--letter-spacing--xl $display--feature-settings--xl $display--text-transform--xl,
-        'xxl' $display--font-family--xxl $display--line-height--xxl $display--font-size--xxl $display--font-weight--xxl $display--letter-spacing--xxl $display--feature-settings--xxl $display--text-transform--xxl,
+        'xs'  $display--font-family--xs $display--line-height--xs $display--font-size--xs $display--font-weight--xs $display--letter-spacing--xs $display--feature-settings--xs $display--text-transform--xs $display--text-color--xs,
+        'sm'  $display--font-family--sm $display--line-height--sm $display--font-size--sm $display--font-weight--sm $display--letter-spacing--sm $display--feature-settings--sm $display--text-transform--sm $display--text-color--sm,
+        'md'  $display--font-family--md $display--line-height--md $display--font-size--md $display--font-weight--md $display--letter-spacing--md $display--feature-settings--md $display--text-transform--md $display--text-color--md,
+        'lg'  $display--font-family--lg $display--line-height--lg $display--font-size--lg $display--font-weight--lg $display--letter-spacing--lg $display--feature-settings--lg $display--text-transform--lg $display--text-color--lg,
+        'xl'  $display--font-family--xl $display--line-height--xl $display--font-size--xl $display--font-weight--xl $display--letter-spacing--xl $display--feature-settings--xl $display--text-transform--xl $display--text-color--xl,
+        'xxl' $display--font-family--xxl $display--line-height--xxl $display--font-size--xxl $display--font-weight--xxl $display--letter-spacing--xxl $display--feature-settings--xxl $display--text-transform--xxl $display--text-color--xxl,
 ) !default;
+
+$static-themes: props.def(--o-heading, (), 'color');
+
+@each $theme in map.keys(props.get(core.$transparent-colors)) {
+        $heading-theme: --static-#{string.slice($theme, 3)};
+
+        $static-themes: props.merge($static-themes, (
+                $heading-theme: (
+                        --text-color: props.get(core.$transparent-colors, $theme, --900),
+
+                        --xxl: (
+                                --text-color: props.get(core.$transparent-colors, $theme, --900),
+                        ),
+                        --xl: (
+                                --text-color: props.get(core.$transparent-colors, $theme, --900),
+                        ),
+                        --lg: (
+                                --text-color: props.get(core.$transparent-colors, $theme, --900),
+                        ),
+                        --md: (
+                                --text-color: props.get(core.$transparent-colors, $theme, --900),
+                        ),
+                        --sm: (
+                                --text-color: props.get(core.$transparent-colors, $theme, --500),
+                        ),
+                        --xs: (
+                                --text-color: props.get(core.$transparent-colors, $theme, --500),
+                        ),
+
+                        --display: (
+                                --xxl: (
+                                        --text-color: props.get(core.$transparent-colors, $theme, --900),
+                                ),
+                                --xl: (
+                                        --text-color: props.get(core.$transparent-colors, $theme, --900),
+                                ),
+                                --lg: (
+                                        --text-color: props.get(core.$transparent-colors, $theme, --900),
+                                ),
+                                --md: (
+                                        --text-color: props.get(core.$transparent-colors, $theme, --900),
+                                ),
+                                --sm: (
+                                        --text-color: props.get(core.$transparent-colors, $theme, --900),
+                                ),
+                                --xs: (
+                                        --text-color: props.get(core.$transparent-colors, $theme, --500),
+                                ),
+                        ),
+                )
+        ));
+}