mirror of
https://github.com/Novaloop-AG/element-x-ios.git
synced 2026-11-04 10:33:45 +00:00
Adopt Compound Colours (#1086)
* 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:
@@ -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)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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)
|
||||
}
|
||||
|
||||
+3
-3
@@ -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)
|
||||
}
|
||||
|
||||
+3
-3
@@ -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)
|
||||
}
|
||||
|
||||
+8
-8
@@ -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) {
|
||||
|
||||
Reference in New Issue
Block a user