ehealthsolutions/element-x-ios
3
0
Fork 0
mirror of https://github.com/Novaloop-AG/element-x-ios.git synced 2026-11-03 06:31:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adopt Compound Colours (#1086)

Browse Source 
* Delete deprecated font tokens.

* Migrate from primaryContent to textPrimary/iconPrimary.

* Migrate from links to textLinkExternal.

* Migrate from secondaryContent to textSecondary/iconSecondary.

* Migrate from accent to textActionPrimary.

- Some uses changed to textPrimary or iconPrimary as necessary.
- Some manual tints removed now that that Sentry is fixed.

* Migrate alert to textCriticalPrimary/iconCriticalPrimary.

* Migrate from brand to textActionAccent/iconAccentTertiary.

* Migrate from background to bgCanvasDefault or text/iconOnSolidPrimary

* Migrate system to bgSubtleSecondary.

* Remove ElementUIColors and obsolete migrated colours.

* Migrate tertiaryContent/quaternaryContent/quinaryContent to Compound.

* Migrate bubblesYou/bubblesNotYou to use Compound.

* Update Compound.
This commit is contained in:
Doug
2023-06-16 10:49:13 +01:00
committed by GitHub
parent ac41704821
commit de0213abb2
80 changed files with 274 additions and 723 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ElementX/Sources/Other/HTMLParsing/AttributedStringBuilder.swift
+1 -1
View File
@@ -112,7 +112,7 @@ struct AttributedStringBuilder: AttributedStringBuilderProtocol {
attributedString.enumerateAttribute(.backgroundColor, in: .init(location: 0, length: attributedString.length), options: []) { value, range, _ in
if let value = value as? UIColor,
value == temporaryCodeBlockMarkingColor {
attributedString.addAttribute(.backgroundColor, value: UIColor.element.quinaryContent as Any, range: range)
attributedString.addAttribute(.backgroundColor, value: UIColor(.compound._bgCodeBlock) as Any, range: range)
}
}
}
ElementX/Sources/Other/MapLibre/LocationAnnotation.swift
+2 -2
View File
@@ -73,7 +73,7 @@ class LocationAnnotationView: MGLUserLocationAnnotationView {
private func addUserView() {
guard let pinView = UIHostingController(rootView: Image(systemName: "circle.fill")
.resizable()
.foregroundColor(.element.accent)).view else {
.foregroundColor(.compound.iconPrimary)).view else {
return
}
@@ -83,7 +83,7 @@ class LocationAnnotationView: MGLUserLocationAnnotationView {
private func addPinView() {
guard let pinView = UIHostingController(rootView: Image(systemName: "mappin")
.resizable()
.foregroundColor(.element.accent)).view else {
.foregroundColor(.compound.iconPrimary)).view else {
return
}
ElementX/Sources/Other/SwiftUI/Form Styles/FormButtonStyles.swift
+7 -7
View File
@@ -45,13 +45,13 @@ struct FormRowAccessory: View {
case .navigationLink:
Image(systemName: "chevron.forward")
.font(.compound.bodyMD.bold())
.foregroundColor(.element.quaternaryContent)
.foregroundColor(.compound.iconQuaternary)
case .progressView:
ProgressView()
case .selection(let isSelected):
Image(systemName: isSelected ? "checkmark.circle.fill" : "circle")
.font(.compound.bodyLG)
.foregroundColor(isSelected && isEnabled ? .element.primaryContent : .element.tertiaryContent)
.foregroundColor(isSelected && isEnabled ? .compound.iconPrimary : .compound.iconTertiary)
}
}
@@ -87,14 +87,14 @@ struct FormButtonStyle: PrimitiveButtonStyle {
HStack {
configuration.label
.labelStyle(FormRowLabelStyle(role: configuration.role))
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.frame(maxWidth: .infinity, alignment: .leading)
accessory
}
.contentShape(Rectangle())
.padding(FormRow.insets) // Re-apply the normal insets using padding.
.background(configuration.isPressed ? Color.element.quinaryContent : .clear)
.background(configuration.isPressed ? Color.compound.bgSubtlePrimary : .clear)
}
}
}
@@ -109,15 +109,15 @@ struct FormActionButtonStyle: ButtonStyle {
VStack {
configuration.label
.buttonStyle(.plain)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.frame(width: menuIconSize, height: menuIconSize)
.background {
RoundedRectangle(cornerRadius: 16)
.fill(configuration.isPressed ? Color.element.quinaryContent : .element.formRowBackground)
.fill(configuration.isPressed ? Color.compound.bgSubtlePrimary : .element.formRowBackground)
}
Text(title)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodyMD)
}
}
ElementX/Sources/Other/SwiftUI/Form Styles/FormRowLabelStyle.swift
+5 -5
View File
@@ -24,15 +24,15 @@ struct FormRowLabelStyle: LabelStyle {
private var titleColor: Color {
if role == .destructive {
return .element.alert
return .compound.textCriticalPrimary
} else {
return .element.primaryContent
return .compound.textPrimary
}
}
private var iconBackgroundColor: Color {
if role == .destructive {
return .element.alert.opacity(0.1)
return .compound.textCriticalPrimary.opacity(0.1)
} else {
return .element.formBackground
}
@@ -40,9 +40,9 @@ struct FormRowLabelStyle: LabelStyle {
private var iconForegroundColor: Color {
if role == .destructive {
return .element.alert
return .compound.textCriticalPrimary
} else {
return .element.secondaryContent
return .compound.iconSecondary
}
}
ElementX/Sources/Other/SwiftUI/Form Styles/FormSection.swift
+1 -1
View File
@@ -25,7 +25,7 @@ extension View {
/// Applies a standard style for form header text.
func formSectionHeader() -> some View {
foregroundColor(.element.secondaryContent)
foregroundColor(.compound.textSecondary)
.font(.compound.bodyXS)
}
ElementX/Sources/Other/SwiftUI/Layout/FullscreenDialog.swift
+1 -1
View File
@@ -115,7 +115,7 @@ struct FullscreenDialog_Previews: PreviewProvider {
buttons
}
.background()
.environment(\.backgroundStyle, AnyShapeStyle(Color.element.background))
.environment(\.backgroundStyle, AnyShapeStyle(Color.compound.bgCanvasDefault))
}
private static var content: some View {
ElementX/Sources/Other/SwiftUI/Views/AvatarHeaderView.swift
+2 -2
View File
@@ -34,13 +34,13 @@ struct AvatarHeaderView<Footer: View>: View {
imageProvider: imageProvider)
Text(name ?? id)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.font(.compound.headingLGBold)
.multilineTextAlignment(.center)
if let subtitle {
Text(subtitle)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodyLG)
.multilineTextAlignment(.center)
}
ElementX/Sources/Other/SwiftUI/Views/ElementToggleStyle.swift
+1 -1
View File
@@ -23,7 +23,7 @@ struct ElementToggleStyle: ToggleStyle {
Image(systemName: configuration.isOn ? "checkmark.square.fill" : "square")
.font(.title3.weight(.regular))
.imageScale(.large)
.foregroundColor(.element.accent)
.foregroundColor(.compound.textActionPrimary)
}
.buttonStyle(.plain)
}
ElementX/Sources/Other/SwiftUI/Views/LoadableAvatarImage.swift
+1 -1
View File
@@ -38,7 +38,7 @@ struct LoadableAvatarImage: View {
var body: some View {
avatar
.frame(width: frameSize, height: frameSize)
.background(Color.element.background)
.background(Color.compound.bgCanvasDefault)
.clipShape(Circle())
}
ElementX/Sources/Other/SwiftUI/Views/PlaceholderAvatarImage.swift
+2 -2
View File
@@ -49,11 +49,11 @@ struct PlaceholderAvatarImage: View {
private var bgColor: Color {
if redactionReasons == .placeholder {
return .element.systemGray4
return Color(.systemGray4) // matches the default text redaction
}
guard let contentID else {
return .element.accent
return .compound.iconPrimary
}
return .element.avatarBackground(for: contentID)
ElementX/Sources/Other/SwiftUI/Views/UserProfileCell.swift
+17 -16
View File
@@ -22,6 +22,16 @@ struct UserProfileCell: View {
let membership: MembershipState?
let imageProvider: ImageProviderProtocol?
private var subtitle: String? {
if let membershipText = membership?.localizedDescription {
return membershipText
} else if user.displayName != nil {
return user.userID
} else {
return nil
}
}
var body: some View {
HStack(spacing: 16) {
LoadableAvatarImage(url: user.avatarURL,
@@ -34,9 +44,13 @@ struct UserProfileCell: View {
VStack(alignment: .leading, spacing: 0) {
Text(user.displayName ?? user.userID)
.font(.compound.headingSM)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
subtitleContent
if let subtitle {
Text(subtitle)
.font(.compound.bodyMD)
.foregroundColor(.compound.textSecondary)
}
warningContent
.padding(.top, 2)
@@ -47,19 +61,6 @@ struct UserProfileCell: View {
// MARK: - Private
@ViewBuilder
private var subtitleContent: some View {
if let membershipText = membership?.localizedDescription {
Text(membershipText)
.font(.compound.bodyMD)
.foregroundColor(.element.tertiaryContent)
} else if user.displayName != nil {
Text(user.userID)
.font(.compound.bodyMD)
.foregroundColor(.element.tertiaryContent)
}
}
@ViewBuilder
private var warningContent: some View {
if !user.isVerified, membership == nil {
@@ -68,7 +69,7 @@ struct UserProfileCell: View {
.foregroundColor(.compound.textCriticalPrimary)
Text(L10n.commonInviteUnknownProfile)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
}
.font(.compound.bodyXS)
}
ElementX/Sources/Other/UserIndicator/UserIndicatorModalView.swift
+2 -2
View File
@@ -36,13 +36,13 @@ struct UserIndicatorModalView: View {
}
Text(indicator.title)
.font(.compound.bodyLG)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
}
.padding()
.frame(minWidth: 150.0)
.fixedSize(horizontal: true, vertical: false)
.background(Color.element.quinaryContent)
.background(Color.compound.bgSubtlePrimary)
.clipShape(RoundedCornerShape(radius: 12.0, corners: .allCorners))
.shadow(color: .black.opacity(0.1), radius: 10.0, y: 4.0)
.onReceive(indicator.progressPublisher) { progress in
ElementX/Sources/Other/UserIndicator/UserIndicatorToastView.swift
+2 -2
View File
@@ -26,13 +26,13 @@ struct UserIndicatorToastView: View {
}
Text(indicator.title)
.font(.compound.bodySM)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
.id(indicator.id)
.padding(.horizontal, 12.0)
.padding(.vertical, 10.0)
.frame(minWidth: 150.0)
.background(Color.element.background)
.background(Color.compound.bgSubtlePrimary)
.clipShape(RoundedCornerShape(radius: 24.0, corners: .allCorners))
.shadow(color: .black.opacity(0.25), radius: 10.0, y: 4.0)
.transition(toastTransition)
ElementX/Sources/Screens/AnalyticsPromptScreen/View/AnalyticsPromptScreen.swift
+6 -6
View File
@@ -27,7 +27,7 @@ struct AnalyticsPromptScreen: View {
buttons
}
.background()
.environment(\.backgroundStyle, AnyShapeStyle(Color.element.background))
.environment(\.backgroundStyle, AnyShapeStyle(Color.compound.bgCanvasDefault))
.navigationBarHidden(true)
.navigationBarBackButtonHidden(true)
}
@@ -41,18 +41,18 @@ struct AnalyticsPromptScreen: View {
Text(L10n.screenAnalyticsPromptTitle(InfoPlistReader.main.bundleDisplayName))
.font(.compound.headingMDBold)
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.padding(.bottom, 2)
.accessibilityIdentifier(A11yIdentifiers.analyticsPromptScreen.title)
Text(context.viewState.strings.optInContent)
.font(.compound.bodyLG)
.multilineTextAlignment(.center)
.foregroundColor(.element.secondaryContent)
.tint(.element.links)
.foregroundColor(.compound.textSecondary)
.tint(.compound.textLinkExternal)
Divider()
.background(Color.element.quinaryContent)
.overlay { Color.compound._borderRowSeparator }
.padding(.vertical, 20)
checkmarkList
@@ -68,7 +68,7 @@ struct AnalyticsPromptScreen: View {
}
.fixedSize(horizontal: false, vertical: true)
.font(.compound.bodyLG)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.frame(maxWidth: .infinity)
}
ElementX/Sources/Screens/AnalyticsPromptScreen/View/AnalyticsPromptScreenCheckmarkItem.swift
+1 -1
View File
@@ -30,7 +30,7 @@ struct AnalyticsPromptScreenCheckmarkItem: View {
var body: some View {
Label { Text(attributedString) } icon: {
Image(systemName: "checkmark.circle")
.foregroundColor(.element.accent)
.foregroundColor(.compound.iconPrimary)
}
}
}
ElementX/Sources/Screens/Authentication/AuthenticationIconImage.swift
+2 -2
View File
@@ -27,14 +27,14 @@ struct AuthenticationIconImage: View {
image
.resizable()
.renderingMode(.template)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
.aspectRatio(contentMode: .fit)
.accessibilityHidden(true)
.padding(insets)
.frame(width: 70, height: 70)
.background {
RoundedRectangle(cornerRadius: 14)
.fill(Color.element.quinaryContent)
.fill(Color.compound.bgSubtleSecondary)
}
}
}
ElementX/Sources/Screens/Authentication/LoginScreen/View/LoginScreen.swift
+6 -6
View File
@@ -45,7 +45,7 @@ struct LoginScreen: View {
.padding(.horizontal, 16)
.padding(.bottom, 16)
}
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.alert(item: $context.alertInfo)
}
@@ -58,7 +58,7 @@ struct LoginScreen: View {
Text(L10n.screenLoginTitleWithHomeserver(context.viewState.homeserver.address))
.font(.compound.headingMDBold)
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
.padding(.horizontal, 16)
}
@@ -68,14 +68,14 @@ struct LoginScreen: View {
VStack(alignment: .leading, spacing: 0) {
Text(L10n.screenLoginFormHeader)
.font(.compound.bodySM)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.padding(.horizontal, 16)
.padding(.bottom, 8)
TextField(L10n.commonUsername,
text: $context.username,
// Prompt colour fixes a flicker that occurs before the text field style introspects the field.
prompt: Text(L10n.commonUsername).foregroundColor(.element.tertiaryContent))
prompt: Text(L10n.commonUsername).foregroundColor(.compound.textPlaceholder))
.focused($isUsernameFocused)
.textFieldStyle(.elementInput(accessibilityIdentifier: A11yIdentifiers.loginScreen.emailUsername))
.disableAutocorrection(true)
@@ -89,7 +89,7 @@ struct LoginScreen: View {
SecureField(L10n.commonPassword,
text: $context.password,
// Prompt colour fixes a flicker that occurs before the text field style introspects the field.
prompt: Text(L10n.commonPassword).foregroundColor(.element.tertiaryContent))
prompt: Text(L10n.commonPassword).foregroundColor(.compound.textPlaceholder))
.focused($isPasswordFocused)
.textFieldStyle(.elementInput(accessibilityIdentifier: A11yIdentifiers.loginScreen.password))
.textContentType(.password)
@@ -112,7 +112,7 @@ struct LoginScreen: View {
Text(L10n.screenLoginErrorUnsupportedAuthentication)
.font(.body)
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.frame(maxWidth: .infinity)
.accessibilityIdentifier(A11yIdentifiers.loginScreen.unsupportedServer)
}
ElementX/Sources/Screens/Authentication/ServerConfirmationScreen/View/ServerConfirmationScreen.swift
+3 -3
View File
@@ -26,7 +26,7 @@ struct ServerConfirmationScreen: View {
buttons
}
.background()
.environment(\.backgroundStyle, AnyShapeStyle(Color.element.background))
.environment(\.backgroundStyle, AnyShapeStyle(Color.compound.bgCanvasDefault))
.introspectViewController { viewController in
guard let window = viewController.view.window else { return }
context.send(viewAction: .updateWindow(window))
@@ -42,13 +42,13 @@ struct ServerConfirmationScreen: View {
Text(context.viewState.title)
.font(.compound.headingMDBold)
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.fixedSize(horizontal: false, vertical: true)
Text(context.viewState.message)
.font(.compound.bodyMD)
.multilineTextAlignment(.center)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textPrimary)
}
.padding(.horizontal, 16)
}
ElementX/Sources/Screens/Authentication/ServerSelectionScreen/View/ServerSelectionScreen.swift
+3 -3
View File
@@ -31,7 +31,7 @@ struct ServerSelectionScreen: View {
.readableFrame()
.padding(.horizontal, 16)
}
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.toolbar { toolbar }
.alert(item: $context.alertInfo)
.interactiveDismissDisabled()
@@ -46,12 +46,12 @@ struct ServerSelectionScreen: View {
Text(L10n.commonSelectYourServer)
.font(.compound.headingMDBold)
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
Text(L10n.screenChangeServerSubtitle)
.font(.compound.bodyMD)
.multilineTextAlignment(.center)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
}
.padding(.horizontal, 16)
}
ElementX/Sources/Screens/Authentication/SoftLogoutScreen/View/SoftLogoutScreen.swift
+8 -8
View File
@@ -47,7 +47,7 @@ struct SoftLogoutScreen: View {
.padding(.horizontal, 16)
.padding(.bottom, 16)
}
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.alert(item: $context.alertInfo)
.introspectViewController { viewController in
guard let window = viewController.view.window else { return }
@@ -61,20 +61,20 @@ struct SoftLogoutScreen: View {
Text(UntranslatedL10n.softLogoutSigninTitle)
.font(.compound.headingMDBold)
.multilineTextAlignment(.leading)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.title)
Text(UntranslatedL10n.softLogoutSigninNotice(context.viewState.credentials.homeserverName, context.viewState.credentials.userDisplayName, context.viewState.credentials.userId))
.font(.compound.bodyLG)
.multilineTextAlignment(.leading)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.message)
if context.viewState.showRecoverEncryptionKeysMessage {
Text(UntranslatedL10n.softLogoutSigninE2eWarningNotice)
.font(.compound.bodyLG)
.multilineTextAlignment(.leading)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
}
}
@@ -120,7 +120,7 @@ struct SoftLogoutScreen: View {
Text(L10n.screenLoginErrorUnsupportedAuthentication)
.font(.body)
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.frame(maxWidth: .infinity)
}
@@ -130,20 +130,20 @@ struct SoftLogoutScreen: View {
Text(UntranslatedL10n.softLogoutClearDataTitle)
.font(.compound.headingMDBold)
.multilineTextAlignment(.leading)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.clearDataTitle)
Text(UntranslatedL10n.softLogoutClearDataNotice)
.font(.compound.bodyLG)
.multilineTextAlignment(.leading)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.clearDataMessage)
.padding(.bottom, 12)
Button(action: clearData) {
Text(UntranslatedL10n.softLogoutClearDataSubmit)
}
.buttonStyle(.elementAction(.xLarge, color: .element.alert))
.buttonStyle(.elementAction(.xLarge, color: .compound.textCriticalPrimary))
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.clearData)
.alert(UntranslatedL10n.softLogoutClearDataDialogTitle,
isPresented: $showingClearDataConfirmation) {
ElementX/Sources/Screens/CreateRoom/View/CreateRoomScreen.swift
+7 -7
View File
@@ -87,7 +87,7 @@ struct CreateRoomScreen: View {
.formSectionHeader()
TextField(L10n.screenCreateRoomRoomNameLabel,
text: $context.roomName,
prompt: Text(L10n.commonRoomNamePlaceholder),
prompt: Text(L10n.commonRoomNamePlaceholder).foregroundColor(.compound.textPlaceholder),
axis: .horizontal)
.focused($focus, equals: .name)
.accessibilityIdentifier(A11yIdentifiers.createRoomScreen.roomName)
@@ -105,9 +105,9 @@ struct CreateRoomScreen: View {
private var cameraImage: some View {
Image(systemName: "camera")
.font(.system(size: 28, weight: .semibold))
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
.frame(width: roomIconSize, height: roomIconSize)
.background(Color.element.quinaryContent)
.background(Color.compound.bgSubtlePrimary)
.clipShape(Circle())
}
@@ -115,7 +115,7 @@ struct CreateRoomScreen: View {
Section {
TextField(L10n.screenCreateRoomTopicLabel,
text: $context.roomTopic,
prompt: Text(L10n.commonTopicPlaceholder),
prompt: Text(L10n.commonTopicPlaceholder).foregroundColor(.compound.textPlaceholder),
axis: .vertical)
.focused($focus, equals: .topic)
.accessibilityIdentifier(A11yIdentifiers.createRoomScreen.roomTopic)
@@ -158,7 +158,7 @@ struct CreateRoomScreen: View {
.font(.compound.bodyLG)
Text(L10n.screenCreateRoomPrivateOptionDescription)
.font(.compound.bodyXS)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
}
} icon: {
Image(systemName: "lock.shield")
@@ -172,7 +172,7 @@ struct CreateRoomScreen: View {
.font(.compound.bodyLG)
Text(L10n.screenCreateRoomPublicOptionDescription)
.font(.compound.bodyXS)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
}
} icon: {
Image(systemName: "exclamationmark.shield")
@@ -187,7 +187,7 @@ struct CreateRoomScreen: View {
.formSectionHeader()
.padding(.top, 40)
}
.listRowSeparatorTint(.element.quinaryContent)
.listRowSeparatorTint(.compound._borderRowSeparator)
.listRowBackground(Color.element.formRowBackground)
}
ElementX/Sources/Screens/EmojiPickerScreen/View/EmojiPickerScreenHeaderView.swift
+1 -1
View File
@@ -23,7 +23,7 @@ struct EmojiPickerScreenHeaderView: View {
HStack {
Text(title)
.font(.compound.bodyMD.bold())
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.frame(maxWidth: .infinity, alignment: .leading)
}
}
ElementX/Sources/Screens/HomeScreen/View/HomeScreen.swift
+5 -5
View File
@@ -123,7 +123,7 @@ struct HomeScreen: View {
.navigationTitle(L10n.screenRoomlistMainSpaceTitle)
.toolbar(showingBottomToolbar ? .automatic : .hidden, for: .bottomBar)
.toolbar { toolbar }
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.track(screen: .home)
}
@@ -195,7 +195,7 @@ struct HomeScreen: View {
HStack(spacing: 16) {
Text(L10n.sessionVerificationBannerTitle)
.font(.compound.bodyLGSemibold)
.foregroundColor(.element.systemPrimaryLabel)
.foregroundColor(.compound.textPrimary)
Spacer()
@@ -203,13 +203,13 @@ struct HomeScreen: View {
context.send(viewAction: .skipSessionVerification)
} label: {
Image(systemName: "xmark")
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
.frame(width: 12, height: 12)
}
}
Text(L10n.sessionVerificationBannerMessage)
.font(.compound.bodyMD)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
}
Button(L10n.actionContinue) {
@@ -220,7 +220,7 @@ struct HomeScreen: View {
.accessibilityIdentifier(A11yIdentifiers.homeScreen.verificationBannerContinue)
}
.padding(16)
.background(Color.element.system)
.background(Color.compound.bgSubtleSecondary)
.cornerRadius(14)
.padding(.horizontal, 16)
}
ElementX/Sources/Screens/HomeScreen/View/HomeScreenInvitesButton.swift
+2 -2
View File
@@ -27,7 +27,7 @@ struct HomeScreenInvitesButton: View {
Button(action: action) {
HStack(spacing: 8) {
Text(title)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.font(.compound.bodyMD)
if hasBadge {
@@ -43,7 +43,7 @@ struct HomeScreenInvitesButton: View {
private var badge: some View {
Circle()
.frame(width: badgeSize, height: badgeSize)
.foregroundColor(.element.brand)
.foregroundColor(.compound.iconAccentTertiary)
}
}
ElementX/Sources/Screens/HomeScreen/View/HomeScreenRoomCell.swift
+6 -6
View File
@@ -39,7 +39,7 @@ struct HomeScreenRoomCell: View {
.padding(.vertical, verticalInsets)
.overlay(alignment: .bottom) {
Rectangle()
.fill(Color.element.quinaryContent)
.fill(Color.compound._borderRowSeparator)
.frame(height: 1 / UIScreen.main.scale)
.padding(.trailing, -horizontalInsets)
}
@@ -86,14 +86,14 @@ struct HomeScreenRoomCell: View {
HStack(alignment: .top, spacing: 16) {
Text(room.name)
.font(.compound.bodyLGSemibold)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.lineLimit(1)
.frame(maxWidth: .infinity, alignment: .leading)
if let timestamp = room.timestamp {
Text(timestamp)
.font(.compound.bodySM)
.foregroundColor(room.hasUnreads ? .element.brand : .element.tertiaryContent)
.foregroundColor(room.hasUnreads ? .compound.textActionAccent : .compound.textSecondary)
}
}
}
@@ -116,7 +116,7 @@ struct HomeScreenRoomCell: View {
if room.hasUnreads {
Circle()
.frame(width: 12, height: 12)
.foregroundColor(.element.brand)
.foregroundColor(.compound.iconAccentTertiary)
.padding(.leading, 12)
} else {
// Force extra padding between last message text and the right border of the screen if there is no unread dot
@@ -149,7 +149,7 @@ struct HomeScreenRoomCellButtonStyle: ButtonStyle {
func makeBody(configuration: Configuration) -> some View {
configuration.label
.background(configuration.isPressed || isSelected ? Color.element.system : .clear)
.background(configuration.isPressed || isSelected ? Color.compound.bgSubtleSecondary : .clear)
.contentShape(Rectangle())
}
}
@@ -157,7 +157,7 @@ struct HomeScreenRoomCellButtonStyle: ButtonStyle {
private extension View {
func lastMessageFormatting() -> some View {
font(.compound.bodyMD)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
.lineLimit(2)
.multilineTextAlignment(.leading)
}
ElementX/Sources/Screens/InviteUsersScreen/View/InviteUsersScreen.swift
+1 -2
View File
@@ -66,7 +66,7 @@ struct InviteUsersScreen: View {
private var noResultsContent: some View {
Text(L10n.commonNoResults)
.font(.compound.bodyLG)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
.frame(maxWidth: .infinity)
.listRowBackground(Color.clear)
.accessibilityIdentifier(A11yIdentifiers.startChatScreen.searchNoResults)
@@ -148,7 +148,6 @@ struct InviteUsersScreen_Previews: PreviewProvider {
static var previews: some View {
NavigationView {
InviteUsersScreen(context: viewModel.context)
.tint(.element.accent)
}
}
}
ElementX/Sources/Screens/InviteUsersScreen/View/InviteUsersScreenSelectedItem.swift
+2 -2
View File
@@ -29,7 +29,7 @@ struct InviteUsersScreenSelectedItem: View {
Text(user.displayName ?? user.userID)
.font(.compound.bodyMD)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.lineLimit(1)
}
}
@@ -48,7 +48,7 @@ struct InviteUsersScreenSelectedItem: View {
.resizable()
.frame(width: buttonSize, height: buttonSize)
.symbolRenderingMode(.palette)
.foregroundStyle(Color.element.systemPrimaryBackground, Color.element.primaryContent)
.foregroundStyle(Color.compound.iconOnSolidPrimary, Color.compound.iconPrimary)
}
}
}
ElementX/Sources/Screens/InvitesScreen/View/InvitesScreen.swift
+2 -2
View File
@@ -34,7 +34,7 @@ struct InvitesScreen: View {
noInvitesContent
}
}
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.navigationTitle(L10n.actionInvitesList)
.alert(item: $context.alertInfo)
}
@@ -44,7 +44,7 @@ struct InvitesScreen: View {
private var noInvitesContent: some View {
Text(L10n.screenInvitesEmptyList)
.font(.compound.bodyLG)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
.frame(maxWidth: .infinity)
.listRowBackground(Color.clear)
.accessibilityIdentifier(A11yIdentifiers.invitesScreen.noInvites)
ElementX/Sources/Screens/InvitesScreen/View/InvitesScreenCell.swift
+3 -3
View File
@@ -90,7 +90,7 @@ struct InvitesScreenCell: View {
VStack(alignment: .leading) {
Text(title)
.font(.compound.bodyLGSemibold)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.lineLimit(2)
if let subtitle {
@@ -116,7 +116,7 @@ struct InvitesScreenCell: View {
private var separator: some View {
Rectangle()
.fill(Color.element.quinaryContent)
.fill(Color.compound._borderRowSeparator)
.frame(height: 1 / UIScreen.main.scale)
}
@@ -156,7 +156,7 @@ struct InvitesScreenCell: View {
private var badge: some View {
Circle()
.frame(width: badgeSize, height: badgeSize)
.foregroundColor(.element.brand)
.foregroundColor(.compound.iconAccentTertiary)
}
}
ElementX/Sources/Screens/OnboardingScreen/View/OnboardingScreen.swift
+2 -2
View File
@@ -72,11 +72,11 @@ struct OnboardingScreen: View {
Text(L10n.screenOnboardingWelcomeTitle)
.font(.compound.headingLGBold)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.multilineTextAlignment(.center)
Text(L10n.screenOnboardingWelcomeSubtitle(InfoPlistReader.main.bundleDisplayName))
.font(.compound.bodyLG)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.multilineTextAlignment(.center)
}
.padding()
ElementX/Sources/Screens/RoomDetailsEditScreen/View/RoomDetailsEditScreen.swift
+2 -2
View File
@@ -92,7 +92,7 @@ struct RoomDetailsEditScreen: View {
axis: .horizontal)
.focused($focus, equals: .name)
.font(.compound.bodyLG)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.disabled(!canEditName)
.listRowBackground(canEditName ? nil : Color.clear)
.clipShape(RoundedRectangle(cornerRadius: 8))
@@ -113,7 +113,7 @@ struct RoomDetailsEditScreen: View {
axis: .vertical)
.focused($focus, equals: .topic)
.font(.compound.bodyLG)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.disabled(!canEditTopic)
.listRowBackground(canEditTopic ? nil : Color.clear)
.lineLimit(3, reservesSpace: true)
ElementX/Sources/Screens/RoomDetailsScreen/View/RoomDetailsScreen.swift
+7 -6
View File
@@ -110,7 +110,7 @@ struct RoomDetailsScreen: View {
Section {
if let topic = context.viewState.topic, !topic.isEmpty {
Text(topic)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodySM)
.lineLimit(3)
} else {
@@ -118,7 +118,7 @@ struct RoomDetailsScreen: View {
context.send(viewAction: .processTapAddTopic)
} label: {
Text(L10n.screenRoomDetailsAddTopicTitle)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.font(.compound.bodyLG)
}
.accessibilityIdentifier(A11yIdentifiers.roomDetailsScreen.addTopic)
@@ -138,7 +138,7 @@ struct RoomDetailsScreen: View {
} label: {
LabeledContent {
Text(String(context.viewState.joinedMembersCount))
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodyLG)
} label: {
Label(L10n.commonPeople, systemImage: "person")
@@ -155,9 +155,10 @@ struct RoomDetailsScreen: View {
.accessibilityIdentifier(A11yIdentifiers.roomDetailsScreen.invite)
}
}
.listRowSeparatorTint(.element.quinaryContent)
.listRowSeparatorTint(.compound._borderRowSeparator)
.buttonStyle(FormButtonStyle(accessory: .navigationLink))
.foregroundColor(.element.primaryContent)
.formSectionStyle()
.foregroundColor(.compound.textPrimary)
}
@ViewBuilder
@@ -168,7 +169,7 @@ struct RoomDetailsScreen: View {
VStack(alignment: .leading, spacing: 2) {
Text(L10n.screenRoomDetailsEncryptionEnabledTitle)
Text(L10n.screenRoomDetailsEncryptionEnabledSubtitle)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodySM)
}
} icon: {
ElementX/Sources/Screens/RoomMemberListScreen/View/RoomMembersListScreen.swift
+2 -2
View File
@@ -31,7 +31,7 @@ struct RoomMembersListScreen: View {
}
.searchable(text: $context.searchQuery, placement: .navigationBarDrawer(displayMode: .always))
.compoundSearchField()
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.navigationTitle(L10n.commonPeople)
.alert(item: $context.alertInfo)
.toolbar {
@@ -51,7 +51,7 @@ struct RoomMembersListScreen: View {
} header: {
if !data.isEmpty {
Text(sectionTitle)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodyLG)
.padding(.vertical, 12)
}
ElementX/Sources/Screens/RoomMemberListScreen/View/RoomMembersListScreenMemberCell.swift
+1 -1
View File
@@ -36,7 +36,7 @@ struct RoomMembersListScreenMemberCell: View {
Text(member.name ?? "")
.font(.compound.bodyMDSemibold)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.lineLimit(1)
Spacer()
ElementX/Sources/Screens/RoomScreen/View/MessageComposer.swift
+9 -9
View File
@@ -42,7 +42,7 @@ struct MessageComposer: View {
maxHeight: 300,
enterKeyHandler: sendAction,
pasteHandler: pasteAction)
.tint(.element.brand)
.tint(.compound.iconAccentTertiary)
.padding(.vertical, 10)
Button {
@@ -51,10 +51,10 @@ struct MessageComposer: View {
submitButtonImage
.symbolVariant(.fill)
.font(.compound.bodyLG)
.foregroundColor(sendingDisabled ? .element.quaternaryContent : .global.white)
.foregroundColor(sendingDisabled ? .compound.iconDisabled : .global.white)
.background {
Circle()
.foregroundColor(sendingDisabled ? .clear : .element.brand)
.foregroundColor(sendingDisabled ? .clear : .compound.iconAccentTertiary)
}
}
.disabled(sendingDisabled)
@@ -67,9 +67,9 @@ struct MessageComposer: View {
.background {
ZStack {
roundedRectangle
.fill(Color.element.system)
.fill(Color.compound.bgSubtleSecondary)
roundedRectangle
.stroke(Color.element.quinaryContent, lineWidth: 1)
.stroke(Color.compound._borderTextFieldFocused, lineWidth: 1)
.opacity(focused ? 1 : 0)
}
}
@@ -126,7 +126,7 @@ private struct MessageComposerReplyHeader: View {
TimelineReplyView(placement: .composer, timelineItemReplyDetails: replyDetails)
.frame(maxWidth: .infinity, alignment: .leading)
.padding(4.0)
.background(Color.element.background)
.background(Color.compound.bgCanvasDefault)
.cornerRadius(13.0)
.padding([.trailing, .vertical], 8.0)
.padding([.leading], -4.0)
@@ -134,7 +134,7 @@ private struct MessageComposerReplyHeader: View {
Button(action: action) {
Image(systemName: "xmark")
.font(.caption2.weight(.medium))
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.iconTertiary)
.padding(16.0)
}
}
@@ -152,7 +152,7 @@ private struct MessageComposerEditHeader: View {
Button(action: action) {
Image(systemName: "xmark")
.font(.caption2.weight(.medium))
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.iconTertiary)
.padding(12.0)
}
}
@@ -166,7 +166,7 @@ private struct MessageComposerHeaderLabelStyle: LabelStyle {
configuration.title
}
.font(.compound.bodySM)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.lineLimit(1)
}
}
ElementX/Sources/Screens/RoomScreen/View/MessageComposerTextField.swift
+3 -11
View File
@@ -29,14 +29,6 @@ struct MessageComposerTextField: View {
let enterKeyHandler: EnterKeyHandler
let pasteHandler: PasteHandler
private var showingPlaceholder: Bool {
text.isEmpty
}
private var placeholderColor: Color {
.element.secondaryContent
}
var body: some View {
UITextViewWrapper(text: $text,
focused: $focused,
@@ -50,9 +42,9 @@ struct MessageComposerTextField: View {
@ViewBuilder
private var placeholderView: some View {
if showingPlaceholder {
if text.isEmpty {
Text(placeholder)
.foregroundColor(placeholderColor)
.foregroundColor(.compound.textPlaceholder)
.accessibilityHidden(true)
}
}
@@ -77,7 +69,7 @@ private struct UITextViewWrapper: UIViewRepresentable {
textView.isMultiline = $isMultiline
textView.delegate = context.coordinator
textView.elementDelegate = context.coordinator
textView.textColor = .element.primaryContent
textView.textColor = UIColor(.compound.textPrimary)
textView.isEditable = true
textView.font = font
textView.isSelectable = true
ElementX/Sources/Screens/RoomScreen/View/Replies/TimelineReplyView.swift
+2 -2
View File
@@ -105,7 +105,7 @@ struct TimelineReplyView: View {
HStack {
iconView
.frame(width: imageContainerSize, height: imageContainerSize)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.iconPrimary)
.background(Color.compound.bgSubtlePrimary)
.cornerRadius(icon?.cornerRadii ?? 0.0, corners: .allCorners)
@@ -121,7 +121,7 @@ struct TimelineReplyView: View {
Text(formattedBody ?? AttributedString(plainBody))
.font(.compound.bodyMD)
.foregroundColor(.compound.textPlaceholder)
.tint(.element.links)
.tint(.compound.textLinkExternal)
.lineLimit(2)
}
}
ElementX/Sources/Screens/RoomScreen/View/RoomAttachmentPicker.swift
+2 -2
View File
@@ -28,7 +28,7 @@ struct RoomAttachmentPicker: View {
} label: {
Image(systemName: "plus.circle.fill")
.font(.compound.headingLG)
.foregroundColor(.element.accent)
.foregroundColor(.compound.textActionPrimary)
}
.accessibilityIdentifier(A11yIdentifiers.roomScreen.attachmentPicker)
.popover(isPresented: $showAttachmentPopover) {
@@ -64,9 +64,9 @@ struct RoomAttachmentPicker: View {
}
}
}
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.presentationDetents([.height(sheetContentHeight)])
.presentationDragIndicator(.visible)
.tint(.element.accent)
}
}
ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift
+5 -5
View File
@@ -23,7 +23,7 @@ struct RoomScreen: View {
var body: some View {
timeline
.background(Color.element.background.ignoresSafeArea()) // Kills the toolbar translucency.
.background(Color.compound.bgCanvasDefault.ignoresSafeArea()) // Kills the toolbar translucency.
.safeAreaInset(edge: .bottom, spacing: 0) {
HStack(spacing: 4.0) {
RoomAttachmentPicker(context: context)
@@ -101,12 +101,12 @@ struct RoomScreen: View {
Image(systemName: "chevron.down")
.font(.compound.bodyLG)
.fontWeight(.semibold)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
.padding(13)
.offset(y: 1)
.background {
Circle()
.fill(Color.element.background)
.fill(Color.compound.iconOnSolidPrimary)
// Intentionally using system primary colour to get white/black.
.shadow(color: .primary.opacity(0.33), radius: 2.0)
}
@@ -122,9 +122,9 @@ struct RoomScreen: View {
if context.viewState.showLoading {
ProgressView()
.progressViewStyle(.circular)
.tint(.element.primaryContent)
.tint(.compound.textPrimary)
.padding(16)
.background(Color.element.quinaryContent)
.background(.ultraThickMaterial)
.cornerRadius(8)
}
}
ElementX/Sources/Screens/RoomScreen/View/Style/TimelineItemBubbledStylerView.swift
+5 -5
View File
@@ -79,7 +79,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
.accessibilityHidden(true)
Text(timelineItem.sender.displayName ?? timelineItem.sender.id)
.font(.compound.bodySMSemibold)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.lineLimit(1)
.padding(.vertical, senderNameVerticalPadding)
}
@@ -138,7 +138,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
} else {
contentWithTimestamp
.bubbleStyle(inset: true,
color: timelineItem.isOutgoing ? .element.bubblesYou : .element.bubblesNotYou,
color: timelineItem.isOutgoing ? .compound._bgBubbleOutgoing : .compound._bgBubbleIncoming,
cornerRadius: cornerRadius,
corners: roundedCorners)
}
@@ -177,7 +177,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
localizedSendInfo
.padding(.horizontal, 4)
.padding(.vertical, 2)
.background(Color.element.system)
.background(Color.compound.bgSubtleSecondary)
.cornerRadius(10)
.padding(.trailing, 4)
.padding(.bottom, 4)
@@ -201,7 +201,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
}
}
.font(.compound.bodyXS)
.foregroundColor(timelineItem.properties.deliveryStatus == .sendingFailed ? .element.alert : .element.secondaryContent)
.foregroundColor(timelineItem.properties.deliveryStatus == .sendingFailed ? .compound.textCriticalPrimary : .compound.textSecondary)
.padding(.bottom, isMediaType ? 0 : -4)
}
@@ -217,7 +217,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
.fixedSize(horizontal: false, vertical: true)
.padding(4.0)
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.element.background)
.background(Color.compound.bgCanvasDefault)
.cornerRadius(8)
.layoutPriority(TimelineBubbleLayout.Priority.visibleQuote)
ElementX/Sources/Screens/RoomScreen/View/Style/TimelineItemPlainStylerView.swift
+3 -3
View File
@@ -89,7 +89,7 @@ struct TimelineItemPlainStylerView<Content: View>: View {
TimelineSenderAvatarView(timelineItem: timelineItem)
Text(timelineItem.sender.displayName ?? timelineItem.sender.id)
.font(.subheadline)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.fontWeight(.semibold)
.lineLimit(1)
}
@@ -98,7 +98,7 @@ struct TimelineItemPlainStylerView<Content: View>: View {
}
Spacer()
Text(timelineItem.timestamp)
.foregroundColor(Color.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
.font(.compound.bodyXS)
}
.padding(.top, 16)
@@ -111,7 +111,7 @@ struct TimelineItemPlainStylerView<Content: View>: View {
if timelineItem.properties.isEdited {
Text(L10n.commonEditedSuffix)
.font(.compound.bodySM)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
}
if !timelineItem.properties.reactions.isEmpty {
ElementX/Sources/Screens/RoomScreen/View/Supplementary/TimelineDeliveryStatusView.swift
+1 -1
View File
@@ -35,7 +35,7 @@ struct TimelineDeliveryStatusView: View {
var body: some View {
Image(systemName: systemImageName)
.resizable()
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
.frame(width: 16.0, height: 16.0)
}
}
ElementX/Sources/Screens/RoomScreen/View/Supplementary/TimelineItemStatusView.swift
+1 -1
View File
@@ -67,7 +67,7 @@ struct TimelineItemStatusView: View {
if style == .plain {
Image(systemName: "exclamationmark.circle.fill")
.resizable()
.foregroundColor(.element.alert)
.foregroundColor(.compound.iconCriticalPrimary)
.frame(width: 16, height: 16)
.onTapGesture {
context.sendFailedConfirmationDialogInfo = .init(transactionID: timelineItem.properties.transactionID)
ElementX/Sources/Screens/RoomScreen/View/Supplementary/TimelineReactionsView.swift
+3 -3
View File
@@ -46,14 +46,14 @@ struct TimelineReactionButton: View {
.font(.compound.bodyMD)
Text(String(reaction.count))
.font(.compound.bodyMD)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
}
.padding(.vertical, 6)
.padding(.horizontal, 8)
.background(
backgroundShape
.strokeBorder(reaction.isHighlighted ? Color.element.secondaryContent : .element.background, lineWidth: 2)
.background(reaction.isHighlighted ? Color.element.accent.opacity(0.1) : .element.system, in: backgroundShape)
.strokeBorder(reaction.isHighlighted ? Color.compound.textSecondary : .compound.bgCanvasDefault, lineWidth: 2)
.background(reaction.isHighlighted ? Color.compound.textPrimary.opacity(0.1) : .compound.bgSubtleSecondary, in: backgroundShape)
)
.accessibilityElement(children: .combine)
}
ElementX/Sources/Screens/RoomScreen/View/Supplementary/TimelineReadReceiptsView.swift
+4 -4
View File
@@ -32,10 +32,10 @@ struct TimelineReadReceiptsView: View {
contentID: receipt.userID,
avatarSize: .user(on: .readReceipt),
imageProvider: context.imageProvider)
.overlay(
.overlay {
RoundedRectangle(cornerRadius: .infinity)
.stroke(Color.element.background, lineWidth: 1)
)
.stroke(Color.compound.bgCanvasDefault, lineWidth: 1)
}
.zIndex(Double(displayNumber - index))
}
}
@@ -43,7 +43,7 @@ struct TimelineReadReceiptsView: View {
let remaining = timelineItem.properties.orderedReadReceipts.count - displayNumber
Text("+\(remaining)")
.font(.compound.bodySM)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
}
}
ElementX/Sources/Screens/RoomScreen/View/Timeline/AudioRoomTimelineView.swift
+1 -1
View File
@@ -24,7 +24,7 @@ struct AudioRoomTimelineView: View {
TimelineStyler(timelineItem: timelineItem) {
HStack {
Image(systemName: "waveform")
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.iconPrimary)
FormattedBodyText(text: timelineItem.content.body)
}
.padding(.vertical, 12)
ElementX/Sources/Screens/RoomScreen/View/Timeline/CollapsibleRoomTimelineView.swift
+1 -1
View File
@@ -61,7 +61,7 @@ private struct CollapsibleRoomTimelineItemDisclosureGroupStyle: DisclosureGroupS
}
.frame(maxWidth: .infinity)
.font(.compound.bodySM)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.padding(.horizontal, 36.0)
.padding(.top, 20.0)
.padding(.bottom, 12.0)
ElementX/Sources/Screens/RoomScreen/View/Timeline/EncryptedRoomTimelineView.swift
+2 -2
View File
@@ -33,10 +33,10 @@ struct RoomTimelineViewLabelStyle: LabelStyle {
func makeBody(configuration: Configuration) -> some View {
HStack(alignment: .firstTextBaseline, spacing: 8) {
configuration.icon
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
configuration.title
.font(.body)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
.padding(.horizontal, timelineStyle == .bubbles ? 4 : 0)
}
ElementX/Sources/Screens/RoomScreen/View/Timeline/FileRoomTimelineView.swift
+1 -1
View File
@@ -24,7 +24,7 @@ struct FileRoomTimelineView: View {
TimelineStyler(timelineItem: timelineItem) {
HStack {
Image(systemName: "doc.text.fill")
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.iconPrimary)
FormattedBodyText(text: timelineItem.content.body)
}
.padding(.vertical, 12)
ElementX/Sources/Screens/RoomScreen/View/Timeline/FormattedBodyText.swift
+6 -6
View File
@@ -42,10 +42,10 @@ struct FormattedBodyText: View {
var body: some View {
if timelineStyle == .bubbles {
bubbleLayout
.tint(.element.links)
.tint(.compound.textLinkExternal)
} else {
plainLayout
.tint(.element.links)
.tint(.compound.textLinkExternal)
}
}
@@ -73,7 +73,7 @@ struct FormattedBodyText: View {
Text(component.attributedString)
.padding(.horizontal, timelineStyle == .bubbles ? 4 : 0)
.fixedSize(horizontal: false, vertical: true)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.layoutPriority(TimelineBubbleLayout.Priority.regularText)
}
}
@@ -102,14 +102,14 @@ struct FormattedBodyText: View {
.foregroundColor(Color.red)
.frame(width: 4.0)
Text(component.attributedString)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
.fixedSize(horizontal: false, vertical: true)
} else {
Text(component.attributedString)
.padding(.horizontal, timelineStyle == .bubbles ? 4 : 0)
.fixedSize(horizontal: false, vertical: true)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
}
}
@@ -184,7 +184,7 @@ private struct PreviewBubbleModifier: ViewModifier {
func body(content: Content) -> some View {
content
.padding(timelineStyle == .bubbles ? 8 : 0)
.background(timelineStyle == .bubbles ? Color.element.systemGray6 : nil)
.background(timelineStyle == .bubbles ? Color.compound._bgBubbleOutgoing : nil)
.cornerRadius(timelineStyle == .bubbles ? 12 : 0)
}
}
ElementX/Sources/Screens/RoomScreen/View/Timeline/ImageRoomTimelineView.swift
+1 -1
View File
@@ -44,7 +44,7 @@ struct ImageRoomTimelineView: View {
var placeholder: some View {
ZStack {
Rectangle()
.foregroundColor(.element.systemGray6)
.foregroundColor(timelineItem.isOutgoing ? .compound._bgBubbleOutgoing : .compound._bgBubbleIncoming)
.opacity(0.3)
ProgressView(L10n.commonLoading)
ElementX/Sources/Screens/RoomScreen/View/Timeline/NoticeRoomTimelineView.swift
+1 -1
View File
@@ -30,7 +30,7 @@ struct NoticeRoomTimelineView: View, TextBasedRoomTimelineViewProtocol {
HStack(alignment: .firstTextBaseline, spacing: 6.0) {
Image(systemName: "info.bubble").padding(.top, 2.0)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.iconSecondary)
if let attributedString = timelineItem.content.formattedBody {
FormattedBodyText(attributedString: attributedString, additionalWhitespacesCount: additionalWhitespaces)
ElementX/Sources/Screens/RoomScreen/View/Timeline/ReadMarkerRoomTimelineView.swift
+2 -2
View File
@@ -25,10 +25,10 @@ struct ReadMarkerRoomTimelineView: View {
Text(L10n.roomTimelineReadMarkerTitle)
.textCase(.uppercase)
.font(.compound.bodyXSSemibold)
.foregroundColor(.element.quaternaryContent)
.foregroundColor(.compound.textSecondary)
Rectangle()
.frame(height: 0.5)
.foregroundColor(.element.quaternaryContent)
.foregroundColor(.compound.borderInteractivePrimary)
}
.padding(.horizontal, 20)
.padding(.vertical, 16)
ElementX/Sources/Screens/RoomScreen/View/Timeline/SeparatorRoomTimelineView.swift
+2 -2
View File
@@ -21,8 +21,8 @@ struct SeparatorRoomTimelineView: View {
var body: some View {
Text(timelineItem.text)
.font(.compound.bodySM)
.foregroundColor(.element.secondaryContent)
.font(.compound.bodySMSemibold)
.foregroundColor(.compound.textSecondary)
.frame(maxWidth: .infinity)
.padding(.horizontal, 36.0)
.padding(.vertical, 8.0)
ElementX/Sources/Screens/RoomScreen/View/Timeline/StateRoomTimelineView.swift
+1 -1
View File
@@ -23,7 +23,7 @@ struct StateRoomTimelineView: View {
Text(timelineItem.body)
.font(.compound.bodySM)
.multilineTextAlignment(.center)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.frame(maxWidth: .infinity, alignment: .center)
.padding(.horizontal, 36.0)
.padding(.vertical, 8.0)
ElementX/Sources/Screens/RoomScreen/View/Timeline/StickerRoomTimelineView.swift
+1 -1
View File
@@ -37,7 +37,7 @@ struct StickerRoomTimelineView: View {
private var placeholder: some View {
ZStack {
Rectangle()
.foregroundColor(.element.systemGray6)
.foregroundColor(timelineItem.isOutgoing ? .compound._bgBubbleOutgoing : .compound._bgBubbleIncoming)
.opacity(0.3)
ProgressView(L10n.commonLoading)
ElementX/Sources/Screens/RoomScreen/View/Timeline/TimelineStartRoomTimelineView.swift
+1 -1
View File
@@ -22,7 +22,7 @@ struct TimelineStartRoomTimelineView: View {
var body: some View {
Text(title)
.font(.compound.bodySM)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
.padding(.vertical, 24)
.frame(maxWidth: .infinity)
}
ElementX/Sources/Screens/RoomScreen/View/Timeline/VideoRoomTimelineView.swift
+1 -1
View File
@@ -56,7 +56,7 @@ struct VideoRoomTimelineView: View {
var placeholder: some View {
ZStack {
Rectangle()
.foregroundColor(.element.systemGray6)
.foregroundColor(timelineItem.isOutgoing ? .compound._bgBubbleOutgoing : .compound._bgBubbleIncoming)
.opacity(0.3)
ProgressView(L10n.commonLoading)
ElementX/Sources/Screens/RoomScreen/View/TimelineItemDebugView.swift
+1 -1
View File
@@ -90,7 +90,7 @@ struct TimelineItemDebugView: View {
Text(text)
.font(.compound.bodyXS.monospaced())
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
}
.frame(maxWidth: .infinity)
}
ElementX/Sources/Screens/RoomScreen/View/TimelineItemMenu.swift
+2 -2
View File
@@ -86,9 +86,9 @@ public struct TimelineItemMenu: View {
}
}
}
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.presentationDetents([.medium, .large])
.presentationDragIndicator(.visible)
.tint(.element.accent)
}
private var header: some View {
@@ -164,7 +164,7 @@ public struct TimelineItemMenu: View {
private func reactionBackgroundColor(for emoji: String) -> Color {
if item.properties.reactions.first(where: { $0.key == emoji }) != nil {
return .element.quinaryContent
return .compound._bgReactionButton
} else {
return .clear
}
ElementX/Sources/Screens/RoomScreen/View/TimelineSenderAvatarView.swift
+3 -3
View File
@@ -29,8 +29,8 @@ struct TimelineSenderAvatarView: View {
contentID: timelineItem.sender.id,
avatarSize: .user(on: .timeline),
imageProvider: context.imageProvider)
.overlay(
Circle().stroke(Color.element.background, lineWidth: 3)
)
.overlay {
Circle().stroke(Color.compound.bgCanvasDefault, lineWidth: 3)
}
}
}
ElementX/Sources/Screens/RoomScreen/View/TimelineTableViewController.swift
+1 -1
View File
@@ -106,7 +106,7 @@ class TimelineTableViewController: UIViewController {
tableView.separatorStyle = .none
tableView.allowsSelection = false
tableView.keyboardDismissMode = .onDrag
tableView.backgroundColor = .element.background
tableView.backgroundColor = UIColor(.compound.bgCanvasDefault)
view.addSubview(tableView)
// Prevents XCUITest from invoking the diffable dataSource's cellProvider
ElementX/Sources/Screens/SessionVerificationScreen/View/SessionVerificationScreen.swift
+7 -8
View File
@@ -33,7 +33,7 @@ struct SessionVerificationScreen: View {
.navigationBarTitleDisplayMode(.inline)
.toolbar { toolbarContent }
}
.background(Color.element.background.ignoresSafeArea())
.background(Color.compound.bgCanvasDefault.ignoresSafeArea())
.safeAreaInset(edge: .bottom) { actionButtons.padding() }
}
.interactiveDismissDisabled() // Make sure dismissal goes through the state machine(s).
@@ -77,14 +77,14 @@ struct SessionVerificationScreen: View {
Text(context.viewState.title ?? "")
.font(.title2.bold())
.multilineTextAlignment(.center)
.foregroundColor(.element.primaryContent)
.foregroundColor(.compound.textPrimary)
.padding(.bottom, 8)
.accessibilityIdentifier(context.viewState.titleAccessibilityIdentifier)
Text(context.viewState.message)
.font(.subheadline)
.multilineTextAlignment(.center)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
}
}
@@ -99,7 +99,7 @@ struct SessionVerificationScreen: View {
.accessibilityIdentifier(A11yIdentifiers.sessionVerificationScreen.emojiWrapper)
case .requestingVerification:
ProgressView()
.tint(.element.secondaryContent)
.tint(.compound.textSecondary)
.scaleEffect(2)
default:
// In All other cases, we just want an empty view
@@ -166,7 +166,7 @@ struct SessionVerificationScreen: View {
Button { context.send(viewAction: .accept) } label: {
HStack(spacing: 16) {
ProgressView()
.tint(.element.background)
.tint(.compound.textOnSolidPrimary)
Label(L10n.screenSessionVerificationTheyMatch, systemImage: "checkmark")
}
}
@@ -193,7 +193,6 @@ struct SessionVerificationScreen: View {
Button(L10n.actionCancel) {
context.send(viewAction: .close)
}
.foregroundColor(.element.accent)
.accessibilityIdentifier(A11yIdentifiers.sessionVerificationScreen.close)
}
}
@@ -207,7 +206,7 @@ struct SessionVerificationScreen: View {
.font(.compound.headingXLBold)
Text(emoji.description)
.font(.compound.bodyMD)
.foregroundColor(.element.secondaryContent)
.foregroundColor(.compound.textSecondary)
}
.padding(8.0)
}
@@ -221,7 +220,7 @@ struct SessionVerificationScreen: View {
.resizable()
.font(.compound.bodyLG.weight(.light))
.scaledToFit()
.foregroundColor(.element.accent)
.foregroundColor(.compound.iconPrimary)
.frame(width: 100, height: 100)
}
}
ElementX/Sources/Screens/StartChatScreen/View/StartChatScreen.swift
+1 -2
View File
@@ -111,7 +111,7 @@ struct StartChatScreen: View {
private var noResultsContent: some View {
Text(L10n.commonNoResults)
.font(.compound.bodyLG)
.foregroundColor(.element.tertiaryContent)
.foregroundColor(.compound.textSecondary)
.frame(maxWidth: .infinity)
.listRowBackground(Color.clear)
.accessibilityIdentifier(A11yIdentifiers.startChatScreen.searchNoResults)
@@ -147,7 +147,6 @@ struct StartChatScreen_Previews: PreviewProvider {
static var previews: some View {
NavigationView {
StartChatScreen(context: viewModel.context)
.tint(.element.accent)
}
}
}