Apply Global colors to all views

Global colors were not applied to all views and this PR fixes this issue MOB-2679
salemove · Oct 5, 2023 · b252521 · b252521
1 parent fc0e43e
commit b252521
Show file tree

Hide file tree

Showing 13 changed files with 50 additions and 63 deletions.
diff --git a/GliaWidgets/Color.swift b/GliaWidgets/Color.swift
@@ -8,7 +8,5 @@ enum Color {
     static let baseNormal = UIColor(hex: 0x6C7683) // grey
     static let baseShade = UIColor(hex: 0x6C7683, alpha: 0.5)
     static let baseDark = UIColor(hex: 0x2C0735) // purple
-    static let lightGrey = UIColor(hex: 0xF3F3F3) // light gray
-    static let grey = UIColor(hex: 0x999999) // gray
-    static let background: UIColor = .white
+    static let baseNeutral = UIColor(hex: 0xF3F3F3) // light gray
 }
diff --git a/GliaWidgets/SecureConversations/Welcome/Theme+SecureConversationsWelcome.swift b/GliaWidgets/SecureConversations/Welcome/Theme+SecureConversationsWelcome.swift
@@ -54,7 +54,7 @@ extension Theme {
             borderColor: color.baseNormal,
             borderWidth: 1,
             cornerRadius: 4,
-            backgroundColor: color.background,
+            backgroundColor: color.baseLight,
             accessibility: .init(isFontScalingEnabled: true)
         )
 
@@ -68,7 +68,7 @@ extension Theme {
             borderColor: color.primary,
             borderWidth: 1,
             cornerRadius: 4,
-            backgroundColor: color.background,
+            backgroundColor: color.baseLight,
             accessibility: .init(isFontScalingEnabled: true)
         )
 
@@ -178,7 +178,7 @@ extension Theme {
                 errorIcon: Asset.uploadError.image,
                 errorIconColor: color.systemNegative,
                 backgroundColor: color.primary,
-                errorBackgroundColor: Color.lightGrey,
+                errorBackgroundColor: color.baseNeutral,
                 accessibility: .init(isFontScalingEnabled: true)
             )
             let uploading = FileUploadStateStyle(
@@ -214,7 +214,7 @@ extension Theme {
                 error: error,
                 progressColor: color.primary,
                 errorProgressColor: color.systemNegative,
-                progressBackgroundColor: Color.lightGrey,
+                progressBackgroundColor: color.baseNeutral,
                 removeButtonImage: Asset.mcRemoveUpload.image,
                 removeButtonColor: color.baseNormal,
                 backgroundColor: .commonGray,
@@ -267,7 +267,7 @@ extension Theme {
            return AttachmentSourceListStyle(
                items: [pickPhoto, takePhoto, browse],
                separatorColor: color.baseShade,
-               backgroundColor: Color.lightGrey
+               backgroundColor: color.baseNeutral
            )
        }
 
@@ -285,7 +285,7 @@ extension Theme {
             filePickerButtonStyle: filePickerButtonStyle,
             attachmentListStyle: uploadListStyle,
             pickMediaStyle: pickMediaStyle,
-            backgroundColor: color.background
+            backgroundColor: color.baseLight
         )
     }
 }

diff --git a/GliaWidgets/Sources/RemoteConfiguration/RemoteConfiguration.swift b/GliaWidgets/Sources/RemoteConfiguration/RemoteConfiguration.swift
@@ -20,8 +20,8 @@ extension RemoteConfiguration {
         let baseLight: String?
         let baseDark: String?
         let baseShade: String?
-        let background: String?
         let systemNegative: String?
+        let baseNeutral: String?
     }
 }
 

diff --git a/GliaWidgets/Sources/Theme/Survey/Theme+Survey.swift b/GliaWidgets/Sources/Theme/Survey/Theme+Survey.swift
@@ -56,7 +56,7 @@ extension Theme.SurveyStyle {
 
         return .init(
             layer: .init(
-                background: .fill(color: color.background),
+                background: .fill(color: color.baseLight),
                 borderColor: color.baseDark.cgColor,
                 cornerRadius: 30
             ),

diff --git a/GliaWidgets/Sources/Theme/Survey/Theme.Survey.InputQuestion.swift b/GliaWidgets/Sources/Theme/Survey/Theme.Survey.InputQuestion.swift
@@ -33,7 +33,7 @@ public extension Theme.SurveyStyle {
                         accessibility: .init(isFontScalingEnabled: true)
                     ),
                     normalLayer: .init(
-                        background: .fill(color: Color.baseLight),
+                        background: .fill(color: color.baseLight),
                         borderColor: color.baseNormal.cgColor,
                         borderWidth: 1,
                         cornerRadius: 4

diff --git a/GliaWidgets/Sources/Theme/Theme+Alert.swift b/GliaWidgets/Sources/Theme/Theme+Alert.swift
@@ -31,7 +31,7 @@ extension Theme {
             titleImageColor: color.primary,
             messageFont: font.bodyText,
             messageColor: color.baseDark,
-            backgroundColor: .fill(color: color.background),
+            backgroundColor: .fill(color: color.baseLight),
             closeButtonColor: .fill(color: color.baseNormal),
             actionAxis: .horizontal,
             positiveAction: positiveAction,

diff --git a/GliaWidgets/Sources/Theme/Theme+AlertConfiguration.swift b/GliaWidgets/Sources/Theme/Theme+AlertConfiguration.swift
@@ -41,7 +41,7 @@ extension Theme {
             infoFont: font.subtitle,
             infoColor: color.baseDark,
             borderColor: color.primary,
-            backgroundColor: color.background,
+            backgroundColor: color.baseLight,
             icon: Asset.upgradeAudio.image,
             iconColor: color.primary
         )
@@ -53,7 +53,7 @@ extension Theme {
             infoFont: font.subtitle,
             infoColor: color.baseDark,
             borderColor: color.primary,
-            backgroundColor: color.background,
+            backgroundColor: color.baseLight,
             icon: Asset.upgradePhone.image,
             iconColor: color.primary
         )

diff --git a/GliaWidgets/Sources/Theme/Theme+Chat.swift b/GliaWidgets/Sources/Theme/Theme+Chat.swift
@@ -180,7 +180,7 @@ extension Theme {
             accessibility: .init(isFontScalingEnabled: true)
         )
         let operatorImageFile = ChatImageFileContentStyle(
-            backgroundColor: Color.lightGrey,
+            backgroundColor: color.baseNeutral,
             accessibility: .init(
                 contentAccessibilityLabel: Localization.Chat.Attachment.Message.Accessibility.label,
                 youAccessibilityPlaceholder: Localization.General.you,
@@ -196,7 +196,7 @@ extension Theme {
         let operatorMessage = OperatorMessageStyle(
             text: operatorText,
             background: .init(
-                background: .fill(color: Color.lightGrey),
+                background: .fill(color: color.baseNeutral),
                 borderColor: .clear,
                 borderWidth: .zero,
                 cornerRadius: 8.49
@@ -219,7 +219,7 @@ extension Theme {
             )
         )
         let choiceCardOptionNormalState = Button(
-            background: .fill(color: Color.lightGrey),
+            background: .fill(color: color.baseNeutral),
             title: .init(
                 color: color.baseDark.hex,
                 font: font.bodyText,
@@ -233,7 +233,7 @@ extension Theme {
             )
         )
         let choiceCardOptionSelectedState = Button(
-            background: .fill(color: Color.primary),
+            background: .fill(color: color.primary),
             title: .init(
                 color: color.baseLight.hex,
                 font: font.bodyText,
@@ -247,16 +247,16 @@ extension Theme {
             )
         )
         let choiceCardOptionDisabledState = Button(
-            background: .fill(color: Color.lightGrey),
+            background: .fill(color: color.baseNeutral),
             title: .init(
-                color: Color.grey.hex,
+                color: color.baseShade.hex,
                 font: font.bodyText,
                 textStyle: .body,
                 accessibility: .init(isFontScalingEnabled: true)
             ),
             cornerRadius: 4,
             borderWidth: 1,
-            borderColor: Color.baseShade.toRGBAHex(),
+            borderColor: color.baseShade.toRGBAHex(),
             accessibility: .init(
                 label: Localization.Chat.ChoiceCard.Button.Disabled.Accessibility.label,
                 isFontScalingEnabled: true
@@ -305,7 +305,7 @@ extension Theme {
             placeholderFont: font.bodyText,
             placeholderColor: color.baseNormal,
             separatorColor: color.baseShade,
-            backgroundColor: color.background,
+            backgroundColor: color.baseLight,
             mediaButton: mediaButton,
             sendButton: sendButton,
             uploadList: uploadListStyle,
@@ -372,14 +372,14 @@ extension Theme {
             title: Localization.Chat.unreadMessageDivider,
             titleColor: Color.baseNormal,
             titleFont: font.buttonLabel,
-            lineColor: Color.primary,
+            lineColor: color.primary,
             accessibility: .init(isFontScalingEnabled: true)
         )
 
         let systemMessage = SystemMessageStyle(
             text: operatorText,
             background: Theme.Layer(
-                background: .fill(color: Color.lightGrey),
+                background: .fill(color: color.baseNeutral),
                 borderColor: .clear,
                 borderWidth: .zero,
                 cornerRadius: 8.49
@@ -391,7 +391,7 @@ extension Theme {
         return ChatStyle(
             header: header,
             connect: connect,
-            backgroundColor: .fill(color: color.background),
+            backgroundColor: .fill(color: color.baseLight),
             preferredStatusBarStyle: .lightContent,
             title: Localization.Engagement.Chat.title,
             visitorMessageStyle: visitorMessage,
@@ -424,7 +424,7 @@ extension Theme {
             errorIcon: Asset.uploadError.image,
             errorIconColor: color.systemNegative,
             backgroundColor: color.primary,
-            errorBackgroundColor: Color.lightGrey,
+            errorBackgroundColor: color.baseNeutral,
             accessibility: .init(isFontScalingEnabled: true)
         )
         let uploading = FileUploadStateStyle(
@@ -460,7 +460,7 @@ extension Theme {
             error: error,
             progressColor: color.primary,
             errorProgressColor: color.systemNegative,
-            progressBackgroundColor: Color.lightGrey,
+            progressBackgroundColor: color.baseNeutral,
             removeButtonImage: Asset.uploadRemove.image,
             removeButtonColor: color.baseNormal,
             accessibility: .init(
@@ -481,7 +481,7 @@ extension Theme {
             errorIcon: Asset.uploadError.image,
             errorIconColor: color.systemNegative,
             backgroundColor: color.primary,
-            errorBackgroundColor: Color.lightGrey,
+            errorBackgroundColor: color.baseNeutral,
             accessibility: .init(isFontScalingEnabled: true)
         )
         let download = ChatFileDownloadStateStyle(
@@ -527,9 +527,9 @@ extension Theme {
             error: error,
             progressColor: color.primary,
             errorProgressColor: color.systemNegative,
-            progressBackgroundColor: Color.lightGrey,
+            progressBackgroundColor: color.baseNeutral,
             backgroundColor: .white,
-            borderColor: Color.lightGrey,
+            borderColor: color.baseNeutral,
             accessibility: .init(
                 contentAccessibilityLabel: Localization.Chat.Attachment.Message.Accessibility.label,
                 youAccessibilityPlaceholder: Localization.General.you,
@@ -580,7 +580,7 @@ extension Theme {
         return AttachmentSourceListStyle(
             items: [pickPhoto, takePhoto, browse],
             separatorColor: color.baseShade,
-            backgroundColor: Color.lightGrey
+            backgroundColor: color.baseNeutral
         )
     }
 }
diff --git a/GliaWidgets/Sources/Theme/Theme+Gva.swift b/GliaWidgets/Sources/Theme/Theme+Gva.swift
@@ -20,14 +20,14 @@ extension Theme {
                 ),
                 accessibility: .init(isFontScalingEnabled: true)
             ),
-            backgroundColor: .fill(color: color.lightGrey),
+            backgroundColor: .fill(color: color.baseNeutral),
             cornerRadius: 10,
             borderWidth: 0,
             borderColor: .clear,
             button: .init(
                 textFont: font.caption,
-                textColor: .black,
-                backgroundColor: .fill(color: color.background),
+                textColor: color.baseDark,
+                backgroundColor: .fill(color: color.baseLight),
                 cornerRadius: 5,
                 borderColor: .clear,
                 borderWidth: 0,
@@ -37,16 +37,16 @@ extension Theme {
 
         let quickReplyButton: GvaQuickReplyButtonStyle = .init(
             textFont: font.buttonLabel,
-            textColor: Color.primary,
-            backgroundColor: .fill(color: Color.baseLight),
+            textColor: color.primary,
+            backgroundColor: .fill(color: color.baseLight),
             cornerRadius: 10,
-            borderColor: Color.primary,
+            borderColor: color.primary,
             borderWidth: 1
         )
 
         let galleryCard: GvaGalleryCardStyle = .init(
             cardContainer: .init(
-                backgroundColor: .fill(color: color.lightGrey),
+                backgroundColor: .fill(color: color.baseNeutral),
                 cornerRadius: 8,
                 borderColor: .clear,
                 borderWidth: 0
@@ -59,22 +59,22 @@ extension Theme {
             ),
             title: .init(
                 font: font.mediumSubtitle1,
-                textColor: .black,
+                textColor: color.baseDark,
                 textStyle: .body
             ),
             subtitle: .init(
                 font: font.caption,
-                textColor: .black,
+                textColor: color.baseDark,
                 textStyle: .caption1
             ),
             button: .init(
                 title: .init(
                     font: font.caption,
-                    textColor: .black,
+                    textColor: color.baseDark,
                     textStyle: .caption1
                 ),
                 background: .init(
-                    backgroundColor: .fill(color: color.background),
+                    backgroundColor: .fill(color: color.baseLight),
                     cornerRadius: 8,
                     borderColor: .clear,
                     borderWidth: 0

diff --git a/GliaWidgets/Sources/Theme/Theme+VisitorCode.swift b/GliaWidgets/Sources/Theme/Theme+VisitorCode.swift
@@ -3,8 +3,8 @@ import UIKit
 extension Theme {
     var visitorCodeStyle: VisitorCodeStyle {
         let numberSlot = NumberSlotStyle(
-            backgroundColor: .fill(color: color.background),
-            borderColor: UIColor.ultraLightGray,
+            backgroundColor: .fill(color: color.baseLight),
+            borderColor: color.baseNeutral,
             borderWidth: 1,
             cornerRadius: 8,
             numberFont: font.header1,
@@ -31,15 +31,11 @@ extension Theme {
             poweredBy: poweredBy,
             numberSlot: numberSlot,
             actionButton: actionButton,
-            backgroundColor: .fill(color: color.background),
+            backgroundColor: .fill(color: color.baseLight),
             cornerRadius: 30,
             closeButtonColor: .fill(color: color.baseNormal),
             loadingProgressColor: color.primary,
             accessibility: .init(isFontScalingEnabled: true)
         )
     }
 }
-
-private extension UIColor {
-    static let ultraLightGray = UIColor(red: 0.953, green: 0.953, blue: 0.953, alpha: 1)
-}
diff --git a/GliaWidgets/Sources/Theme/Theme.swift b/GliaWidgets/Sources/Theme/Theme.swift
@@ -91,8 +91,8 @@ public class Theme {
                     baseLight: config.globalColors?.baseLight.map { UIColor(hex: $0) },
                     baseDark: config.globalColors?.baseDark.map { UIColor(hex: $0) },
                     baseShade: config.globalColors?.baseShade.map { UIColor(hex: $0) },
-                    background: config.globalColors?.background.map { UIColor(hex: $0) },
-                    systemNegative: config.globalColors?.systemNegative.map { UIColor(hex: $0) }
+                    systemNegative: config.globalColors?.systemNegative.map { UIColor(hex: $0) },
+                    baseNeutral: config.globalColors?.baseNeutral.map { UIColor(hex: $0) }
                 )
             )
         )