Adding color-setup.css with selectors

equinor · Jul 1, 2024 · 7260b56 · 7260b56
1 parent 1779f4c
commit 7260b56
Show file tree

Hide file tree

Showing 11 changed files with 45 additions and 7 deletions.
diff --git a/packages/eds-tokens-build/src/index.ts b/packages/eds-tokens-build/src/index.ts
@@ -41,7 +41,6 @@ const lightDarkTransform: StyleDictionary.Transform = {
   matcher: isColor,
   transformer: (token: StyleDictionary.TransformedToken, options) => {
     const path = token.path.join('/')
-    console.log(path)
     const darkValue =
       darkTokens[darkColorSchemeCollectionFile]?.[`${path}`]?.['$value']
 

diff --git a/packages/eds-tokens/build/css/color-setup.css b/packages/eds-tokens/build/css/color-setup.css
@@ -0,0 +1,8 @@
+:root,
+[data-color-scheme="light"] {
+  color-scheme: light;
+}
+
+[data-color-scheme="dark"] {
+  color-scheme: dark;
+}
diff --git a/packages/eds-tokens/build/css/index-trimmed.css b/packages/eds-tokens/build/css/index-trimmed.css
@@ -1,3 +1,4 @@
+@import 'color-setup.css';
 @import 'color/colors-trimmed.css';
 @import 'spacing-setup.css';
-@import 'spacing/spacing-trimmed.css';
+@import 'spacing/spacing-trimmed.css';
diff --git a/packages/eds-tokens/build/css/index-verbose.css b/packages/eds-tokens/build/css/index-verbose.css
@@ -1,5 +1,6 @@
 @import 'color/primitives-trimmed.css';
+@import 'color-setup.css';
 @import 'color/colors-verbose.css';
 @import 'spacing-setup.css';
 @import 'spacing/primitives-trimmed.css';
-@import 'spacing/spacing-verbose.css';
+@import 'spacing/spacing-verbose.css';
diff --git a/packages/eds-tokens/build/css/variables-trimmed.css b/packages/eds-tokens/build/css/variables-trimmed.css
@@ -1,3 +1,11 @@
+:root, [data-color-scheme="light"] {
+  color-scheme: light;
+}
+
+[data-color-scheme="dark"] {
+  color-scheme: dark;
+}
+
 :root {
   --eds-color-shadow: light-dark(#00000024, #00000024);
   --eds-color-text-primary: light-dark(#3d3d3d, #d6d9dc);

diff --git a/packages/eds-tokens/build/css/variables-trimmed.min.css b/packages/eds-tokens/build/css/variables-trimmed.min.css
diff --git a/packages/eds-tokens/build/css/variables-verbose.css b/packages/eds-tokens/build/css/variables-verbose.css
@@ -325,6 +325,17 @@
   --eds-color-moss-green-sat-1350: #033b3f;
   --eds-color-moss-green-sat-1400: #033235;
   --eds-color-moss-green-sat-1450: #02292c;
+}
+
+:root, [data-color-scheme="light"] {
+  color-scheme: light;
+}
+
+[data-color-scheme="dark"] {
+  color-scheme: dark;
+}
+
+:root {
   --eds-ui-scrim-color-surface: light-dark(#0006, #0006);
   --eds-table-cell-color-interactive-surface-disabled: light-dark(#fff0, #0000);
   --eds-table-cell-color-interactive-surface-resting-initial-on-level-3: light-dark(#fff0, #0000);

diff --git a/packages/eds-tokens/build/css/variables-verbose.min.css b/packages/eds-tokens/build/css/variables-verbose.min.css
diff --git a/packages/eds-tokens/src/css/color-setup.css b/packages/eds-tokens/src/css/color-setup.css
@@ -0,0 +1,8 @@
+:root,
+[data-color-scheme="light"] {
+  color-scheme: light;
+}
+
+[data-color-scheme="dark"] {
+  color-scheme: dark;
+}
diff --git a/packages/eds-tokens/src/css/index-trimmed.css b/packages/eds-tokens/src/css/index-trimmed.css
@@ -1,3 +1,4 @@
+@import 'color-setup.css';
 @import 'color/colors-trimmed.css';
 @import 'spacing-setup.css';
-@import 'spacing/spacing-trimmed.css';
+@import 'spacing/spacing-trimmed.css';
diff --git a/packages/eds-tokens/src/css/index-verbose.css b/packages/eds-tokens/src/css/index-verbose.css
@@ -1,5 +1,6 @@
 @import 'color/primitives-trimmed.css';
+@import 'color-setup.css';
 @import 'color/colors-verbose.css';
 @import 'spacing-setup.css';
 @import 'spacing/primitives-trimmed.css';
-@import 'spacing/spacing-verbose.css';
+@import 'spacing/spacing-verbose.css';