feat(odyssey-design-tokens): add tokens for colorized text

okta · Jun 5, 2023 · 6f89fc8 · 6f89fc8
1 parent 07976a7
commit 6f89fc8
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/packages/odyssey-design-tokens/src/palette.json b/packages/odyssey-design-tokens/src/palette.json
@@ -5,25 +5,29 @@
       "light": { "value": "{hue.blue.300.value}" },
       "main": { "value": "{hue.blue.500.value}" },
       "dark": { "value": "{hue.blue.700.value}" },
-      "darker": { "value": "{hue.blue.900.value}" }
+      "darker": { "value": "{hue.blue.900.value}" },
+      "text": { "value": "{hue.blue.600.value}" }
     },
     "danger": {
       "lighter": { "value": "{hue.red.50.value}" },
       "light": { "value": "{hue.red.300.value}" },
       "main": { "value": "{hue.red.500.value}" },
-      "dark": { "value": "{hue.red.900.value}" }
+      "dark": { "value": "{hue.red.900.value}" },
+      "text": { "value": "{hue.red.600.value}" }
     },
     "warning": {
       "lighter": { "value": "{hue.yellow.50.value}" },
       "light": { "value": "{hue.yellow.300.value}" },
       "main": { "value": "{hue.yellow.500.value}" },
-      "dark": { "value": "{hue.yellow.900.value}" }
+      "dark": { "value": "{hue.yellow.900.value}" },
+      "text": { "value": "{hue.yellow.700.value}" }
     },
     "success": {
       "lighter": { "value": "{hue.green.50.value}" },
       "light": { "value": "{hue.green.300.value}" },
       "main": { "value": "{hue.green.500.value}" },
-      "dark": { "value": "{hue.green.900.value}" }
+      "dark": { "value": "{hue.green.900.value}" },
+      "text": { "value": "{hue.green.600.value}" }
     },
     "neutral": {
       "main": { "value": "{hue.neutral.600.value}" },

diff --git a/packages/odyssey-design-tokens/src/typography.json b/packages/odyssey-design-tokens/src/typography.json
@@ -13,15 +13,23 @@
         "comment": "Inverse text color typically used on a colorful background",
         "value": "{hue.neutral.white.value}"
       },
-      "action": {
-        "comment": "Branded text color, primarily used within button",
-        "value": "{palette.primary.main.value}"
-      },
       "sub": {
         "comment": "Text color for subordinate text like captions",
         "value": "{hue.neutral.600.value}"
       },
-      "danger": { "value": "{palette.danger.main.value}" }
+      "action": {
+        "comment": "Branded text color, primarily used within button",
+        "value": "{palette.primary.text.value}"
+      },
+      "danger": {
+        "value": "{palette.danger.text.value}"
+      },
+      "success": {
+        "value": "{palette.success.text.value}"
+      },
+      "warning": {
+        "value": "{palette.warning.text.value}"
+      }
     },
     "family": {
       "body": {