add dark dimmed bgColors (#1163)

primer · Jan 24, 2025 · 8279cb3 · 8279cb3
1 parent 630d875
commit 8279cb3
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 44 deletions.
diff --git a/src/tokens/functional/color/bgColor.json5 b/src/tokens/functional/color/bgColor.json5
@@ -14,7 +14,8 @@
         },
         'org.primer.overrides': {
           dark: '{base.color.neutral.1}',
-          "dark-high-contrast": "{base.color.neutral.0}",
+          'dark-dimmed': '{base.color.neutral.3}',
+          'dark-high-contrast': '{base.color.neutral.0}',
         },
       },
     },
@@ -32,8 +33,9 @@
         },
         'org.primer.overrides': {
           dark: '{base.color.neutral.2}',
-          "light-high-contrast": "{base.color.neutral.3}",
-          "dark-high-contrast": "{base.color.neutral.2}",
+          'dark-dimmed': '{base.color.neutral.4}',
+          'light-high-contrast': '{base.color.neutral.3}',
+          'dark-high-contrast': '{base.color.neutral.2}',
         },
       },
     },
@@ -51,7 +53,8 @@
         },
         'org.primer.overrides': {
           dark: '{base.color.neutral.0}',
-          "light-high-contrast": "{base.color.neutral.2}",
+          'dark-dimmed': '{base.color.neutral.2}',
+          'light-high-contrast': '{base.color.neutral.2}',
         },
       },
     },
@@ -125,8 +128,9 @@
         },
         'org.primer.overrides': {
           dark: '{base.color.neutral.3}',
-          "light-high-contrast": "{base.color.neutral.4}",
-          "dark-high-contrast": "{base.color.neutral.4}",
+          'dark-dimmed': '{base.color.neutral.5}',
+          'light-high-contrast': '{base.color.neutral.4}',
+          'dark-high-contrast': '{base.color.neutral.4}',
         },
       },
     },
@@ -163,8 +167,8 @@
               $value: '{base.color.neutral.8}',
               alpha: 0.2,
             },
-            "light-high-contrast": "{base.color.neutral.4}",
-            "dark-high-contrast": "{base.color.neutral.3}",
+            'light-high-contrast': '{base.color.neutral.4}',
+            'dark-high-contrast': '{base.color.neutral.3}',
           },
         },
       },
@@ -179,8 +183,9 @@
           },
           'org.primer.overrides': {
             dark: '{base.color.neutral.8}',
-            "light-high-contrast": "{base.color.neutral.10}",
-            "dark-high-contrast": "{base.color.neutral.7}",
+            'dark-dimmed': '{base.color.neutral.8}',
+            'light-high-contrast': '{base.color.neutral.10}',
+            'dark-high-contrast': '{base.color.neutral.7}',
           },
         },
       },
@@ -220,7 +225,7 @@
           },
           'org.primer.overrides': {
             dark: '{base.color.blue.5}',
-            "dark-high-contrast": "{base.color.blue.9}",
+            'dark-high-contrast': '{base.color.blue.9}',
           },
         },
       },
@@ -253,7 +258,6 @@
               $value: '{base.color.blue.4}',
               alpha: 0.2,
             },
-
           },
         },
       },
@@ -275,8 +279,8 @@
             'dark-tritanopia': '{base.color.blue.5}',
             'light-protanopia-deuteranopia': '{base.color.blue.5}',
             'dark-protanopia-deuteranopia': '{base.color.blue.5}',
-            "light-high-contrast": "{base.color.green.5}",
-            "dark-high-contrast": "{base.color.green.9}",
+            'light-high-contrast': '{base.color.green.5}',
+            'dark-high-contrast': '{base.color.green.9}',
           },
         },
       },
@@ -363,7 +367,7 @@
             },
           },
           'org.primer.overrides': {
-            "dark-high-contrast": "{base.color.yellow.9}",
+            'dark-high-contrast': '{base.color.yellow.9}',
           },
         },
       },
@@ -409,7 +413,7 @@
           'org.primer.overrides': {
             'light-tritanopia': '{base.color.red.5}',
             'dark-tritanopia': '{base.color.red.5}',
-            "dark-high-contrast": "{base.color.orange.9}",
+            'dark-high-contrast': '{base.color.orange.9}',
           },
         },
       },
@@ -454,8 +458,8 @@
           },
           'org.primer.overrides': {
             'light-protanopia-deuteranopia': '{base.color.orange.5}',
-            "dark-protanopia-deuteranopia": "{base.color.orange.5}",
-            "dark-high-contrast": "{base.color.red.9}",
+            'dark-protanopia-deuteranopia': '{base.color.orange.5}',
+            'dark-high-contrast': '{base.color.red.9}',
           },
         },
       },
@@ -542,7 +546,7 @@
             },
           },
           'org.primer.overrides': {
-            "dark-high-contrast": "{base.color.purple.9}",
+            'dark-high-contrast': '{base.color.purple.9}',
           },
         },
       },
@@ -615,7 +619,7 @@
             },
           },
           'org.primer.overrides': {
-"dark-high-contrast": "{base.color.pink.9}",
+            'dark-high-contrast': '{base.color.pink.9}',
           },
         },
       },

diff --git a/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 b/src/tokens/functional/color/dark/overrides/dark.dimmed.json5
@@ -4,30 +4,6 @@
  * @description All overwrites for functional color tokens for dark dimmed color mode are in this file
  */
 {
-  bgColor: {
-    default: {
-      $value: '{base.color.neutral.3}',
-      $type: 'color',
-    },
-    muted: {
-      $value: '{base.color.neutral.4}',
-      $type: 'color',
-    },
-    inset: {
-      $value: '{base.color.neutral.2}',
-      $type: 'color',
-    },
-    disabled: {
-      $value: '{base.color.neutral.5}',
-      $type: 'color',
-    },
-    neutral: {
-      emphasis: {
-        $value: '{base.color.neutral.8}',
-        $type: 'color',
-      },
-    },
-  },
   control: {
     bgColor: {
       rest: {