Refactor FXIOS-8712 Update design tokens and related UI

mozilla-mobile · Mar 27, 2024 · 412ed91 · 412ed91
1 parent 87d63ba
commit 412ed91
Show file tree

Hide file tree

Showing 11 changed files with 13 additions and 15 deletions.
diff --git a/BrowserKit/Sources/Common/Theming/DarkTheme.swift b/BrowserKit/Sources/Common/Theming/DarkTheme.swift
@@ -57,8 +57,8 @@ private struct DarkColourPalette: ThemeColourPalette {
     // MARK: - Actions
     var actionPrimary: UIColor = FXColors.Blue30
     var actionPrimaryHover: UIColor = FXColors.Blue20
-    var actionSecondary: UIColor = FXColors.LightGrey30
-    var actionSecondaryHover: UIColor = FXColors.LightGrey20
+    var actionSecondary: UIColor = FXColors.DarkGrey05
+    var actionSecondaryHover: UIColor = FXColors.LightGrey90
     var formSurfaceOff: UIColor = FXColors.DarkGrey05
     var formKnob: UIColor = FXColors.White
     var indicatorActive: UIColor = FXColors.LightGrey90

diff --git a/BrowserKit/Sources/Common/Theming/PrivateModeTheme.swift b/BrowserKit/Sources/Common/Theming/PrivateModeTheme.swift
@@ -59,8 +59,8 @@ private struct PrivateModeColorPalette: ThemeColourPalette {
     // MARK: - Actions
     var actionPrimary: UIColor = FXColors.Blue30
     var actionPrimaryHover: UIColor = FXColors.Blue20
-    var actionSecondary: UIColor = FXColors.LightGrey30
-    var actionSecondaryHover: UIColor = FXColors.LightGrey20
+    var actionSecondary: UIColor = FXColors.DarkGrey05
+    var actionSecondaryHover: UIColor = FXColors.LightGrey90
     var formSurfaceOff: UIColor = FXColors.DarkGrey05
     var formKnob: UIColor = FXColors.White
     var indicatorActive: UIColor = FXColors.LightGrey90

diff --git a/BrowserKit/Sources/ComponentLibrary/Buttons/SecondaryRoundedButton.swift b/BrowserKit/Sources/ComponentLibrary/Buttons/SecondaryRoundedButton.swift
@@ -88,7 +88,7 @@ public class SecondaryRoundedButton: ResizableButton, ThemeApplicable {
     public func applyTheme(theme: Theme) {
         highlightedBackgroundColor = theme.colors.actionSecondaryHover
         normalBackgroundColor = theme.colors.actionSecondary
-        foregroundColor = theme.colors.textOnLight
+        foregroundColor = theme.colors.textPrimary
 
         setNeedsUpdateConfiguration()
     }

diff --git a/firefox-ios/Client/Frontend/Autofill/LoginCellView.swift b/firefox-ios/Client/Frontend/Autofill/LoginCellView.swift
@@ -24,7 +24,6 @@ struct LoginCellView: View {
     @State private var textColor: Color = .clear
     @State private var customLightGray: Color = .clear
     @State private var iconPrimary: Color = .clear
-    @State private var stroke: Color = .clear
 
     private(set) var login: EncryptedLogin
     @Environment(\.themeType)
@@ -72,7 +71,6 @@ struct LoginCellView: View {
         textColor = Color(color.textPrimary)
         customLightGray = Color(color.textSecondary)
         iconPrimary = Color(color.iconPrimary)
-        stroke = Color(color.actionSecondary)
     }
 }
 
@@ -91,7 +89,7 @@ struct LoginButtonStyle: ButtonStyle {
                     style: .continuous
                 )
                 .stroke(style: StrokeStyle())
-                .foregroundColor(Color(theme.colors.actionSecondary))
+                .foregroundColor(.clear)
             )
             .clipShape(RoundedRectangle(cornerRadius: 12, style: .continuous))
     }

diff --git a/firefox-ios/Client/Frontend/Browser/FindInPageBar.swift b/firefox-ios/Client/Frontend/Browser/FindInPageBar.swift
@@ -187,7 +187,7 @@ class FindInPageBar: UIView, ThemeApplicable {
         let colors = theme.colors
         topBorder.backgroundColor = colors.borderPrimary
         searchText.textColor = theme.type == .light ? colors.textPrimary : colors.textInverted
-        matchCountView.textColor = colors.actionSecondary
+        matchCountView.textColor = colors.textSecondary
         previousButton.setTitleColor(colors.iconPrimary, for: .normal)
         nextButton.setTitleColor(colors.iconPrimary, for: .normal)
         closeButton.setTitleColor(colors.iconPrimary, for: .normal)

diff --git a/...fox-ios/Client/Frontend/Onboarding/ViewControllers/FirstInstall/IntroViewController.swift b/...fox-ios/Client/Frontend/Onboarding/ViewControllers/FirstInstall/IntroViewController.swift
@@ -186,7 +186,7 @@ class IntroViewController: UIViewController,
         view.backgroundColor = theme.colors.layer2
 
         pageControl.currentPageIndicatorTintColor = theme.colors.actionPrimary
-        pageControl.pageIndicatorTintColor = theme.colors.actionSecondary
+        pageControl.pageIndicatorTintColor = theme.colors.formSurfaceOff
 
         viewModel.availableCards.forEach { $0.applyTheme() }
     }

diff --git a/firefox-ios/Client/Frontend/Onboarding/ViewControllers/Update/UpdateViewController.swift b/firefox-ios/Client/Frontend/Onboarding/ViewControllers/Update/UpdateViewController.swift
@@ -163,7 +163,7 @@ class UpdateViewController: UIViewController,
               !viewModel.shouldShowSingleCard
         else { return }
         pageControl.currentPageIndicatorTintColor = theme.colors.actionPrimary
-        pageControl.pageIndicatorTintColor = theme.colors.actionSecondary
+        pageControl.pageIndicatorTintColor = theme.colors.formSurfaceOff
     }
 }
 

diff --git a/firefox-ios/Client/Frontend/Settings/Main/SettingDisclosureUtility.swift b/firefox-ios/Client/Frontend/Settings/Main/SettingDisclosureUtility.swift
@@ -12,7 +12,7 @@ struct SettingDisclosureUtility {
         disclosureIndicator.image = UIImage(
             named: StandardImageIdentifiers.Large.chevronRight
         )?.withRenderingMode(.alwaysTemplate).imageFlippedForRightToLeftLayoutDirection()
-        disclosureIndicator.tintColor = theme.colors.actionSecondary
+        disclosureIndicator.tintColor = theme.colors.iconSecondary
         disclosureIndicator.sizeToFit()
         return disclosureIndicator
     }

diff --git a/firefox-ios/Client/Frontend/Toolbar+URLBar/LockButton.swift b/firefox-ios/Client/Frontend/Toolbar+URLBar/LockButton.swift
@@ -51,7 +51,7 @@ class LockButton: UIButton {
 extension LockButton: ThemeApplicable {
     func applyTheme(theme: Theme) {
         selectedTintColor = theme.colors.actionPrimary
-        disabledTintColor = theme.colors.actionSecondary
+        disabledTintColor = theme.colors.iconDisabled
         unselectedTintColor = theme.colors.textPrimary
         tintColor = isEnabled ? unselectedTintColor : disabledTintColor
     }

diff --git a/firefox-ios/Client/Frontend/Widgets/OneLineTableViewCell.swift b/firefox-ios/Client/Frontend/Widgets/OneLineTableViewCell.swift
@@ -165,7 +165,7 @@ class OneLineTableViewCell: UITableViewCell,
         backgroundColor = theme.colors.layer5
         titleLabel.textColor = theme.colors.textPrimary
         bottomSeparatorView.backgroundColor = theme.colors.borderPrimary
-        accessoryView?.tintColor = theme.colors.actionSecondary
+        accessoryView?.tintColor = theme.colors.iconSecondary
         leftImageView.tintColor = theme.colors.textPrimary
     }
 }
diff --git a/firefox-ios/Client/Frontend/Widgets/TwoLineImageOverlayCell.swift b/firefox-ios/Client/Frontend/Widgets/TwoLineImageOverlayCell.swift
@@ -146,7 +146,7 @@ class TwoLineImageOverlayCell: UITableViewCell,
         titleLabel.textColor = theme.colors.textPrimary
         descriptionLabel.textColor = theme.colors.textSecondary
         leftImageView.layer.borderColor = theme.colors.borderPrimary.cgColor
-        accessoryView?.tintColor = theme.colors.actionSecondary
+        accessoryView?.tintColor = theme.colors.iconSecondary
         topSeparatorView.backgroundColor = theme.colors.borderPrimary
         bottomSeparatorView.backgroundColor = theme.colors.borderPrimary
     }