feat(data): 1. Update descriptions on origin reds. 2. Update values o…

…f button.space.layout.gap tokens. 3. Rename elevation tokens to shadow. 4. Rename borderradius tokens to radius. 5. Update description on global.borderradius.interactive.XS. 6. Update values of some base.color.interactive.danger tokens.
Sage · Mar 22, 2024 · 1b550d0 · 1b550d0
1 parent 75fdac9
commit 1b550d0
Show file tree

Hide file tree

Showing 7 changed files with 16 additions and 14 deletions.
diff --git a/data/tokens/$metadata.json b/data/tokens/$metadata.json
@@ -2,8 +2,8 @@
   "tokenSetOrder": [
     "origin",
     "global/borderwidth",
-    "global/elevation",
-    "global/borderradius",
+    "global/shadow",
+    "global/radius",
     "global/size",
     "global/space",
     "global/typography",

diff --git a/data/tokens/$themes.json b/data/tokens/$themes.json
@@ -373,10 +373,10 @@
       "global/size": "source",
       "global/typography": "enabled",
       "global/space": "source",
-      "global/elevation": "source",
       "Components/table": "enabled",
-      "global/borderradius": "source",
-      "global/borderwidth": "source"
+      "global/borderwidth": "source",
+      "global/shadow": "source",
+      "global/radius": "source"
     },
     "group": "Components",
     "$figmaCollectionId": "VariableCollectionId:275:489",

diff --git a/data/tokens/Components/button.json b/data/tokens/Components/button.json
@@ -31,12 +31,12 @@
       "layout": {
         "gap": {
           "S": {
-            "value": "{global.space.micro.L}",
+            "value": "{global.space.macro.XS}",
             "type": "spacing",
             "description": "Spacing between small buttons"
           },
           "M": {
-            "value": "{global.space.macro.XS}",
+            "value": "{global.space.macro.S}",
             "type": "spacing",
             "description": "Spacing between medium buttons"
           },

diff --git a/data/tokens/Modes/light.json b/data/tokens/Modes/light.json
@@ -444,7 +444,7 @@
               "type": "color"
             },
             "defaultAlt": {
-              "value": "{origin.colors.red}",
+              "value": "{base.color.interactive.danger.standard.default}",
               "type": "color",
               "$extensions": {
                 "studio.tokens": {
@@ -459,7 +459,7 @@
               "description": "For links in datatables"
             },
             "hover": {
-              "value": "{base.color.status.negative.standard.default}",
+              "value": "{base.color.interactive.danger.standard.default}",
               "type": "color",
               "$extensions": {
                 "studio.tokens": {
@@ -548,7 +548,7 @@
               "description": "for links in datatables\n"
             },
             "hover": {
-              "value": "{base.color.status.negative.inverse.default}",
+              "value": "{base.color.interactive.danger.inverse.default}",
               "type": "color",
               "$extensions": {
                 "studio.tokens": {

diff --git a/data/tokens/global/borderradius.json → data/tokens/global/radius.json b/data/tokens/global/borderradius.json → data/tokens/global/radius.json
@@ -51,7 +51,7 @@
         "XS": {
           "value": "{origin.dimension.25} * {global.borderradius.scale}",
           "type": "borderRadius",
-          "description": "Checkbox (S, M), Link (focus background and underline)"
+          "description": "Link (focus background and underline)"
         },
         "S": {
           "value": "{origin.dimension.50} * {global.borderradius.scale}",

diff --git a/data/tokens/global/elevation.json → data/tokens/global/shadow.json b/data/tokens/global/elevation.json → data/tokens/global/shadow.json
diff --git a/data/tokens/origin.json b/data/tokens/origin.json
@@ -67,15 +67,17 @@
       "red": {
         "value": "#CB374B",
         "type": "color",
-        "description": "AAA against FFFFFF bg"
+        "description": "AAA against FFFFFF bg. Used in most components, on light bgs.\n"
       },
       "brightRed": {
         "value": "#FF3053",
-        "type": "color"
+        "type": "color",
+        "description": "Used in feedback components, on dark bg (meets SHAPE accessibility reqs)\n"
       },
       "lightRed": {
         "value": "#E13E54",
-        "type": "color"
+        "type": "color",
+        "description": "Used in Buttons on dark bg (meets text accessibility reqs).\n"
       },
       "transparent": {
         "value": "rgba(0,0,0,0)",