Skip to content

Commit 56e143a

Browse files
fix(button): s1/express static outline variant content color (#3665)
1 parent 2354c1c commit 56e143a

File tree

2 files changed

+25
-0
lines changed

2 files changed

+25
-0
lines changed

.changeset/happy-frogs-flash.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@spectrum-css/button": patch
3+
---
4+
5+
Adjust S1/Express static outline variant content color (from transparent-black/white to solid black/white) to fix unintentional regression.

components/button/themes/spectrum.css

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,11 @@
6262
--spectrum-button-background-color-down: var(--spectrum-transparent-white-400);
6363
--spectrum-button-background-color-focus: var(--spectrum-transparent-white-300);
6464

65+
--spectrum-button-content-color-default: var(--spectrum-white);
66+
--spectrum-button-content-color-hover: var(--spectrum-white);
67+
--spectrum-button-content-color-down: var(--spectrum-white);
68+
--spectrum-button-content-color-focus: var(--spectrum-white);
69+
6570
--spectrum-button-border-color-default: var(--spectrum-transparent-white-800);
6671
--spectrum-button-border-color-hover: var(--spectrum-transparent-white-900);
6772
--spectrum-button-border-color-down: var(--spectrum-transparent-white-900);
@@ -74,6 +79,11 @@
7479
--spectrum-button-background-color-down: var(--spectrum-transparent-white-400);
7580
--spectrum-button-background-color-focus: var(--spectrum-transparent-white-300);
7681

82+
--spectrum-button-content-color-default: var(--spectrum-white);
83+
--spectrum-button-content-color-hover: var(--spectrum-white);
84+
--spectrum-button-content-color-down: var(--spectrum-white);
85+
--spectrum-button-content-color-focus: var(--spectrum-white);
86+
7787
&.spectrum-Button--outline {
7888
--spectrum-button-border-color-default: var(--spectrum-transparent-white-300);
7989
--spectrum-button-border-color-hover: var(--spectrum-transparent-white-400);
@@ -99,6 +109,11 @@
99109
--spectrum-button-background-color-down: var(--spectrum-transparent-black-400);
100110
--spectrum-button-background-color-focus: var(--spectrum-transparent-black-300);
101111

112+
--spectrum-button-content-color-default: var(--spectrum-black);
113+
--spectrum-button-content-color-hover: var(--spectrum-black);
114+
--spectrum-button-content-color-down: var(--spectrum-black);
115+
--spectrum-button-content-color-focus: var(--spectrum-black);
116+
102117
--spectrum-button-border-color-default: var(--spectrum-transparent-black-400);
103118
--spectrum-button-border-color-hover: var(--spectrum-transparent-black-500);
104119
--spectrum-button-border-color-down: var(--spectrum-transparent-black-600);
@@ -111,6 +126,11 @@
111126
--spectrum-button-background-color-down: var(--spectrum-transparent-black-400);
112127
--spectrum-button-background-color-focus: var(--spectrum-transparent-black-300);
113128

129+
--spectrum-button-content-color-default: var(--spectrum-black);
130+
--spectrum-button-content-color-hover: var(--spectrum-black);
131+
--spectrum-button-content-color-down: var(--spectrum-black);
132+
--spectrum-button-content-color-focus: var(--spectrum-black);
133+
114134
&.spectrum-Button--outline {
115135
--spectrum-button-border-color-default: var(--spectrum-transparent-black-300);
116136
--spectrum-button-border-color-hover: var(--spectrum-transparent-black-400);

0 commit comments

Comments
 (0)