diff --git a/DesignKit/Common.xcconfig b/DesignKit/Common.xcconfig new file mode 100644 index 000000000..eb4b88c16 --- /dev/null +++ b/DesignKit/Common.xcconfig @@ -0,0 +1,28 @@ +// +// Copyright 2021 Vector Creations Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +// Configuration settings file format documentation can be found at: +// https://help.apple.com/xcode/#/dev745c5c974 + +#include "Config/AppIdentifiers.xcconfig" +#include "Config/AppVersion.xcconfig" + +PRODUCT_NAME = DesignKit +PRODUCT_BUNDLE_IDENTIFIER = $(BASE_BUNDLE_IDENTIFIER).designkit + +INFOPLIST_FILE = DesignKit/Info.plist + +SKIP_INSTALL = YES diff --git a/DesignKit/Debug.xcconfig b/DesignKit/Debug.xcconfig new file mode 100644 index 000000000..11a7288a4 --- /dev/null +++ b/DesignKit/Debug.xcconfig @@ -0,0 +1,20 @@ +// +// Copyright 2021 Vector Creations Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +// Configuration settings file format documentation can be found at: +// https://help.apple.com/xcode/#/dev745c5c974 + +#include "Common.xcconfig" diff --git a/DesignKit/DesignKit.h b/DesignKit/DesignKit.h new file mode 100644 index 000000000..4ff68e722 --- /dev/null +++ b/DesignKit/DesignKit.h @@ -0,0 +1,27 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +#import + +//! Project version number for DesignKit. +FOUNDATION_EXPORT double DesignKitVersionNumber; + +//! Project version string for DesignKit. +FOUNDATION_EXPORT const unsigned char DesignKitVersionString[]; + +// In this header, you should import all the public headers of your framework using statements like #import + + diff --git a/DesignKit/Extensions/UIFont.swift b/DesignKit/Extensions/UIFont.swift new file mode 100644 index 000000000..7804c8066 --- /dev/null +++ b/DesignKit/Extensions/UIFont.swift @@ -0,0 +1,55 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import UIKit + +public extension UIFont { + + // MARK: - Convenient methods + + /// Update current font with a SymbolicTraits + func vc_withTraits(_ traits: UIFontDescriptor.SymbolicTraits) -> UIFont { + guard let descriptor = fontDescriptor.withSymbolicTraits(traits) else { + return self + } + return UIFont(descriptor: descriptor, size: 0) // Size 0 means keep the size as it is + } + + /// Update current font with a given Weight + func vc_withWeight(weight: Weight) -> UIFont { + // Add the font weight to the descriptor + let weightedFontDescriptor = fontDescriptor.addingAttributes([ + UIFontDescriptor.AttributeName.traits: [ + UIFontDescriptor.TraitKey.weight: weight + ] + ]) + return UIFont(descriptor: weightedFontDescriptor, size: 0) + } + + // MARK: - Shortcuts + + var vc_bold: UIFont { + return self.vc_withTraits(.traitBold) + } + + var vc_semiBold: UIFont { + return self.vc_withWeight(weight: .semibold) + } + + var vc_italic: UIFont { + return self.vc_withTraits(.traitItalic) + } +} diff --git a/DesignKit/Info.plist b/DesignKit/Info.plist new file mode 100644 index 000000000..c0701c6d7 --- /dev/null +++ b/DesignKit/Info.plist @@ -0,0 +1,22 @@ + + + + + CFBundleDevelopmentRegion + $(DEVELOPMENT_LANGUAGE) + CFBundleExecutable + $(EXECUTABLE_NAME) + CFBundleIdentifier + $(PRODUCT_BUNDLE_IDENTIFIER) + CFBundleInfoDictionaryVersion + 6.0 + CFBundleName + $(PRODUCT_NAME) + CFBundlePackageType + $(PRODUCT_BUNDLE_PACKAGE_TYPE) + CFBundleShortVersionString + $(MARKETING_VERSION) + CFBundleVersion + $(CURRENT_PROJECT_VERSION) + + diff --git a/DesignKit/Release.xcconfig b/DesignKit/Release.xcconfig new file mode 100644 index 000000000..11a7288a4 --- /dev/null +++ b/DesignKit/Release.xcconfig @@ -0,0 +1,20 @@ +// +// Copyright 2021 Vector Creations Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +// Configuration settings file format documentation can be found at: +// https://help.apple.com/xcode/#/dev745c5c974 + +#include "Common.xcconfig" diff --git a/RiotSwiftUI/Modules/Common/Avatar/Model/AvatarSize.swift b/DesignKit/Source/AvatarSize.swift similarity index 95% rename from RiotSwiftUI/Modules/Common/Avatar/Model/AvatarSize.swift rename to DesignKit/Source/AvatarSize.swift index 09daff1d2..bac46e6f3 100644 --- a/RiotSwiftUI/Modules/Common/Avatar/Model/AvatarSize.swift +++ b/DesignKit/Source/AvatarSize.swift @@ -17,8 +17,6 @@ import Foundation import UIKit -// TODO: Move into element-design-tokens repo. - // Figma Avatar Sizes: https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=1258%3A19678 public enum AvatarSize: Int { case xxSmall = 16 diff --git a/DesignKit/Source/ColorValues.swift b/DesignKit/Source/ColorValues.swift new file mode 100644 index 000000000..338d1cfe8 --- /dev/null +++ b/DesignKit/Source/ColorValues.swift @@ -0,0 +1,52 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import UIKit + +/** + Struct for holding colour values for a particular theme. + */ +public struct ColorValues: Colors { + + public let accent: UIColor + + public let alert: UIColor + + public let primaryContent: UIColor + + public let secondaryContent: UIColor + + public let tertiaryContent: UIColor + + public let quarterlyContent: UIColor + + public let quinaryContent: UIColor + + public let separator: UIColor + + public let system: UIColor + + public let tile: UIColor + + public let navigation: UIColor + + public let background: UIColor + + public let ems: UIColor + + public let namesAndAvatars: [UIColor] +} diff --git a/DesignKit/Source/Colors.swift b/DesignKit/Source/Colors.swift new file mode 100644 index 000000000..bf3e9abd3 --- /dev/null +++ b/DesignKit/Source/Colors.swift @@ -0,0 +1,73 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation + +/// Colors at https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=1255%3A1104 +public protocol Colors { + + associatedtype ColorType + + /// - Focused/Active states + /// - CTAs + var accent: ColorType { get } + + /// - Error messages + /// - Content requiring user attention + /// - Notification, alerts + var alert: ColorType { get } + + /// - Text + /// - Icons + var primaryContent: ColorType { get } + + /// - Text + /// - Icons + var secondaryContent: ColorType { get } + + /// - Text + /// - Icons + var tertiaryContent: ColorType { get } + + /// - Text + /// - Icons + var quarterlyContent: ColorType { get } + + /// - separating lines and other UI components + var quinaryContent: ColorType { get } + + /// - System-based areas and backgrounds + var system: ColorType { get } + + /// Separating line + var separator: ColorType { get } + + /// Cards, tiles + var tile: ColorType { get } + + /// Top navigation background on iOS + var navigation: ColorType { get } + + /// Background UI color + var background: ColorType { get } + + /// Global color: The EMS brand's purple colour. + var ems: ColorType { get } + + /// - Names in chat timeline + /// - Avatars default states that include first name letter + var namesAndAvatars: [ColorType] { get } +} diff --git a/DesignKit/Source/ColorsSwiftUI.swift b/DesignKit/Source/ColorsSwiftUI.swift new file mode 100644 index 000000000..ea3ca6779 --- /dev/null +++ b/DesignKit/Source/ColorsSwiftUI.swift @@ -0,0 +1,69 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import SwiftUI + +/** + Struct for holding colors for use in SwiftUI. + */ +public struct ColorSwiftUI: Colors { + + public let accent: Color + + public let alert: Color + + public let primaryContent: Color + + public let secondaryContent: Color + + public let tertiaryContent: Color + + public let quarterlyContent: Color + + public let quinaryContent: Color + + public let separator: Color + + public var system: Color + + public let tile: Color + + public let navigation: Color + + public let background: Color + + public var ems: Color + + public let namesAndAvatars: [Color] + + init(values: ColorValues) { + accent = Color(values.accent) + alert = Color(values.alert) + primaryContent = Color(values.primaryContent) + secondaryContent = Color(values.secondaryContent) + tertiaryContent = Color(values.tertiaryContent) + quarterlyContent = Color(values.quarterlyContent) + quinaryContent = Color(values.quinaryContent) + separator = Color(values.separator) + system = Color(values.system) + tile = Color(values.tile) + navigation = Color(values.navigation) + background = Color(values.background) + ems = Color(values.ems) + namesAndAvatars = values.namesAndAvatars.map({ Color($0) }) + } +} diff --git a/DesignKit/Source/ColorsUIkit.swift b/DesignKit/Source/ColorsUIkit.swift new file mode 100644 index 000000000..3add385c3 --- /dev/null +++ b/DesignKit/Source/ColorsUIkit.swift @@ -0,0 +1,67 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import UIKit + +/** + ObjC class for holding colors for use in UIKit. + */ +@objcMembers public class ColorsUIKit: NSObject { + + public let accent: UIColor + + public let alert: UIColor + + public let primaryContent: UIColor + + public let secondaryContent: UIColor + + public let tertiaryContent: UIColor + + public let quarterlyContent: UIColor + + public let quinaryContent: UIColor + + public let separator: UIColor + + public let system: UIColor + + public let tile: UIColor + + public let navigation: UIColor + + public let background: UIColor + + public let namesAndAvatars: [UIColor] + + init(values: ColorValues) { + accent = values.accent + alert = values.alert + primaryContent = values.primaryContent + secondaryContent = values.secondaryContent + tertiaryContent = values.tertiaryContent + quarterlyContent = values.quarterlyContent + quinaryContent = values.quinaryContent + separator = values.separator + system = values.system + tile = values.tile + navigation = values.navigation + background = values.background + namesAndAvatars = values.namesAndAvatars + } +} + diff --git a/DesignKit/Source/Fonts.swift b/DesignKit/Source/Fonts.swift new file mode 100644 index 000000000..1203a2888 --- /dev/null +++ b/DesignKit/Source/Fonts.swift @@ -0,0 +1,85 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import UIKit + +/// Describe fonts used in the application. +/// Font names are based on Element typograhy https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=1362%3A0 which is based on Apple font text styles (UIFont.TextStyle): https://developer.apple.com/documentation/uikit/uifonttextstyle +/// Create a custom TextStyle enum (like DesignKit.Fonts.TextStyle) is also a possiblity +public protocol Fonts { + + associatedtype FontType + + /// The font for large titles. + var largeTitle: FontType { get } + + /// `largeTitle` with a Bold weight. + var largeTitleB: FontType { get } + + /// The font for first-level hierarchical headings. + var title1: FontType { get } + + /// `title1` with a Bold weight. + var title1B: FontType { get } + + /// The font for second-level hierarchical headings. + var title2: FontType { get } + + /// `title2` with a Bold weight. + var title2B: FontType { get } + + /// The font for third-level hierarchical headings. + var title3: FontType { get } + + /// `title3` with a Semi Bold weight. + var title3SB: FontType { get } + + /// The font for headings. + var headline: FontType { get } + + /// The font for subheadings. + var subheadline: FontType { get } + + /// The font for body text. + var body: FontType { get } + + /// `body` with a Semi Bold weight. + var bodySB: FontType { get } + + /// The font for callouts. + var callout: FontType { get } + + /// `callout` with a Semi Bold weight. + var calloutSB: FontType { get } + + /// The font for footnotes. + var footnote: FontType { get } + + /// `footnote` with a Semi Bold weight. + var footnoteSB: FontType { get } + + /// The font for standard captions. + var caption1: FontType { get } + + /// `caption1` with a Semi Bold weight. + var caption1SB: FontType { get } + + /// The font for alternate captions. + var caption2: FontType { get } + + /// `caption2` with a Semi Bold weight. + var caption2SB: FontType { get } +} diff --git a/DesignKit/Source/FontsSwiftUI.swift b/DesignKit/Source/FontsSwiftUI.swift new file mode 100644 index 000000000..83b4e820b --- /dev/null +++ b/DesignKit/Source/FontsSwiftUI.swift @@ -0,0 +1,91 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import SwiftUI + +/** + Struct for holding fonts for use in SwiftUI. + */ +public struct FontSwiftUI: Fonts { + + public let uiFonts: FontsUIKit + + public var largeTitle: Font + + public var largeTitleB: Font + + public var title1: Font + + public var title1B: Font + + public var title2: Font + + public var title2B: Font + + public var title3: Font + + public var title3SB: Font + + public var headline: Font + + public var subheadline: Font + + public var body: Font + + public var bodySB: Font + + public var callout: Font + + public var calloutSB: Font + + public var footnote: Font + + public var footnoteSB: Font + + public var caption1: Font + + public var caption1SB: Font + + public var caption2: Font + + public var caption2SB: Font + + public init(values: ElementFonts) { + self.uiFonts = FontsUIKit(values: values) + + self.largeTitle = values.largeTitle.font + self.largeTitleB = values.largeTitleB.font + self.title1 = values.title1.font + self.title1B = values.title1B.font + self.title2 = values.title2.font + self.title2B = values.title2B.font + self.title3 = values.title3.font + self.title3SB = values.title3SB.font + self.headline = values.headline.font + self.subheadline = values.subheadline.font + self.body = values.body.font + self.bodySB = values.bodySB.font + self.callout = values.callout.font + self.calloutSB = values.calloutSB.font + self.footnote = values.footnote.font + self.footnoteSB = values.footnoteSB.font + self.caption1 = values.caption1.font + self.caption1SB = values.caption1SB.font + self.caption2 = values.caption2.font + self.caption2SB = values.caption2SB.font + } +} diff --git a/DesignKit/Source/FontsUIkit.swift b/DesignKit/Source/FontsUIkit.swift new file mode 100644 index 000000000..ec65cdaa6 --- /dev/null +++ b/DesignKit/Source/FontsUIkit.swift @@ -0,0 +1,87 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import UIKit + +/** + ObjC class for holding fonts for use in UIKit. + */ +@objcMembers public class FontsUIKit: NSObject, Fonts { + + public var largeTitle: UIFont + + public var largeTitleB: UIFont + + public var title1: UIFont + + public var title1B: UIFont + + public var title2: UIFont + + public var title2B: UIFont + + public var title3: UIFont + + public var title3SB: UIFont + + public var headline: UIFont + + public var subheadline: UIFont + + public var body: UIFont + + public var bodySB: UIFont + + public var callout: UIFont + + public var calloutSB: UIFont + + public var footnote: UIFont + + public var footnoteSB: UIFont + + public var caption1: UIFont + + public var caption1SB: UIFont + + public var caption2: UIFont + + public var caption2SB: UIFont + + public init(values: ElementFonts) { + self.largeTitle = values.largeTitle.uiFont + self.largeTitleB = values.largeTitleB.uiFont + self.title1 = values.title1.uiFont + self.title1B = values.title1B.uiFont + self.title2 = values.title2.uiFont + self.title2B = values.title2B.uiFont + self.title3 = values.title3.uiFont + self.title3SB = values.title3SB.uiFont + self.headline = values.headline.uiFont + self.subheadline = values.subheadline.uiFont + self.body = values.body.uiFont + self.bodySB = values.bodySB.uiFont + self.callout = values.callout.uiFont + self.calloutSB = values.calloutSB.uiFont + self.footnote = values.footnote.uiFont + self.footnoteSB = values.footnoteSB.uiFont + self.caption1 = values.caption1.uiFont + self.caption1SB = values.caption1SB.uiFont + self.caption2 = values.caption2.uiFont + self.caption2SB = values.caption2SB.uiFont + } +} diff --git a/Riot/Managers/Theme/ThemeV2.swift b/DesignKit/Source/ThemeV2.swift similarity index 70% rename from Riot/Managers/Theme/ThemeV2.swift rename to DesignKit/Source/ThemeV2.swift index 56a97a93a..dedc4d6df 100644 --- a/Riot/Managers/Theme/ThemeV2.swift +++ b/DesignKit/Source/ThemeV2.swift @@ -14,18 +14,29 @@ // limitations under the License. // +import Foundation import UIKit -import DesignKit -import DesignTokens /// Theme v2. May be named again as `Theme` when the migration completed. @objc public protocol ThemeV2 { /// Colors object - var colors: ElementUIColorsResolved { get } + var colors: ColorsUIKit { get } /// Fonts object - var fonts: ElementUIFonts { get } + var fonts: FontsUIKit { get } + + /// may contain more design components in future, like icons, audio files etc. +} + +/// Theme v2 for SwiftUI. +public protocol ThemeSwiftUIType { + + /// Colors object + var colors: ColorSwiftUI { get } + + /// Fonts object + var fonts: FontSwiftUI { get } /// may contain more design components in future, like icons, audio files etc. } diff --git a/DesignKit/Variants/Colors/Dark/DarkColors.swift b/DesignKit/Variants/Colors/Dark/DarkColors.swift new file mode 100644 index 000000000..88bd12ff3 --- /dev/null +++ b/DesignKit/Variants/Colors/Dark/DarkColors.swift @@ -0,0 +1,51 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import UIKit +import SwiftUI + +/// Dark theme colors. +public class DarkColors { + private static let values = ColorValues( + accent: UIColor(rgb:0x0DBD8B), + alert: UIColor(rgb:0xFF4B55), + primaryContent: UIColor(rgb:0xFFFFFF), + secondaryContent: UIColor(rgb:0xA9B2BC), + tertiaryContent: UIColor(rgb:0x8E99A4), + quarterlyContent: UIColor(rgb:0x6F7882), + quinaryContent: UIColor(rgb:0x394049), + separator: UIColor(rgb:0x21262C), + system: UIColor(rgb:0x21262C), + tile: UIColor(rgb:0x394049), + navigation: UIColor(rgb:0x21262C), + background: UIColor(rgb:0x15191E), + ems: UIColor(rgb: 0x7E69FF), + namesAndAvatars: [ + UIColor(rgb:0x368BD6), + UIColor(rgb:0xAC3BA8), + UIColor(rgb:0x03B381), + UIColor(rgb:0xE64F7A), + UIColor(rgb:0xFF812D), + UIColor(rgb:0x2DC2C5), + UIColor(rgb:0x5C56F5), + UIColor(rgb:0x74D12C) + ] + ) + + public static var uiKit = ColorsUIKit(values: values) + public static var swiftUI = ColorSwiftUI(values: values) +} diff --git a/DesignKit/Variants/Colors/Light/LightColors.swift b/DesignKit/Variants/Colors/Light/LightColors.swift new file mode 100644 index 000000000..93cb3eadb --- /dev/null +++ b/DesignKit/Variants/Colors/Light/LightColors.swift @@ -0,0 +1,57 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import Foundation +import UIKit +import SwiftUI + + +/// Light theme colors. +public class LightColors { + private static let values = ColorValues( + accent: UIColor(rgb:0x0DBD8B), + alert: UIColor(rgb:0xFF4B55), + primaryContent: UIColor(rgb:0x17191C), + secondaryContent: UIColor(rgb:0x737D8C), + tertiaryContent: UIColor(rgb:0x8D97A5), + quarterlyContent: UIColor(rgb:0xC1C6CD), + quinaryContent: UIColor(rgb:0xE3E8F0), + separator: UIColor(rgb:0xE3E8F0), + system: UIColor(rgb:0xF4F6FA), + tile: UIColor(rgb:0xF3F8FD), + navigation: UIColor(rgb:0xF4F6FA), + background: UIColor(rgb:0xFFFFFF), + ems: UIColor(rgb: 0x7E69FF), + namesAndAvatars: [ + UIColor(rgb:0x368BD6), + UIColor(rgb:0xAC3BA8), + UIColor(rgb:0x03B381), + UIColor(rgb:0xE64F7A), + UIColor(rgb:0xFF812D), + UIColor(rgb:0x2DC2C5), + UIColor(rgb:0x5C56F5), + UIColor(rgb:0x74D12C) + ] + ) + + public static var uiKit = ColorsUIKit(values: values) + public static var swiftUI = ColorSwiftUI(values: values) +} + + + + + diff --git a/DesignKit/Variants/Fonts/ElementFonts.swift b/DesignKit/Variants/Fonts/ElementFonts.swift new file mode 100644 index 000000000..e0a612f85 --- /dev/null +++ b/DesignKit/Variants/Fonts/ElementFonts.swift @@ -0,0 +1,150 @@ +// +// Copyright 2021 New Vector Ltd +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +import SwiftUI + +/// Fonts at https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=1362%3A0 +@objcMembers +public class ElementFonts { + + // MARK: - Types + + /// A wrapper to provide both a `UIFont` and a SwiftUI `Font` in the same type. + /// The need for this comes from `Font` not adapting for dynamic type until the app + /// is restarted (or working at all in Xcode Previews) when initialised from a `UIFont` + /// (even if that font was created with the appropriate metrics). + public struct SharedFont { + public let uiFont: UIFont + public let font: Font + } + + // MARK: - Setup + + public init() { + } + + // MARK: - Private + + /// Returns an instance of the font associated with the text style and scaled appropriately for the content size category defined in the trait collection. + /// Keep this method private method at the moment and create a DesignKit.Fonts.TextStyle if needed. + fileprivate func font(forTextStyle textStyle: UIFont.TextStyle, compatibleWith traitCollection: UITraitCollection? = nil) -> UIFont { + return UIFont.preferredFont(forTextStyle: textStyle, compatibleWith: traitCollection) + } +} + +// MARK: - Fonts protocol +extension ElementFonts: Fonts { + + public var largeTitle: SharedFont { + let uiFont = self.font(forTextStyle: .largeTitle) + return SharedFont(uiFont: uiFont, font: .largeTitle) + } + + public var largeTitleB: SharedFont { + let uiFont = self.largeTitle.uiFont.vc_bold + return SharedFont(uiFont: uiFont, font: .largeTitle.bold()) + } + + public var title1: SharedFont { + let uiFont = self.font(forTextStyle: .title1) + return SharedFont(uiFont: uiFont, font: .title) + } + + public var title1B: SharedFont { + let uiFont = self.title1.uiFont.vc_bold + return SharedFont(uiFont: uiFont, font: .title.bold()) + } + + public var title2: SharedFont { + let uiFont = self.font(forTextStyle: .title2) + return SharedFont(uiFont: uiFont, font: .title2) + } + + public var title2B: SharedFont { + let uiFont = self.title2.uiFont.vc_bold + return SharedFont(uiFont: uiFont, font: .title2.bold()) + } + + public var title3: SharedFont { + let uiFont = self.font(forTextStyle: .title3) + return SharedFont(uiFont: uiFont, font: .title3) + } + + public var title3SB: SharedFont { + let uiFont = self.title3.uiFont.vc_semiBold + return SharedFont(uiFont: uiFont, font: .title3.weight(.semibold)) + } + + public var headline: SharedFont { + let uiFont = self.font(forTextStyle: .headline) + return SharedFont(uiFont: uiFont, font: .headline) + } + + public var subheadline: SharedFont { + let uiFont = self.font(forTextStyle: .subheadline) + return SharedFont(uiFont: uiFont, font: .subheadline) + } + + public var body: SharedFont { + let uiFont = self.font(forTextStyle: .body) + return SharedFont(uiFont: uiFont, font: .body) + } + + public var bodySB: SharedFont { + let uiFont = self.body.uiFont.vc_semiBold + return SharedFont(uiFont: uiFont, font: .body.weight(.semibold)) + } + + public var callout: SharedFont { + let uiFont = self.font(forTextStyle: .callout) + return SharedFont(uiFont: uiFont, font: .callout) + } + + public var calloutSB: SharedFont { + let uiFont = self.callout.uiFont.vc_semiBold + return SharedFont(uiFont: uiFont, font: .callout.weight(.semibold)) + } + + public var footnote: SharedFont { + let uiFont = self.font(forTextStyle: .footnote) + return SharedFont(uiFont: uiFont, font: .footnote) + } + + public var footnoteSB: SharedFont { + let uiFont = self.footnote.uiFont.vc_semiBold + return SharedFont(uiFont: uiFont, font: .footnote.weight(.semibold)) + } + + public var caption1: SharedFont { + let uiFont = self.font(forTextStyle: .caption1) + return SharedFont(uiFont: uiFont, font: .caption) + } + + public var caption1SB: SharedFont { + let uiFont = self.caption1.uiFont.vc_semiBold + return SharedFont(uiFont: uiFont, font: .caption.weight(.semibold)) + } + + public var caption2: SharedFont { + let uiFont = self.font(forTextStyle: .caption2) + return SharedFont(uiFont: uiFont, font: .caption2) + } + + public var caption2SB: SharedFont { + let uiFont = self.caption2.uiFont.vc_semiBold + return SharedFont(uiFont: uiFont, font: .caption2.weight(.semibold)) + } +} diff --git a/DesignKit/target.yml b/DesignKit/target.yml new file mode 100644 index 000000000..e10f76f12 --- /dev/null +++ b/DesignKit/target.yml @@ -0,0 +1,33 @@ +name: DesignKit + +schemes: + DesignKit: + analyze: + config: Debug + archive: + config: Release + build: + targets: + DesignKit: + - running + - profiling + - analyzing + - archiving + profile: + config: Release + run: + config: Debug + disableMainThreadChecker: true + +targets: + DesignKit: + type: framework + platform: iOS + + configFiles: + Debug: Debug.xcconfig + Release: Release.xcconfig + + sources: + - path: . + - path: ../Riot/Categories/UIColor.swift diff --git a/Riot.xcworkspace/xcshareddata/swiftpm/Package.resolved b/Riot.xcworkspace/xcshareddata/swiftpm/Package.resolved index 899701b2f..a4ed2f4c0 100644 --- a/Riot.xcworkspace/xcshareddata/swiftpm/Package.resolved +++ b/Riot.xcworkspace/xcshareddata/swiftpm/Package.resolved @@ -1,23 +1,5 @@ { "pins" : [ - { - "identity" : "element-design-tokens", - "kind" : "remoteSourceControl", - "location" : "https://github.com/vector-im/element-design-tokens.git", - "state" : { - "revision" : "02ba42d9ec02f90370a6cfc35a68d7312696636c", - "version" : "0.0.2" - } - }, - { - "identity" : "element-x-ios", - "kind" : "remoteSourceControl", - "location" : "https://github.com/vector-im/element-x-ios", - "state" : { - "revision" : "0a199ee61126feb8c8a462200cb4749d6eb3ba77", - "version" : "1.0.1-202207011447" - } - }, { "identity" : "maplibre-gl-native-distribution", "kind" : "remoteSourceControl", @@ -62,15 +44,6 @@ "branch" : "main", "revision" : "0ffad3f7b45a6a4760db090d503b00f094bbecc0" } - }, - { - "identity" : "swiftui-introspect", - "kind" : "remoteSourceControl", - "location" : "https://github.com/siteline/SwiftUI-Introspect.git", - "state" : { - "revision" : "f2616860a41f9d9932da412a8978fec79c06fe24", - "version" : "0.1.4" - } } ], "version" : 2 diff --git a/Riot/Managers/Theme/ElementUIColorsResolved.swift b/Riot/Managers/Theme/ElementUIColorsResolved.swift deleted file mode 100644 index 20118bfd3..000000000 --- a/Riot/Managers/Theme/ElementUIColorsResolved.swift +++ /dev/null @@ -1,82 +0,0 @@ -// -// Copyright 2022 New Vector Ltd -// -// Licensed under the Apache License, Version 2.0 (the "License"); -// you may not use this file except in compliance with the License. -// You may obtain a copy of the License at -// -// http://www.apache.org/licenses/LICENSE-2.0 -// -// Unless required by applicable law or agreed to in writing, software -// distributed under the License is distributed on an "AS IS" BASIS, -// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -// See the License for the specific language governing permissions and -// limitations under the License. -// - -import UIKit -import DesignTokens - -extension UIColor { - /// The colors from DesignKit, resolved for light mode only. - static let elementLight = ElementUIColorsResolved(dynamicColors: element, userInterfaceStyle: .light) - /// The colors from DesignKit, resolved for dark mode only. - static let elementDark = ElementUIColorsResolved(dynamicColors: element, userInterfaceStyle: .dark) -} - -/// The dynamic colors from DesignKit, resolved to light or dark mode for use in the UIKit themes. -/// -/// As Element doesn't (currently) update the app's `UIUserInterfaceStyle` when selecting -/// a custom theme, the dynamic colors provided by DesignKit need resolving for each theme to -/// prevent them from respecting the interface style and rendering in the wrong style. -@objcMembers public class ElementUIColorsResolved: NSObject { - // MARK: Compound - public let accent: UIColor - public let alert: UIColor - public let primaryContent: UIColor - public let secondaryContent: UIColor - public let tertiaryContent: UIColor - public let quaternaryContent: UIColor - public let quinaryContent: UIColor - public let system: UIColor - public let background: UIColor - - public let namesAndAvatars: [UIColor] - - // MARK: Legacy - public let quarterlyContent: UIColor - public let navigation: UIColor - public let tile: UIColor - public let separator: UIColor - - // MARK: Setup - public init(dynamicColors: ElementUIColors, userInterfaceStyle: UIUserInterfaceStyle) { - let traitCollection = UITraitCollection(userInterfaceStyle: userInterfaceStyle) - - self.accent = dynamicColors.accent.resolvedColor(with: traitCollection) - self.alert = dynamicColors.alert.resolvedColor(with: traitCollection) - self.primaryContent = dynamicColors.primaryContent.resolvedColor(with: traitCollection) - self.secondaryContent = dynamicColors.secondaryContent.resolvedColor(with: traitCollection) - self.tertiaryContent = dynamicColors.tertiaryContent.resolvedColor(with: traitCollection) - self.quaternaryContent = dynamicColors.quaternaryContent.resolvedColor(with: traitCollection) - self.quinaryContent = dynamicColors.quinaryContent.resolvedColor(with: traitCollection) - self.system = dynamicColors.system.resolvedColor(with: traitCollection) - self.background = dynamicColors.background.resolvedColor(with: traitCollection) - - self.namesAndAvatars = dynamicColors.contentAndAvatars - - // Legacy colours - self.quarterlyContent = dynamicColors.quaternaryContent.resolvedColor(with: traitCollection) - self.navigation = dynamicColors.system.resolvedColor(with: traitCollection) - - if userInterfaceStyle == .light { - self.tile = UIColor(rgb: 0xF3F8FD) - self.separator = dynamicColors.quinaryContent.resolvedColor(with: traitCollection) - } else { - self.tile = dynamicColors.quinaryContent.resolvedColor(with: traitCollection) - self.separator = dynamicColors.system.resolvedColor(with: traitCollection) - } - - super.init() - } -} diff --git a/Riot/Managers/Theme/Themes/DarkTheme.swift b/Riot/Managers/Theme/Themes/DarkTheme.swift index eaf4c4184..35651e6b1 100644 --- a/Riot/Managers/Theme/Themes/DarkTheme.swift +++ b/Riot/Managers/Theme/Themes/DarkTheme.swift @@ -185,9 +185,9 @@ class DarkTheme: NSObject, Theme { button.setTitleColor(self.tintColor, for: .normal) } - // MARK: - Theme v2 - var colors = UIColor.elementDark + /// MARK: - Theme v2 + var colors: ColorsUIKit = DarkColors.uiKit - var fonts = UIFont.element + var fonts: FontsUIKit = FontsUIKit(values: ElementFonts()) } diff --git a/Riot/Managers/Theme/Themes/DefaultTheme.swift b/Riot/Managers/Theme/Themes/DefaultTheme.swift index f2d9231ec..412390a47 100644 --- a/Riot/Managers/Theme/Themes/DefaultTheme.swift +++ b/Riot/Managers/Theme/Themes/DefaultTheme.swift @@ -14,6 +14,7 @@ limitations under the License. */ +import Foundation import UIKit import DesignKit @@ -193,8 +194,8 @@ class DefaultTheme: NSObject, Theme { button.setTitleColor(self.tintColor, for: .normal) } - // MARK: - Theme v2 - var colors = UIColor.elementLight + /// MARK: - Theme v2 + var colors: ColorsUIKit = LightColors.uiKit - var fonts = UIFont.element + var fonts: FontsUIKit = FontsUIKit(values: ElementFonts()) } diff --git a/Riot/target.yml b/Riot/target.yml index d8ee465a3..f2a1bb16b 100644 --- a/Riot/target.yml +++ b/Riot/target.yml @@ -34,8 +34,8 @@ targets: - target: RiotShareExtension - target: SiriIntents - target: RiotNSE + - target: DesignKit - target: CommonKit - - package: DesignKit - package: Mapbox - package: OrderedCollections - package: SwiftOGG diff --git a/RiotShareExtension/target.yml b/RiotShareExtension/target.yml index c50705aa0..bf2a032f5 100644 --- a/RiotShareExtension/target.yml +++ b/RiotShareExtension/target.yml @@ -30,8 +30,6 @@ targets: RiotShareExtension: platform: iOS type: app-extension - dependencies: - - package: DesignKit configFiles: Debug: Debug.xcconfig diff --git a/RiotSwiftUI/Modules/Common/Avatar/View/AvatarImage.swift b/RiotSwiftUI/Modules/Common/Avatar/View/AvatarImage.swift index 55904b5d1..2b7fa9e60 100644 --- a/RiotSwiftUI/Modules/Common/Avatar/View/AvatarImage.swift +++ b/RiotSwiftUI/Modules/Common/Avatar/View/AvatarImage.swift @@ -49,7 +49,7 @@ struct AvatarImage: View { mxContentUri: mxContentUri, matrixItemId: matrixItemId, displayName: displayName, - colorCount: theme.colors.contentAndAvatars.count, + colorCount: theme.colors.namesAndAvatars.count, avatarSize: size ) } diff --git a/RiotSwiftUI/Modules/Common/Avatar/View/PlaceholderAvatarImage.swift b/RiotSwiftUI/Modules/Common/Avatar/View/PlaceholderAvatarImage.swift index 7dbc2ba4f..f119a7e14 100644 --- a/RiotSwiftUI/Modules/Common/Avatar/View/PlaceholderAvatarImage.swift +++ b/RiotSwiftUI/Modules/Common/Avatar/View/PlaceholderAvatarImage.swift @@ -36,7 +36,7 @@ struct PlaceholderAvatarImage: View { var body: some View { ZStack { - theme.colors.contentAndAvatars[colorIndex] + theme.colors.namesAndAvatars[colorIndex] Text(String(firstCharacter)) .padding(4) diff --git a/RiotSwiftUI/Modules/Common/Avatar/View/SpaceAvatarImage.swift b/RiotSwiftUI/Modules/Common/Avatar/View/SpaceAvatarImage.swift index 31e734c58..d82e2107f 100644 --- a/RiotSwiftUI/Modules/Common/Avatar/View/SpaceAvatarImage.swift +++ b/RiotSwiftUI/Modules/Common/Avatar/View/SpaceAvatarImage.swift @@ -38,7 +38,7 @@ struct SpaceAvatarImage: View { .padding(10) .frame(width: CGFloat(size.rawValue), height: CGFloat(size.rawValue)) .foregroundColor(.white) - .background(theme.colors.contentAndAvatars[colorIndex]) + .background(theme.colors.namesAndAvatars[colorIndex]) .clipShape(RoundedRectangle(cornerRadius: 8)) // Make the text resizable (i.e. Make it large and then allow it to scale down) .font(.system(size: 200)) @@ -55,7 +55,7 @@ struct SpaceAvatarImage: View { mxContentUri: mxContentUri, matrixItemId: matrixItemId, displayName: value, - colorCount: theme.colors.contentAndAvatars.count, + colorCount: theme.colors.namesAndAvatars.count, avatarSize: size ) }) @@ -65,7 +65,7 @@ struct SpaceAvatarImage: View { mxContentUri: mxContentUri, matrixItemId: matrixItemId, displayName: displayName, - colorCount: theme.colors.contentAndAvatars.count, + colorCount: theme.colors.namesAndAvatars.count, avatarSize: size ) } diff --git a/RiotSwiftUI/Modules/Common/EffectsScene/EffectsScene.swift b/RiotSwiftUI/Modules/Common/EffectsScene/EffectsScene.swift index daf298461..38eb5db11 100644 --- a/RiotSwiftUI/Modules/Common/EffectsScene/EffectsScene.swift +++ b/RiotSwiftUI/Modules/Common/EffectsScene/EffectsScene.swift @@ -31,7 +31,7 @@ class EffectsScene: SCNScene { static func confetti(with theme: ThemeSwiftUI) -> EffectsScene? { guard let scene = EffectsScene(named: Constants.confettiSceneName) else { return nil } - let colors: [[Float]] = theme.colors.contentAndAvatars.compactMap { $0.floatComponents } + let colors: [[Float]] = theme.colors.namesAndAvatars.compactMap { $0.floatComponents } if let particles = scene.rootNode.childNode(withName: Constants.particlesNodeName, recursively: false)?.particleSystems?.first { // The particles need a non-zero color variation for the handler to affect the color diff --git a/RiotSwiftUI/Modules/Common/Theme/ThemeSwiftUI.swift b/RiotSwiftUI/Modules/Common/Theme/ThemeSwiftUI.swift index 7e8fe5308..f5a15424f 100644 --- a/RiotSwiftUI/Modules/Common/Theme/ThemeSwiftUI.swift +++ b/RiotSwiftUI/Modules/Common/Theme/ThemeSwiftUI.swift @@ -14,33 +14,10 @@ // limitations under the License. // -import SwiftUI +import Foundation import DesignKit -import DesignTokens protocol ThemeSwiftUI: ThemeSwiftUIType { var identifier: ThemeIdentifier { get } var isDark: Bool { get } } - -/// Theme v2 for SwiftUI. -@available(iOS 14.0, *) -public protocol ThemeSwiftUIType { - - /// Colors object - var colors: ElementColors { get } - - /// Fonts object - var fonts: ElementFonts { get } - - /// may contain more design components in future, like icons, audio files etc. -} - -// MARK: - Legacy Colors - -public extension ElementColors { - var legacyTile: Color { - let dynamicColor = UIColor { $0.userInterfaceStyle == .light ? .elementLight.tile : .elementDark.tile } - return Color(dynamicColor) - } -} diff --git a/RiotSwiftUI/Modules/Common/Theme/ThemeUsersColorsExtension.swift b/RiotSwiftUI/Modules/Common/Theme/ThemeUsersColorsExtension.swift index 6c3e3c2e2..ad1eeb222 100644 --- a/RiotSwiftUI/Modules/Common/Theme/ThemeUsersColorsExtension.swift +++ b/RiotSwiftUI/Modules/Common/Theme/ThemeUsersColorsExtension.swift @@ -23,7 +23,7 @@ extension ThemeSwiftUI { /// - Parameter userId: The user id used to hash. /// - Returns: The SwiftUI color for the associated userId. func userColor(for userId: String) -> Color { - let senderNameColorIndex = Int(userId.vc_hashCode % Int32(colors.contentAndAvatars.count)) - return colors.contentAndAvatars[senderNameColorIndex] + let senderNameColorIndex = Int(userId.vc_hashCode % Int32(colors.namesAndAvatars.count)) + return colors.namesAndAvatars[senderNameColorIndex] } } diff --git a/RiotSwiftUI/Modules/Common/Theme/Themes/DarkThemeSwiftUI.swift b/RiotSwiftUI/Modules/Common/Theme/Themes/DarkThemeSwiftUI.swift index a572a4694..0e9250070 100644 --- a/RiotSwiftUI/Modules/Common/Theme/Themes/DarkThemeSwiftUI.swift +++ b/RiotSwiftUI/Modules/Common/Theme/Themes/DarkThemeSwiftUI.swift @@ -14,12 +14,12 @@ // limitations under the License. // -import SwiftUI +import Foundation import DesignKit struct DarkThemeSwiftUI: ThemeSwiftUI { var identifier: ThemeIdentifier = .dark let isDark: Bool = true - var colors = Color.element - var fonts = Font.element + var colors: ColorSwiftUI = DarkColors.swiftUI + var fonts: FontSwiftUI = FontSwiftUI(values: ElementFonts()) } diff --git a/RiotSwiftUI/Modules/Common/Theme/Themes/DefaultThemeSwiftUI.swift b/RiotSwiftUI/Modules/Common/Theme/Themes/DefaultThemeSwiftUI.swift index bfc2e87c0..85ba4d810 100644 --- a/RiotSwiftUI/Modules/Common/Theme/Themes/DefaultThemeSwiftUI.swift +++ b/RiotSwiftUI/Modules/Common/Theme/Themes/DefaultThemeSwiftUI.swift @@ -14,12 +14,12 @@ // limitations under the License. // -import SwiftUI +import Foundation import DesignKit struct DefaultThemeSwiftUI: ThemeSwiftUI { var identifier: ThemeIdentifier = .light let isDark: Bool = false - var colors = Color.element - var fonts = Font.element + var colors: ColorSwiftUI = LightColors.swiftUI + var fonts: FontSwiftUI = FontSwiftUI(values: ElementFonts()) } diff --git a/RiotSwiftUI/Modules/Common/Util/BorderedInputFieldStyle.swift b/RiotSwiftUI/Modules/Common/Util/BorderedInputFieldStyle.swift index 2615efa47..fe75aa300 100644 --- a/RiotSwiftUI/Modules/Common/Util/BorderedInputFieldStyle.swift +++ b/RiotSwiftUI/Modules/Common/Util/BorderedInputFieldStyle.swift @@ -50,7 +50,7 @@ struct BorderedInputFieldStyle: TextFieldStyle { if (theme.identifier == ThemeIdentifier.dark) { return (isEnabled ? theme.colors.primaryContent : theme.colors.tertiaryContent) } else { - return (isEnabled ? theme.colors.primaryContent : theme.colors.quaternaryContent) + return (isEnabled ? theme.colors.primaryContent : theme.colors.quarterlyContent) } } diff --git a/RiotSwiftUI/Modules/Common/Util/ClearViewModifier.swift b/RiotSwiftUI/Modules/Common/Util/ClearViewModifier.swift index 6ab0832ac..7eb67d39c 100644 --- a/RiotSwiftUI/Modules/Common/Util/ClearViewModifier.swift +++ b/RiotSwiftUI/Modules/Common/Util/ClearViewModifier.swift @@ -47,7 +47,7 @@ struct ClearViewModifier: ViewModifier { }) { Image(systemName: "xmark.circle.fill") .renderingMode(.template) - .foregroundColor(theme.colors.quaternaryContent) + .foregroundColor(theme.colors.quarterlyContent) } .padding(.top, alignment == .top ? 8 : 0) .padding(.bottom, alignment == .bottom ? 8 : 0) diff --git a/RiotSwiftUI/Modules/Common/Util/MultilineTextField.swift b/RiotSwiftUI/Modules/Common/Util/MultilineTextField.swift index a03c4b21b..5e20f11b0 100644 --- a/RiotSwiftUI/Modules/Common/Util/MultilineTextField.swift +++ b/RiotSwiftUI/Modules/Common/Util/MultilineTextField.swift @@ -56,7 +56,7 @@ struct MultilineTextField: View { return theme.colors.accent } - return theme.colors.quaternaryContent + return theme.colors.quarterlyContent } private var borderWidth: CGFloat { @@ -75,7 +75,7 @@ struct MultilineTextField: View { .overlay(rect.stroke(borderColor, lineWidth: borderWidth)) .introspectTextView { textView in textView.textColor = UIColor(textColor) - textView.font = .element.callout + textView.font = theme.fonts.uiFonts.callout } } diff --git a/RiotSwiftUI/Modules/Common/Util/OptionButton.swift b/RiotSwiftUI/Modules/Common/Util/OptionButton.swift index 428ecf09c..17e54bbda 100644 --- a/RiotSwiftUI/Modules/Common/Util/OptionButton.swift +++ b/RiotSwiftUI/Modules/Common/Util/OptionButton.swift @@ -55,7 +55,7 @@ struct OptionButton: View { } } Spacer() - Image(systemName: "chevron.right").font(.system(size: 16, weight: .regular)).foregroundColor(theme.colors.quaternaryContent) + Image(systemName: "chevron.right").font(.system(size: 16, weight: .regular)).foregroundColor(theme.colors.quarterlyContent) } .padding(EdgeInsets(top: 15, leading: 16, bottom: 15, trailing: 16)) .background(theme.colors.quinaryContent) diff --git a/RiotSwiftUI/Modules/Common/Util/SearchBar.swift b/RiotSwiftUI/Modules/Common/Util/SearchBar.swift index 3901ea65a..4edaa2e5c 100644 --- a/RiotSwiftUI/Modules/Common/Util/SearchBar.swift +++ b/RiotSwiftUI/Modules/Common/Util/SearchBar.swift @@ -38,7 +38,7 @@ struct SearchBar: View { } .padding(8) .padding(.horizontal, 25) - .background(theme.colors.system) + .background(theme.colors.navigation) .cornerRadius(8) .padding(.leading) .padding(.trailing, isEditing ? 8 : 16) @@ -46,7 +46,7 @@ struct SearchBar: View { HStack { Image(systemName: "magnifyingglass") .renderingMode(.template) - .foregroundColor(theme.colors.quaternaryContent) + .foregroundColor(theme.colors.quarterlyContent) .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading) if isEditing && !text.isEmpty { @@ -55,7 +55,7 @@ struct SearchBar: View { }) { Image(systemName: "multiply.circle.fill") .renderingMode(.template) - .foregroundColor(theme.colors.quaternaryContent) + .foregroundColor(theme.colors.quarterlyContent) } } } diff --git a/RiotSwiftUI/Modules/Common/Util/SecondaryActionButtonStyle.swift b/RiotSwiftUI/Modules/Common/Util/SecondaryActionButtonStyle.swift index a20eba58e..8f0eb6aac 100644 --- a/RiotSwiftUI/Modules/Common/Util/SecondaryActionButtonStyle.swift +++ b/RiotSwiftUI/Modules/Common/Util/SecondaryActionButtonStyle.swift @@ -68,7 +68,7 @@ struct SecondaryActionButtonStyle_Previews: PreviewProvider { Text("Custom") .foregroundColor(theme.colors.secondaryContent) } - .buttonStyle(SecondaryActionButtonStyle(customColor: theme.colors.quaternaryContent)) + .buttonStyle(SecondaryActionButtonStyle(customColor: theme.colors.quarterlyContent)) } .padding() } diff --git a/RiotSwiftUI/Modules/Common/Util/WaitOverlay.swift b/RiotSwiftUI/Modules/Common/Util/WaitOverlay.swift index 4abada5e5..60f7315bb 100644 --- a/RiotSwiftUI/Modules/Common/Util/WaitOverlay.swift +++ b/RiotSwiftUI/Modules/Common/Util/WaitOverlay.swift @@ -89,7 +89,7 @@ struct WaitOverlay: ViewModifier { } .padding(12) .background(RoundedRectangle(cornerRadius: 8, style: .continuous) - .fill(theme.colors.system.opacity(0.9))) + .fill(theme.colors.navigation.opacity(0.9))) } .edgesIgnoringSafeArea(.all) .transition(.opacity) diff --git a/RiotSwiftUI/Modules/Onboarding/Avatar/Coordinator/OnboardingAvatarCoordinator.swift b/RiotSwiftUI/Modules/Onboarding/Avatar/Coordinator/OnboardingAvatarCoordinator.swift index 5884e363e..216a65ea4 100644 --- a/RiotSwiftUI/Modules/Onboarding/Avatar/Coordinator/OnboardingAvatarCoordinator.swift +++ b/RiotSwiftUI/Modules/Onboarding/Avatar/Coordinator/OnboardingAvatarCoordinator.swift @@ -72,7 +72,7 @@ final class OnboardingAvatarCoordinator: Coordinator, Presentable { self.parameters = parameters let viewModel = OnboardingAvatarViewModel(userId: parameters.userSession.userId, displayName: parameters.userSession.account.userDisplayName, - avatarColorCount: DefaultThemeSwiftUI().colors.contentAndAvatars.count) + avatarColorCount: DefaultThemeSwiftUI().colors.namesAndAvatars.count) viewModel.updateAvatarImage(with: parameters.avatar) let view = OnboardingAvatarScreen(viewModel: viewModel.context) diff --git a/RiotSwiftUI/Modules/Onboarding/Avatar/MockOnboardingAvatarScreenState.swift b/RiotSwiftUI/Modules/Onboarding/Avatar/MockOnboardingAvatarScreenState.swift index 8982961f6..7cf96984a 100644 --- a/RiotSwiftUI/Modules/Onboarding/Avatar/MockOnboardingAvatarScreenState.swift +++ b/RiotSwiftUI/Modules/Onboarding/Avatar/MockOnboardingAvatarScreenState.swift @@ -44,7 +44,7 @@ enum MockOnboardingAvatarScreenState: MockScreenState, CaseIterable { /// Generate the view struct for the screen state. var screenView: ([Any], AnyView) { - let avatarColorCount = DefaultThemeSwiftUI().colors.contentAndAvatars.count + let avatarColorCount = DefaultThemeSwiftUI().colors.namesAndAvatars.count let viewModel: OnboardingAvatarViewModel switch self { case .placeholderAvatar(let userId, let displayName): diff --git a/RiotSwiftUI/Modules/Onboarding/Avatar/Test/Unit/OnboardingAvatarViewModelTests.swift b/RiotSwiftUI/Modules/Onboarding/Avatar/Test/Unit/OnboardingAvatarViewModelTests.swift index 0fe73b772..fd0f284d3 100644 --- a/RiotSwiftUI/Modules/Onboarding/Avatar/Test/Unit/OnboardingAvatarViewModelTests.swift +++ b/RiotSwiftUI/Modules/Onboarding/Avatar/Test/Unit/OnboardingAvatarViewModelTests.swift @@ -23,7 +23,7 @@ class OnboardingAvatarViewModelTests: XCTestCase { private enum Constants { static let userId = "@user:matrix.org" static let displayName = "Alice" - static let avatarColorCount = DefaultThemeSwiftUI().colors.contentAndAvatars.count + static let avatarColorCount = DefaultThemeSwiftUI().colors.namesAndAvatars.count static let avatarImage = Asset.Images.appSymbol.image } diff --git a/RiotSwiftUI/Modules/Onboarding/SplashScreen/View/OnboardingSplashScreenPageIndicator.swift b/RiotSwiftUI/Modules/Onboarding/SplashScreen/View/OnboardingSplashScreenPageIndicator.swift index f2306eaf4..63e8507a0 100644 --- a/RiotSwiftUI/Modules/Onboarding/SplashScreen/View/OnboardingSplashScreenPageIndicator.swift +++ b/RiotSwiftUI/Modules/Onboarding/SplashScreen/View/OnboardingSplashScreenPageIndicator.swift @@ -47,7 +47,7 @@ struct OnboardingSplashScreenPageIndicator: View { ForEach(0..