update theming for SwiftUI

11 months ago · 0717beb117
parent d6e17f7f56
commit 0717beb117
5 changed files with 478 additions and 2 deletions
--- a/Guide/Themes/Theme+ClassicDark.swift
+++ b/Guide/Themes/Theme+ClassicDark.swift
@ -1,6 +1,7 @@
 // Copyright © 2022 Rangeproof Pty Ltd. All rights reserved.

 import UIKit.UIColor
+import SwiftUI

 internal enum Theme_ClassicDark: ThemeColors {
    static let theme: [ThemeValue: UIColor] = [
@ -120,4 +121,122 @@ internal enum Theme_ClassicDark: ThemeColors {
        // Unread Marker
        .unreadMarker: .primary
    ]
+    
+    static let themeSwiftUI: [ThemeValue: Color] = [
+        // General
+        .white: .white,
+        .black: .black,
+        .clear: .clear,
+        .primary: .primary,
+        .defaultPrimary: Theme.PrimaryColor.green.colorSwiftUI,
+        .warning: .warning,
+        .danger: .dangerDark,
+        .disabled: .disabledDark,
+        .backgroundPrimary: .classicDark0,
+        .backgroundSecondary: .classicDark1,
+        .textPrimary: .classicDark6,
+        .textSecondary: .classicDark5,
+        .borderSeparator: .classicDark3,
+        
+        // Path
+        .path_connected: .pathConnected,
+        .path_connecting: .pathConnecting,
+        .path_error: .pathError,
+        .path_unknown: .classicDark4,
+    
+        // TextBox
+        .textBox_background: .classicDark1,
+        .textBox_border: .classicDark3,
+    
+        // MessageBubble
+        .messageBubble_outgoingBackground: .primary,
+        .messageBubble_incomingBackground: .classicDark2,
+        .messageBubble_outgoingText: .classicDark0,
+        .messageBubble_incomingText: .classicDark6,
+        .messageBubble_overlay: .black_06,
+        .messageBubble_deliveryStatus: .classicDark5,
+
+        // MenuButton
+        .menuButton_background: .primary,
+        .menuButton_icon: .classicDark6,
+        .menuButton_outerShadow: .primary,
+        .menuButton_innerShadow: .classicDark6,
+        
+        // RadioButton
+        .radioButton_selectedBackground: .primary,
+        .radioButton_unselectedBackground: .clear,
+        .radioButton_selectedBorder: .classicDark6,
+        .radioButton_unselectedBorder: .classicDark6,
+        .radioButton_disabledSelectedBackground: .disabledDark,
+        .radioButton_disabledUnselectedBackground: .clear,
+        .radioButton_disabledBorder: .disabledDark,
+        
+        // SessionButton
+        .sessionButton_text: .primary,
+        .sessionButton_background: .clear,
+        .sessionButton_highlight: .classicDark6.opacity(0.3),
+        .sessionButton_border: .primary,
+        .sessionButton_filledText: .classicDark6,
+        .sessionButton_filledBackground: .classicDark1,
+        .sessionButton_filledHighlight: .classicDark3,
+        .sessionButton_destructiveText: .dangerDark,
+        .sessionButton_destructiveBackground: .clear,
+        .sessionButton_destructiveHighlight: .dangerDark.opacity(0.3),
+        .sessionButton_destructiveBorder: .dangerDark,
+        
+        // SolidButton
+        .solidButton_background: .classicDark3,
+        
+        // Settings
+        .settings_tertiaryAction: .primary,
+        .settings_tabBackground: .classicDark1,
+        
+        // Appearance
+        .appearance_sectionBackground: .classicDark1,
+        .appearance_buttonBackground: .classicDark1,
+        
+        // Alert
+        .alert_text: .classicDark6,
+        .alert_background: .classicDark1,
+        .alert_buttonBackground: .classicDark1,
+        
+        // ConversationButton
+        .conversationButton_background: .classicDark1,
+        .conversationButton_unreadBackground: .classicDark2,
+        .conversationButton_unreadStripBackground: .primary,
+        .conversationButton_unreadBubbleBackground: .classicDark3,
+        .conversationButton_unreadBubbleText: .classicDark6,
+        .conversationButton_swipeDestructive: .dangerDark,
+        .conversationButton_swipeSecondary: .classicDark2,
+        .conversationButton_swipeTertiary: Theme.PrimaryColor.orange.colorSwiftUI,
+        .conversationButton_swipeRead: .classicDark3,
+        
+        // InputButton
+        .inputButton_background: .classicDark2,
+        
+        // ContextMenu
+        .contextMenu_background: .classicDark1,
+        .contextMenu_highlight: .primary,
+        .contextMenu_text: .classicDark6,
+        .contextMenu_textHighlight: .classicDark0,
+        
+        // Call
+        .callAccept_background: Theme.PrimaryColor.green.colorSwiftUI,
+        .callDecline_background: .dangerDark,
+        
+        // Reactions
+        .reactions_contextBackground: .classicDark2,
+        .reactions_contextMoreBackground: .classicDark1,
+        
+        // NewConversation
+        .newConversation_background: .classicDark1,
+        
+        // Profile
+        .profileIcon: .primary,
+        .profileIcon_greenPrimaryColor: .black,
+        .profileIcon_background: .white,
+        
+        // Unread Marker
+        .unreadMarker: .primary
+    ]
 }
--- a/Guide/Themes/Theme+ClassicLight.swift
+++ b/Guide/Themes/Theme+ClassicLight.swift
@ -1,6 +1,7 @@
 // Copyright © 2022 Rangeproof Pty Ltd. All rights reserved.

 import UIKit.UIColor
+import SwiftUI

 internal enum Theme_ClassicLight: ThemeColors {
    static let theme: [ThemeValue: UIColor] = [
@ -120,4 +121,122 @@ internal enum Theme_ClassicLight: ThemeColors {
        // Unread Marker
        .unreadMarker: .black
    ]
+    
+    static let themeSwiftUI: [ThemeValue: Color] = [
+        // General
+        .white: .white,
+        .black: .black,
+        .clear: .clear,
+        .primary: .primary,
+        .defaultPrimary: Theme.PrimaryColor.green.colorSwiftUI,
+        .warning: .warning,
+        .danger: .dangerLight,
+        .disabled: .disabledLight,
+        .backgroundPrimary: .classicLight6,
+        .backgroundSecondary: .classicLight5,
+        .textPrimary: .classicLight0,
+        .textSecondary: .classicLight1,
+        .borderSeparator: .classicLight2,
+        
+        // Path
+        .path_connected: .pathConnected,
+        .path_connecting: .pathConnecting,
+        .path_error: .pathError,
+        .path_unknown: .classicLight4,
+    
+        // TextBox
+        .textBox_background: .classicLight6,
+        .textBox_border: .classicLight2,
+    
+        // MessageBubble
+        .messageBubble_outgoingBackground: .primary,
+        .messageBubble_incomingBackground: .classicLight4,
+        .messageBubble_outgoingText: .classicLight0,
+        .messageBubble_incomingText: .classicLight0,
+        .messageBubble_overlay: .black_06,
+        .messageBubble_deliveryStatus: .classicLight1,
+
+        // MenuButton
+        .menuButton_background: .primary,
+        .menuButton_icon: .classicLight6,
+        .menuButton_outerShadow: .classicLight0,
+        .menuButton_innerShadow: .classicLight6,
+        
+        // RadioButton
+        .radioButton_selectedBackground: .primary,
+        .radioButton_unselectedBackground: .clear,
+        .radioButton_selectedBorder: .classicLight0,
+        .radioButton_unselectedBorder: .classicLight0,
+        .radioButton_disabledSelectedBackground: .disabledLight,
+        .radioButton_disabledUnselectedBackground: .clear,
+        .radioButton_disabledBorder: .disabledLight,
+        
+        // OutlineButton
+        .sessionButton_text: .classicLight0,
+        .sessionButton_background: .clear,
+        .sessionButton_highlight: .classicLight0.opacity(0.1),
+        .sessionButton_border: .classicLight0,
+        .sessionButton_filledText: .classicLight6,
+        .sessionButton_filledBackground: .classicLight0,
+        .sessionButton_filledHighlight: .classicLight1,
+        .sessionButton_destructiveText: .dangerLight,
+        .sessionButton_destructiveBackground: .clear,
+        .sessionButton_destructiveHighlight: .dangerLight.opacity(0.3),
+        .sessionButton_destructiveBorder: .dangerLight,
+        
+        // SolidButton
+        .solidButton_background: .classicLight3,
+        
+        // Settings
+        .settings_tertiaryAction: .classicLight0,
+        .settings_tabBackground: .classicLight5,
+        
+        // AppearanceButton
+        .appearance_sectionBackground: .classicLight6,
+        .appearance_buttonBackground: .classicLight6,
+        
+        // Alert
+        .alert_text: .classicLight0,
+        .alert_background: .classicLight6,
+        .alert_buttonBackground: .classicLight6,
+        
+        // ConversationButton
+        .conversationButton_background: .classicLight6,
+        .conversationButton_unreadBackground: .classicLight6,
+        .conversationButton_unreadStripBackground: .primary,
+        .conversationButton_unreadBubbleBackground: .classicLight3,
+        .conversationButton_unreadBubbleText: .classicLight0,
+        .conversationButton_swipeDestructive: .dangerLight,
+        .conversationButton_swipeSecondary: .classicLight1,
+        .conversationButton_swipeTertiary: Theme.PrimaryColor.orange.colorSwiftUI,
+        .conversationButton_swipeRead: .classicLight3,
+        
+        // InputButton
+        .inputButton_background: .classicLight4,
+        
+        // ContextMenu
+        .contextMenu_background: .classicLight6,
+        .contextMenu_highlight: .primary,
+        .contextMenu_text: .classicLight0,
+        .contextMenu_textHighlight: .classicLight0,
+        
+        // Call
+        .callAccept_background: Theme.PrimaryColor.green.colorSwiftUI,
+        .callDecline_background: .dangerLight,
+        
+        // Reactions
+        .reactions_contextBackground: .classicLight4,
+        .reactions_contextMoreBackground: .classicLight6,
+        
+        // NewConversation
+        .newConversation_background: .classicLight6,
+        
+        // Profile
+        .profileIcon: .primary,
+        .profileIcon_greenPrimaryColor: .primary,
+        .profileIcon_background: .black,
+        
+        // Unread Marker
+        .unreadMarker: .black
+    ]
 }
--- a/Guide/Themes/Theme+Colors.swift
+++ b/Guide/Themes/Theme+Colors.swift
@ -28,7 +28,7 @@ public extension Theme {
        internal init?(color: Color?) {
            guard
                let color: Color = color,
-                let primaryColor: PrimaryColor = PrimaryColor.allCases.first(where: { $0.swiftUIColor == color })
+                let primaryColor: PrimaryColor = PrimaryColor.allCases.first(where: { $0.colorSwiftUI == color })
            else { return nil }
            
            self = primaryColor
@ -47,7 +47,7 @@ public extension Theme {
        }
        
        // FIXME: Clean it when Xcode can show the color panel in "return Color(#colorLiteral())"
-        public var swiftUIColor: Color {
+        public var colorSwiftUI: Color {
            switch self {
                case .green:
                    let color: Color = Color(#colorLiteral(red: 0.1921568627, green: 0.9450980392, blue: 0.5882352941, alpha: 1))         // #31F196
--- a/Guide/Themes/Theme+OceanDark.swift
+++ b/Guide/Themes/Theme+OceanDark.swift
@ -1,6 +1,7 @@
 // Copyright © 2022 Rangeproof Pty Ltd. All rights reserved.

 import UIKit.UIColor
+import SwiftUI

 internal enum Theme_OceanDark: ThemeColors {
    static let theme: [ThemeValue: UIColor] = [
@ -120,4 +121,122 @@ internal enum Theme_OceanDark: ThemeColors {
        // Unread Marker
        .unreadMarker: .primary
    ]
+    
+    static let themeSwiftUI: [ThemeValue: Color] = [
+        // General
+        .white: .white,
+        .black: .black,
+        .clear: .clear,
+        .primary: .primary,
+        .defaultPrimary: Theme.PrimaryColor.blue.colorSwiftUI,
+        .warning: .warning,
+        .danger: .dangerDark,
+        .disabled: .disabledDark,
+        .backgroundPrimary: .oceanDark2,
+        .backgroundSecondary: .oceanDark1,
+        .textPrimary: .oceanDark7,
+        .textSecondary: .oceanDark5,
+        .borderSeparator: .oceanDark4,
+        
+        // Path
+        .path_connected: .pathConnected,
+        .path_connecting: .pathConnecting,
+        .path_error: .pathError,
+        .path_unknown: .oceanDark4,
+    
+        // TextBox
+        .textBox_background: .oceanDark1,
+        .textBox_border: .oceanDark4,
+    
+        // MessageBubble
+        .messageBubble_outgoingBackground: .primary,
+        .messageBubble_incomingBackground: .oceanDark4,
+        .messageBubble_outgoingText: .oceanDark0,
+        .messageBubble_incomingText: .oceanDark7,
+        .messageBubble_overlay: .black_06,
+        .messageBubble_deliveryStatus: .oceanDark5,
+
+        // MenuButton
+        .menuButton_background: .primary,
+        .menuButton_icon: .oceanDark7,
+        .menuButton_outerShadow: .primary,
+        .menuButton_innerShadow: .oceanDark7,
+        
+        // RadioButton
+        .radioButton_selectedBackground: .primary,
+        .radioButton_unselectedBackground: .clear,
+        .radioButton_selectedBorder: .oceanDark7,
+        .radioButton_unselectedBorder: .oceanDark7,
+        .radioButton_disabledSelectedBackground: .disabledDark,
+        .radioButton_disabledUnselectedBackground: .clear,
+        .radioButton_disabledBorder: .disabledDark,
+        
+        // SessionButton
+        .sessionButton_text: .primary,
+        .sessionButton_background: .clear,
+        .sessionButton_highlight: .oceanDark7.opacity(0.3),
+        .sessionButton_border: .primary,
+        .sessionButton_filledText: .oceanDark7,
+        .sessionButton_filledBackground: .oceanDark1,
+        .sessionButton_filledHighlight: .oceanDark3,
+        .sessionButton_destructiveText: .dangerDark,
+        .sessionButton_destructiveBackground: .clear,
+        .sessionButton_destructiveHighlight: .dangerDark.opacity(0.3),
+        .sessionButton_destructiveBorder: .dangerDark,
+        
+        // SolidButton
+        .solidButton_background: .oceanDark2,
+        
+        // Settings
+        .settings_tertiaryAction: .primary,
+        .settings_tabBackground: .oceanDark1,
+        
+        // Appearance
+        .appearance_sectionBackground: .oceanDark3,
+        .appearance_buttonBackground: .oceanDark3,
+        
+        // Alert
+        .alert_text: .oceanDark7,
+        .alert_background: .oceanDark3,
+        .alert_buttonBackground: .oceanDark3,
+        
+        // ConversationButton
+        .conversationButton_background: .oceanDark3,
+        .conversationButton_unreadBackground: .oceanDark4,
+        .conversationButton_unreadStripBackground: .primary,
+        .conversationButton_unreadBubbleBackground: .primary,
+        .conversationButton_unreadBubbleText: .oceanDark0,
+        .conversationButton_swipeDestructive: .dangerDark,
+        .conversationButton_swipeSecondary: .oceanDark2,
+        .conversationButton_swipeTertiary: Theme.PrimaryColor.orange.colorSwiftUI,
+        .conversationButton_swipeRead: .primary,
+        
+        // InputButton
+        .inputButton_background: .oceanDark4,
+        
+        // ContextMenu
+        .contextMenu_background: .oceanDark2,
+        .contextMenu_highlight: .primary,
+        .contextMenu_text: .oceanDark7,
+        .contextMenu_textHighlight: .oceanDark0,
+        
+        // Call
+        .callAccept_background: Theme.PrimaryColor.green.colorSwiftUI,
+        .callDecline_background: .dangerDark,
+        
+        // Reactions
+        .reactions_contextBackground: .oceanDark1,
+        .reactions_contextMoreBackground: .oceanDark2,
+        
+        // NewConversation
+        .newConversation_background: .oceanDark3,
+        
+        // Profile
+        .profileIcon: .primary,
+        .profileIcon_greenPrimaryColor: .black,
+        .profileIcon_background: .white,
+        
+        // Unread Marker
+        .unreadMarker: .primary
+    ]
 }
--- a/Guide/Themes/Theme+OceanLight.swift
+++ b/Guide/Themes/Theme+OceanLight.swift
@ -1,6 +1,7 @@
 // Copyright © 2022 Rangeproof Pty Ltd. All rights reserved.

 import UIKit.UIColor
+import SwiftUI

 internal enum Theme_OceanLight: ThemeColors {
    static let theme: [ThemeValue: UIColor] = [
@ -120,4 +121,122 @@ internal enum Theme_OceanLight: ThemeColors {
        // Unread Marker
        .unreadMarker: .black
    ]
+    
+    static let themeSwiftUI: [ThemeValue: Color] = [
+        // General
+        .white: .white,
+        .black: .black,
+        .clear: .clear,
+        .primary: .primary,
+        .defaultPrimary: Theme.PrimaryColor.blue.colorSwiftUI,
+        .warning: .warning,
+        .danger: .dangerLight,
+        .disabled: .disabledLight,
+        .backgroundPrimary: .oceanLight7,
+        .backgroundSecondary: .oceanLight6,
+        .textPrimary: .oceanLight1,
+        .textSecondary: .oceanLight2,
+        .borderSeparator: .oceanLight3,
+        
+        // Path
+        .path_connected: .pathConnected,
+        .path_connecting: .pathConnecting,
+        .path_error: .pathError,
+        .path_unknown: .oceanLight5,
+    
+        // TextBox
+        .textBox_background: .oceanLight7,
+        .textBox_border: .oceanLight3,
+    
+        // MessageBubble
+        .messageBubble_outgoingBackground: .primary,
+        .messageBubble_incomingBackground: .oceanLight4,
+        .messageBubble_outgoingText: .oceanLight1,
+        .messageBubble_incomingText: .oceanLight1,
+        .messageBubble_overlay: .black_06,
+        .messageBubble_deliveryStatus: .oceanLight2,
+
+        // MenuButton
+        .menuButton_background: .primary,
+        .menuButton_icon: .white,
+        .menuButton_outerShadow: .black,
+        .menuButton_innerShadow: .white,
+        
+        // RadioButton
+        .radioButton_selectedBackground: .primary,
+        .radioButton_unselectedBackground: .clear,
+        .radioButton_selectedBorder: .oceanLight1,
+        .radioButton_unselectedBorder: .oceanLight3,
+        .radioButton_disabledSelectedBackground: .disabledLight,
+        .radioButton_disabledUnselectedBackground: .clear,
+        .radioButton_disabledBorder: .disabledLight,
+        
+        // SessionButton
+        .sessionButton_text: .oceanLight1,
+        .sessionButton_background: .clear,
+        .sessionButton_highlight: .oceanLight1.opacity(0.1),
+        .sessionButton_border: .oceanLight1,
+        .sessionButton_filledText: .oceanLight7,
+        .sessionButton_filledBackground: .oceanLight1,
+        .sessionButton_filledHighlight: .oceanLight2,
+        .sessionButton_destructiveText: .dangerLight,
+        .sessionButton_destructiveBackground: .clear,
+        .sessionButton_destructiveHighlight: .dangerLight.opacity(0.3),
+        .sessionButton_destructiveBorder: .dangerLight,
+        
+        // SolidButton
+        .solidButton_background: .oceanLight5,
+        
+        // Settings
+        .settings_tertiaryAction: .oceanLight1,
+        .settings_tabBackground: .oceanLight6,
+        
+        // Appearance
+        .appearance_sectionBackground: .oceanLight7,
+        .appearance_buttonBackground: .oceanLight7,
+        
+        // Alert
+        .alert_text: .oceanLight0,
+        .alert_background: .oceanLight7,
+        .alert_buttonBackground: .oceanLight7,
+        
+        // ConversationButton
+        .conversationButton_background: .oceanLight7,
+        .conversationButton_unreadBackground: .oceanLight6,
+        .conversationButton_unreadStripBackground: .primary,
+        .conversationButton_unreadBubbleBackground: .primary,
+        .conversationButton_unreadBubbleText: .oceanLight1,
+        .conversationButton_swipeDestructive: .dangerLight,
+        .conversationButton_swipeSecondary: .oceanLight2,
+        .conversationButton_swipeTertiary: Theme.PrimaryColor.orange.colorSwiftUI,
+        .conversationButton_swipeRead: .primary,
+        
+        // InputButton
+        .inputButton_background: .oceanLight5,
+        
+        // ContextMenu
+        .contextMenu_background: .oceanLight7,
+        .contextMenu_highlight: .primary,
+        .contextMenu_text: .oceanLight0,
+        .contextMenu_textHighlight: .oceanLight0,
+        
+        // Call
+        .callAccept_background: Theme.PrimaryColor.green.colorSwiftUI,
+        .callDecline_background: .dangerLight,
+        
+        // Reactions
+        .reactions_contextBackground: .oceanLight7,
+        .reactions_contextMoreBackground: .oceanLight6,
+        
+        // NewConversation
+        .newConversation_background: .oceanLight7,
+        
+        // Profile
+        .profileIcon: .primary,
+        .profileIcon_greenPrimaryColor: .primary,
+        .profileIcon_background: .oceanLight1,
+        
+        // Unread Marker
+        .unreadMarker: .black
+    ]
 }