From c2a26420fe53c0284dd9c776b43dd01e48090d4c Mon Sep 17 00:00:00 2001 From: Joanna Qu <55368679+joannaquu@users.noreply.github.com> Date: Wed, 13 Dec 2023 16:46:18 -0800 Subject: [PATCH] add subtle neutral button --- .../Demos/ButtonDemoController.swift | 2 ++ ios/FluentUI/Button/ButtonTokenSet.swift | 28 +++++++++++-------- 2 files changed, 18 insertions(+), 12 deletions(-) diff --git a/ios/FluentUI.Demo/FluentUI.Demo/Demos/ButtonDemoController.swift b/ios/FluentUI.Demo/FluentUI.Demo/Demos/ButtonDemoController.swift index 922b271c61..4f16dce40f 100644 --- a/ios/FluentUI.Demo/FluentUI.Demo/Demos/ButtonDemoController.swift +++ b/ios/FluentUI.Demo/FluentUI.Demo/Demos/ButtonDemoController.swift @@ -141,6 +141,8 @@ extension ButtonStyle { return "Outline neutral" case .subtle: return "Subtle" + case .subtleNeutral: + return "Subtle neutral" case .danger: return "Danger" case .dangerOutline: diff --git a/ios/FluentUI/Button/ButtonTokenSet.swift b/ios/FluentUI/Button/ButtonTokenSet.swift index 2071c48b0e..1cf6b5f1a1 100644 --- a/ios/FluentUI/Button/ButtonTokenSet.swift +++ b/ios/FluentUI/Button/ButtonTokenSet.swift @@ -14,6 +14,7 @@ public enum ButtonStyle: Int, CaseIterable { outlineAccent, outlineNeutral, subtle, + subtleNeutral, danger, dangerOutline, dangerSubtle, @@ -30,12 +31,15 @@ public enum ButtonStyle: Int, CaseIterable { /// A button with brand border, brand foreground, and no background. case outlineAccent - /// A button with neutral border, neutral foreground, and no brackground. + /// A button with neutral border, neutral foreground, and no background. case outlineNeutral /// A button with no border, brand foreground, and no background. case subtle + /// A button with no border, neutral foreground, and no background. + case subtleNeutral + /// A button with no border, neutral foreground, and danger background. case danger @@ -133,7 +137,7 @@ public class ButtonTokenSet: ControlTokenSet { switch style() { case .accent, .floatingAccent: return theme.color(.brandBackground1) - case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle: + case .outline, .outlineAccent, .outlineNeutral, .subtle, .subtleNeutral, .dangerOutline, .dangerSubtle: return .clear case .danger: return theme.color(.dangerBackground2) @@ -146,7 +150,7 @@ public class ButtonTokenSet: ControlTokenSet { switch style() { case .accent, .floatingAccent: return theme.color(.brandBackground1Selected) - case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle: + case .outline, .outlineAccent, .outlineNeutral, .subtle, .subtleNeutral, .dangerOutline, .dangerSubtle: return .clear case .danger: return theme.color(.dangerBackground2) @@ -159,7 +163,7 @@ public class ButtonTokenSet: ControlTokenSet { switch style() { case .accent, .danger, .floatingAccent, .floatingSubtle: return theme.color(.background5) - case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle: + case .outline, .outlineAccent, .outlineNeutral, .subtle, .subtleNeutral, .dangerOutline, .dangerSubtle: return .clear } } @@ -168,7 +172,7 @@ public class ButtonTokenSet: ControlTokenSet { switch style() { case .accent, .floatingAccent: return theme.color(.brandBackground1Pressed) - case .outline, .outlineAccent, .outlineNeutral, .subtle, .dangerOutline, .dangerSubtle: + case .outline, .outlineAccent, .outlineNeutral, .subtle, .subtleNeutral, .dangerOutline, .dangerSubtle: return .clear case .danger: return theme.color(.dangerBackground2) @@ -179,7 +183,7 @@ public class ButtonTokenSet: ControlTokenSet { case .borderColor: return .uiColor { switch style() { - case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: + case .accent, .subtle, .subtleNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: return .clear case .outline, .outlineAccent: return theme.color(.brandStroke1) @@ -192,7 +196,7 @@ public class ButtonTokenSet: ControlTokenSet { case .borderFocusedColor: return .uiColor { switch style() { - case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: + case .accent, .subtle, .subtleNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: return .clear case .outline, .outlineAccent, .outlineNeutral, .dangerOutline: return theme.color(.strokeFocus2) @@ -201,7 +205,7 @@ public class ButtonTokenSet: ControlTokenSet { case .borderDisabledColor: return .uiColor { switch style() { - case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: + case .accent, .subtle, .subtleNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: return .clear case .outline, .outlineAccent, .outlineNeutral, .dangerOutline: return theme.color(.strokeDisabled) @@ -210,7 +214,7 @@ public class ButtonTokenSet: ControlTokenSet { case .borderPressedColor: return .uiColor { switch style() { - case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: + case .accent, .subtle, .subtleNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: return .clear case .outline, .outlineAccent: return theme.color(.brandStroke1Pressed) @@ -223,7 +227,7 @@ public class ButtonTokenSet: ControlTokenSet { case .borderWidth: return .float { switch style() { - case .accent, .subtle, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: + case .accent, .subtle, .subtleNeutral, .danger, .dangerSubtle, .floatingAccent, .floatingSubtle: return GlobalTokens.stroke(.widthNone) case .outline, .outlineAccent, .outlineNeutral, .dangerOutline: return GlobalTokens.stroke(.width10) @@ -245,7 +249,7 @@ public class ButtonTokenSet: ControlTokenSet { return theme.color(.foregroundOnColor) case .outline, .outlineAccent, .subtle: return theme.color(.brandForeground1) - case .outlineNeutral: + case .outlineNeutral, .subtleNeutral: return theme.color(.foreground1) case .danger: return theme.color(.foregroundLightStatic) @@ -264,7 +268,7 @@ public class ButtonTokenSet: ControlTokenSet { return theme.color(.foregroundOnColor) case .outline, .outlineAccent, .subtle: return theme.color(.brandForeground1Pressed) - case .outlineNeutral: + case .outlineNeutral, .subtleNeutral: return theme.color(.foreground1) case .danger: return theme.color(.foregroundLightStatic)