Static themes fix

3 files changed, 36 insertions, 10 deletions

diff --git a/src/_themes.scss b/src/_themes.scss
index 9b868f3..caf1e80 100644
--- a/src/_themes.scss
+++ b/src/_themes.scss
@@ -71,13 +71,4 @@
             }
         }
     }
-
-    @each $theme in map.keys(props.get(vars.$transparent-colors)) {
-        $theme-name: static-#{string.slice($theme, 3)};
-
-        @include bem.theme($theme-name) {
-            color:            props.get(vars.$transparent-colors, $theme, --text);
-            background-color: props.get(vars.$transparent-colors, $theme, --900);
-        }
-    }
 }
diff --git a/src/_utils.scss b/src/_utils.scss
index e90aa57..49191ef 100644
--- a/src/_utils.scss
+++ b/src/_utils.scss
@@ -1,4 +1,5 @@
 @use 'sass:map';
+@use 'sass:string';
 @use 'iro-sass/src/bem';
 @use 'iro-sass/src/props';
 @use 'include-media/dist/include-media' as media;
@@ -154,18 +155,50 @@ $-sizes: (
 
     @include bem.utility('c-heading') {
         color: props.get(vars.$theme, --heading);
+
+        @each $theme in map.keys(props.get(vars.$transparent-colors)) {
+            $theme-name: static-#{string.slice($theme, 3)};
+    
+            @include bem.at-theme($theme-name) {
+                color: props.get(vars.$transparent-colors, $theme, --900);
+            }
+        }
     }
 
     @include bem.utility('c-text') {
         color: props.get(vars.$theme, --text);
+
+        @each $theme in map.keys(props.get(vars.$transparent-colors)) {
+            $theme-name: static-#{string.slice($theme, 3)};
+    
+            @include bem.at-theme($theme-name) {
+                color: props.get(vars.$transparent-colors, $theme, --800);
+            }
+        }
     }
 
     @include bem.utility('c-mute') {
         color: props.get(vars.$theme, --text-mute);
+
+        @each $theme in map.keys(props.get(vars.$transparent-colors)) {
+            $theme-name: static-#{string.slice($theme, 3)};
+    
+            @include bem.at-theme($theme-name) {
+                color: props.get(vars.$transparent-colors, $theme, --700);
+            }
+        }
     }
 
     @include bem.utility('c-mute-more') {
         color: props.get(vars.$theme, --text-mute-more);
+
+        @each $theme in map.keys(props.get(vars.$transparent-colors)) {
+            $theme-name: static-#{string.slice($theme, 3)};
+    
+            @include bem.at-theme($theme-name) {
+                color: props.get(vars.$transparent-colors, $theme, --600);
+            }
+        }
     }
 
     @each $dir, $prop in (is: inline-size, bs: block-size) {
diff --git a/src/scopes/_implicit.scss b/src/scopes/_implicit.scss
index 9bd411a..78f06be 100644
--- a/src/scopes/_implicit.scss
+++ b/src/scopes/_implicit.scss
@@ -160,13 +160,15 @@
 
         @each $theme in map.keys(props.get(core.$transparent-colors)) {
             .t-static-#{string.slice($theme, 3)} {
+                color: props.get(core.$transparent-colors, $theme, --800);
+
                 h1,
                 h2,
                 h3,
                 h4,
                 h5,
                 h6 {
-                    color: props.get(core.$transparent-colors, $theme, --text);
+                    color: props.get(core.$transparent-colors, $theme, --900);
                 }
 
                 hr {