Skip to content

Commit 3053e63

Browse files
joannaquujoannaquu
authored
Add transparent neutral button (#1944)
* add subtle neutral button * rename to transparentNeutral
1 parent 22f70c5 commit 3053e63

2 files changed

Lines changed: 18 additions & 12 deletions

File tree

‎ios/FluentUI.Demo/FluentUI.Demo/Demos/ButtonDemoController.swift‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -141,6 +141,8 @@ extension ButtonStyle {
141141
return "Outline neutral"
142142
case .subtle:
143143
return "Subtle"
144+
case .transparentNeutral:
145+
return "Transparent neutral"
144146
case .danger:
145147
return "Danger"
146148
case .dangerOutline:

‎ios/FluentUI/Button/ButtonTokenSet.swift‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ public enum ButtonStyle: Int, CaseIterable {
1414
outlineAccent,
1515
outlineNeutral,
1616
subtle,
17+
transparentNeutral,
1718
danger,
1819
dangerOutline,
1920
dangerSubtle,
@@ -30,12 +31,15 @@ public enum ButtonStyle: Int, CaseIterable {
3031
/// A button with brand border, brand foreground, and no background.
3132
case outlineAccent
3233

33-
/// A button with neutral border, neutral foreground, and no brackground.
34+
/// A button with neutral border, neutral foreground, and no background.
3435
case outlineNeutral
3536

3637
/// A button with no border, brand foreground, and no background.
3738
case subtle
3839

40+
/// A button with no border, neutral foreground, and no background.
41+
case transparentNeutral
42+
3943
/// A button with no border, neutral foreground, and danger background.
4044
case danger
4145

@@ -133,7 +137,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
133137
switch style() {
134138
case .accent, .floatingAccent:
135139
return theme.color(.brandBackground1)
136-
case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle:
140+
case .outline, .outlineAccent, .outlineNeutral, .subtle, .transparentNeutral, .dangerOutline, .dangerSubtle:
137141
return .clear
138142
case .danger:
139143
return theme.color(.dangerBackground2)
@@ -146,7 +150,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
146150
switch style() {
147151
case .accent, .floatingAccent:
148152
return theme.color(.brandBackground1Selected)
149-
case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle:
153+
case .outline, .outlineAccent, .outlineNeutral, .subtle, .transparentNeutral, .dangerOutline, .dangerSubtle:
150154
return .clear
151155
case .danger:
152156
return theme.color(.dangerBackground2)
@@ -159,7 +163,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
159163
switch style() {
160164
case .accent, .danger, .floatingAccent, .floatingSubtle:
161165
return theme.color(.background5)
162-
case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle:
166+
case .outline, .outlineAccent, .outlineNeutral, .subtle, .transparentNeutral, .dangerOutline, .dangerSubtle:
163167
return .clear
164168
}
165169
}
@@ -168,7 +172,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
168172
switch style() {
169173
case .accent, .floatingAccent:
170174
return theme.color(.brandBackground1Pressed)
171-
case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle:
175+
case .outline, .outlineAccent, .outlineNeutral, .subtle, .transparentNeutral, .dangerOutline, .dangerSubtle:
172176
return .clear
173177
case .danger:
174178
return theme.color(.dangerBackground2)
@@ -179,7 +183,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
179183
case .borderColor:
180184
return .uiColor {
181185
switch style() {
182-
case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
186+
case .accent, .subtle, .transparentNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
183187
return .clear
184188
case .outline, .outlineAccent:
185189
return theme.color(.brandStroke1)
@@ -192,7 +196,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
192196
case .borderFocusedColor:
193197
return .uiColor {
194198
switch style() {
195-
case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
199+
case .accent, .subtle, .transparentNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
196200
return .clear
197201
case .outline, .outlineAccent, .outlineNeutral, .dangerOutline:
198202
return theme.color(.strokeFocus2)
@@ -201,7 +205,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
201205
case .borderDisabledColor:
202206
return .uiColor {
203207
switch style() {
204-
case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
208+
case .accent, .subtle, .transparentNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
205209
return .clear
206210
case .outline, .outlineAccent, .outlineNeutral, .dangerOutline:
207211
return theme.color(.strokeDisabled)
@@ -210,7 +214,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
210214
case .borderPressedColor:
211215
return .uiColor {
212216
switch style() {
213-
case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
217+
case .accent, .subtle, .transparentNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
214218
return .clear
215219
case .outline, .outlineAccent:
216220
return theme.color(.brandStroke1Pressed)
@@ -223,7 +227,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
223227
case .borderWidth:
224228
return .float {
225229
switch style() {
226-
case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
230+
case .accent, .subtle, .transparentNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle:
227231
return GlobalTokens.stroke(.widthNone)
228232
case .outline, .outlineAccent, .outlineNeutral, .dangerOutline:
229233
return GlobalTokens.stroke(.width10)
@@ -245,7 +249,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
245249
return theme.color(.foregroundOnColor)
246250
case .outline, .outlineAccent, .subtle:
247251
return theme.color(.brandForeground1)
248-
case .outlineNeutral:
252+
case .outlineNeutral, .transparentNeutral:
249253
return theme.color(.foreground1)
250254
case .danger:
251255
return theme.color(.foregroundLightStatic)
@@ -264,7 +268,7 @@ public class ButtonTokenSet: ControlTokenSet<ButtonToken> {
264268
return theme.color(.foregroundOnColor)
265269
case .outline, .outlineAccent, .subtle:
266270
return theme.color(.brandForeground1Pressed)
267-
case .outlineNeutral:
271+
case .outlineNeutral, .transparentNeutral:
268272
return theme.color(.foreground1)
269273
case .danger:
270274
return theme.color(.foregroundLightStatic)

0 commit comments

Comments
 (0)