fix: badge color

daangn · Jan 21, 2025 · 1a9d543 · 1a9d543
1 parent e770416
commit 1a9d543
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 29 deletions.
diff --git a/docs/public/rootage/components/badge.json b/docs/public/rootage/components/badge.json
@@ -112,7 +112,7 @@
           "color": "$color.bg.brand-weak"
         },
         "label": {
-          "color": "$color.fg.brand"
+          "color": "$color.fg.brand-contrast"
         }
       }
     },
@@ -142,7 +142,7 @@
           "color": "$color.bg.informative-weak"
         },
         "label": {
-          "color": "$color.fg.informative"
+          "color": "$color.fg.informative-contrast"
         }
       }
     },
@@ -172,7 +172,7 @@
           "color": "$color.bg.positive-weak"
         },
         "label": {
-          "color": "$color.fg.positive"
+          "color": "$color.fg.positive-contrast"
         }
       }
     },
@@ -202,7 +202,7 @@
           "color": "$color.bg.danger-weak"
         },
         "label": {
-          "color": "$color.fg.danger"
+          "color": "$color.fg.danger-contrast"
         }
       }
     },

diff --git a/docs/public/rootage/parsed.json b/docs/public/rootage/parsed.json
@@ -10746,7 +10746,7 @@
                           "color",
                           "fg"
                         ],
-                        "key": "brand"
+                        "key": "brand-contrast"
                       }
                     }
                   ]
@@ -10887,7 +10887,7 @@
                           "color",
                           "fg"
                         ],
-                        "key": "informative"
+                        "key": "informative-contrast"
                       }
                     }
                   ]
@@ -11028,7 +11028,7 @@
                           "color",
                           "fg"
                         ],
-                        "key": "positive"
+                        "key": "positive-contrast"
                       }
                     }
                   ]
@@ -11169,7 +11169,7 @@
                           "color",
                           "fg"
                         ],
-                        "key": "danger"
+                        "key": "danger-contrast"
                       }
                     }
                   ]

diff --git a/packages/rootage/components/badge.yaml b/packages/rootage/components/badge.yaml
@@ -71,7 +71,7 @@ data:
       root:
         color: $color.bg.brand-weak
       label:
-        color: $color.fg.brand
+        color: $color.fg.brand-contrast
   tone=brand, variant=solid:
     enabled:
       root:
@@ -89,7 +89,7 @@ data:
       root:
         color: $color.bg.informative-weak
       label:
-        color: $color.fg.informative
+        color: $color.fg.informative-contrast
   tone=informative, variant=solid:
     enabled:
       root:
@@ -107,7 +107,7 @@ data:
       root:
         color: $color.bg.positive-weak
       label:
-        color: $color.fg.positive
+        color: $color.fg.positive-contrast
   tone=positive, variant=solid:
     enabled:
       root:
@@ -125,7 +125,7 @@ data:
       root:
         color: $color.bg.danger-weak
       label:
-        color: $color.fg.danger
+        color: $color.fg.danger-contrast
   tone=danger, variant=solid:
     enabled:
       root:

diff --git a/packages/stylesheet/badge.css b/packages/stylesheet/badge.css
@@ -71,7 +71,7 @@
     background-color: var(--seed-v3-color-bg-brand-weak)
 }
 .badge__label--tone_brand-variant_weak {
-    color: var(--seed-v3-color-fg-brand)
+    color: var(--seed-v3-color-fg-brand-contrast)
 }
 .badge__root--tone_brand-variant_solid {
     background-color: var(--seed-v3-color-bg-brand-solid)
@@ -89,7 +89,7 @@
     background-color: var(--seed-v3-color-bg-informative-weak)
 }
 .badge__label--tone_informative-variant_weak {
-    color: var(--seed-v3-color-fg-informative)
+    color: var(--seed-v3-color-fg-informative-contrast)
 }
 .badge__root--tone_informative-variant_solid {
     background-color: var(--seed-v3-color-bg-informative-solid)
@@ -107,7 +107,7 @@
     background-color: var(--seed-v3-color-bg-positive-weak)
 }
 .badge__label--tone_positive-variant_weak {
-    color: var(--seed-v3-color-fg-positive)
+    color: var(--seed-v3-color-fg-positive-contrast)
 }
 .badge__root--tone_positive-variant_solid {
     background-color: var(--seed-v3-color-bg-positive-solid)
@@ -125,7 +125,7 @@
     background-color: var(--seed-v3-color-bg-danger-weak)
 }
 .badge__label--tone_danger-variant_weak {
-    color: var(--seed-v3-color-fg-danger)
+    color: var(--seed-v3-color-fg-danger-contrast)
 }
 .badge__root--tone_danger-variant_solid {
     background-color: var(--seed-v3-color-bg-danger-solid)

diff --git a/packages/stylesheet/component.css b/packages/stylesheet/component.css
@@ -1835,7 +1835,7 @@
 }
 
 .badge__label--tone_brand-variant_weak {
-  color: var(--seed-v3-color-fg-brand);
+  color: var(--seed-v3-color-fg-brand-contrast);
 }
 
 .badge__root--tone_brand-variant_solid {
@@ -1859,7 +1859,7 @@
 }
 
 .badge__label--tone_informative-variant_weak {
-  color: var(--seed-v3-color-fg-informative);
+  color: var(--seed-v3-color-fg-informative-contrast);
 }
 
 .badge__root--tone_informative-variant_solid {
@@ -1883,7 +1883,7 @@
 }
 
 .badge__label--tone_positive-variant_weak {
-  color: var(--seed-v3-color-fg-positive);
+  color: var(--seed-v3-color-fg-positive-contrast);
 }
 
 .badge__root--tone_positive-variant_solid {
@@ -1907,7 +1907,7 @@
 }
 
 .badge__label--tone_danger-variant_weak {
-  color: var(--seed-v3-color-fg-danger);
+  color: var(--seed-v3-color-fg-danger-contrast);
 }
 
 .badge__root--tone_danger-variant_solid {

diff --git a/packages/stylesheet/component.min.css b/packages/stylesheet/component.min.css
diff --git a/packages/vars/lib/component/badge.d.ts b/packages/vars/lib/component/badge.d.ts
@@ -106,7 +106,7 @@ export declare const vars: {
         "color": "var(--seed-v3-color-bg-brand-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-brand)"
+        "color": "var(--seed-v3-color-fg-brand-contrast)"
       }
     }
   },
@@ -136,7 +136,7 @@ export declare const vars: {
         "color": "var(--seed-v3-color-bg-informative-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-informative)"
+        "color": "var(--seed-v3-color-fg-informative-contrast)"
       }
     }
   },
@@ -166,7 +166,7 @@ export declare const vars: {
         "color": "var(--seed-v3-color-bg-positive-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-positive)"
+        "color": "var(--seed-v3-color-fg-positive-contrast)"
       }
     }
   },
@@ -196,7 +196,7 @@ export declare const vars: {
         "color": "var(--seed-v3-color-bg-danger-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-danger)"
+        "color": "var(--seed-v3-color-fg-danger-contrast)"
       }
     }
   },

diff --git a/packages/vars/lib/component/badge.mjs b/packages/vars/lib/component/badge.mjs
@@ -106,7 +106,7 @@ export const vars = {
         "color": "var(--seed-v3-color-bg-brand-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-brand)"
+        "color": "var(--seed-v3-color-fg-brand-contrast)"
       }
     }
   },
@@ -136,7 +136,7 @@ export const vars = {
         "color": "var(--seed-v3-color-bg-informative-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-informative)"
+        "color": "var(--seed-v3-color-fg-informative-contrast)"
       }
     }
   },
@@ -166,7 +166,7 @@ export const vars = {
         "color": "var(--seed-v3-color-bg-positive-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-positive)"
+        "color": "var(--seed-v3-color-fg-positive-contrast)"
       }
     }
   },
@@ -196,7 +196,7 @@ export const vars = {
         "color": "var(--seed-v3-color-bg-danger-weak)"
       },
       "label": {
-        "color": "var(--seed-v3-color-fg-danger)"
+        "color": "var(--seed-v3-color-fg-danger-contrast)"
       }
     }
   },