mirror of
https://github.com/Novaloop-AG/element-x-ios.git
synced 2026-11-03 16:10:20 +00:00
Compound Fonts (#834)
* Use CompoundFonts in DesignKit (deprecate ElementFonts). * Use compound fonts everywhere. * Update Authentication snapshots. * Update RoomMembersListScreen snapshots. Delete unused snapshots. * Fix tests.
This commit is contained in:
@@ -108,6 +108,7 @@ struct A11yIdentifiers {
|
||||
let acceptChallenge = "session_verification-accept_challenge"
|
||||
let declineChallenge = "session_verification-decline_challenge"
|
||||
let emojiWrapper = "session_verification-emojis"
|
||||
let verificationComplete = "session_verification-verification_complete"
|
||||
let close = "session_verification-close"
|
||||
}
|
||||
|
||||
|
||||
@@ -26,13 +26,13 @@ enum FormRowAccessory: View {
|
||||
switch self {
|
||||
case .navigationLink:
|
||||
Image(systemName: "chevron.forward")
|
||||
.font(.element.subheadlineBold)
|
||||
.font(.compound.bodyMD.bold())
|
||||
.foregroundColor(.element.quaternaryContent)
|
||||
case .progressView:
|
||||
ProgressView()
|
||||
case .selection(let isSelected):
|
||||
Image(systemName: isSelected ? "checkmark.circle.fill" : "circle")
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(isSelected ? .element.primaryContent : .element.tertiaryContent)
|
||||
}
|
||||
}
|
||||
@@ -95,7 +95,7 @@ struct FormActionButtonStyle: ButtonStyle {
|
||||
|
||||
Text(title)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -55,7 +55,7 @@ struct FormRowLabelStyle: LabelStyle {
|
||||
.background(iconBackgroundColor)
|
||||
.clipShape(RoundedRectangle(cornerRadius: 8))
|
||||
configuration.title
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(titleColor)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -21,7 +21,7 @@ struct FormSectionHeaderStyle: ViewModifier {
|
||||
func body(content: Content) -> some View {
|
||||
content
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.font(.element.caption1)
|
||||
.font(.compound.bodyXS)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -35,13 +35,13 @@ struct AvatarHeaderView<Footer: View>: View {
|
||||
|
||||
Text(name ?? id)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.font(.element.title1Bold)
|
||||
.font(.compound.headingLGBold)
|
||||
.multilineTextAlignment(.center)
|
||||
|
||||
if let subtitle {
|
||||
Text(subtitle)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.multilineTextAlignment(.center)
|
||||
}
|
||||
|
||||
|
||||
@@ -32,12 +32,12 @@ struct UserProfileCell: View {
|
||||
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(user.displayName ?? user.userID)
|
||||
.font(.element.title3)
|
||||
.font(.compound.headingSM)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
|
||||
if user.displayName != nil {
|
||||
Text(user.userID)
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
}
|
||||
|
||||
|
||||
@@ -35,7 +35,7 @@ struct UserIndicatorModalView: View {
|
||||
Image(systemName: iconName)
|
||||
}
|
||||
Text(indicator.title)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -25,7 +25,7 @@ struct UserIndicatorToastView: View {
|
||||
Image(systemName: iconName)
|
||||
}
|
||||
Text(indicator.title)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
}
|
||||
.id(indicator.id)
|
||||
|
||||
@@ -60,14 +60,14 @@ struct AnalyticsPromptScreen: View {
|
||||
.padding(.bottom, 24)
|
||||
|
||||
Text(L10n.screenAnalyticsPromptTitle(InfoPlistReader.main.bundleDisplayName))
|
||||
.font(.element.title2Bold)
|
||||
.font(.compound.headingMDBold)
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.padding(.bottom, 2)
|
||||
.accessibilityIdentifier(A11yIdentifiers.analyticsPromptScreen.title)
|
||||
|
||||
Text(context.viewState.strings.optInContent)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.tint(.element.links)
|
||||
@@ -88,7 +88,7 @@ struct AnalyticsPromptScreen: View {
|
||||
AnalyticsPromptScreenCheckmarkItem(string: context.viewState.strings.point3)
|
||||
}
|
||||
.fixedSize(horizontal: false, vertical: true)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.frame(maxWidth: .infinity)
|
||||
}
|
||||
@@ -98,14 +98,14 @@ struct AnalyticsPromptScreen: View {
|
||||
VStack {
|
||||
Button { context.send(viewAction: .enable) } label: {
|
||||
Text(L10n.actionEnable)
|
||||
.font(.element.bodyBold)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
}
|
||||
.buttonStyle(.elementAction(.xLarge))
|
||||
.accessibilityIdentifier(A11yIdentifiers.analyticsPromptScreen.enable)
|
||||
|
||||
Button { context.send(viewAction: .disable) } label: {
|
||||
Text(L10n.actionNotNow)
|
||||
.font(.element.bodyBold)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.padding(12)
|
||||
}
|
||||
.accessibilityIdentifier(A11yIdentifiers.analyticsPromptScreen.notNow)
|
||||
|
||||
@@ -54,7 +54,7 @@ struct LoginScreen: View {
|
||||
/// The header containing a Welcome Back title.
|
||||
var header: some View {
|
||||
Text(L10n.screenLoginTitle)
|
||||
.font(.element.title1Bold)
|
||||
.font(.compound.headingLGBold)
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
}
|
||||
@@ -70,7 +70,7 @@ struct LoginScreen: View {
|
||||
var loginForm: some View {
|
||||
VStack(alignment: .leading, spacing: 0) {
|
||||
Text(L10n.screenLoginFormHeader)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.padding(.horizontal, 16)
|
||||
.padding(.bottom, 8)
|
||||
|
||||
+3
-2
@@ -31,14 +31,14 @@ struct LoginServerInfoSection: View {
|
||||
var body: some View {
|
||||
VStack(alignment: .leading, spacing: 8) {
|
||||
Text(L10n.screenLoginServerHeader)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.padding(.horizontal, 16)
|
||||
|
||||
Button(action: editAction) {
|
||||
HStack {
|
||||
Text(address)
|
||||
.font(.element.subheadlineBold)
|
||||
.font(.compound.bodyMDSemibold)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.padding(.horizontal, 16)
|
||||
.padding(.vertical)
|
||||
@@ -46,6 +46,7 @@ struct LoginServerInfoSection: View {
|
||||
Spacer()
|
||||
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.compound.bodyMD.bold())
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
.padding(.trailing, 16)
|
||||
}
|
||||
|
||||
+2
-2
@@ -44,12 +44,12 @@ struct ServerSelectionScreen: View {
|
||||
.padding(.bottom, 8)
|
||||
|
||||
Text(L10n.commonSelectYourServer)
|
||||
.font(.element.title2Bold)
|
||||
.font(.compound.headingMDBold)
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
|
||||
Text(L10n.screenChangeServerSubtitle)
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
}
|
||||
|
||||
+6
-6
@@ -55,20 +55,20 @@ struct SoftLogoutScreen: View {
|
||||
var header: some View {
|
||||
VStack(alignment: .leading, spacing: 16) {
|
||||
Text(UntranslatedL10n.softLogoutSigninTitle)
|
||||
.font(.element.title2Bold)
|
||||
.font(.compound.headingMDBold)
|
||||
.multilineTextAlignment(.leading)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.title)
|
||||
|
||||
Text(UntranslatedL10n.softLogoutSigninNotice(context.viewState.credentials.homeserverName, context.viewState.credentials.userDisplayName, context.viewState.credentials.userId))
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.multilineTextAlignment(.leading)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.message)
|
||||
|
||||
if context.viewState.showRecoverEncryptionKeysMessage {
|
||||
Text(UntranslatedL10n.softLogoutSigninE2eWarningNotice)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.multilineTextAlignment(.leading)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
}
|
||||
@@ -88,7 +88,7 @@ struct SoftLogoutScreen: View {
|
||||
|
||||
Button { context.send(viewAction: .forgotPassword) } label: {
|
||||
Text(UntranslatedL10n.softLogoutForgotPassword)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
}
|
||||
.frame(maxWidth: .infinity, alignment: .trailing)
|
||||
.padding(.bottom, 8)
|
||||
@@ -124,13 +124,13 @@ struct SoftLogoutScreen: View {
|
||||
var clearDataForm: some View {
|
||||
VStack(alignment: .leading, spacing: 12) {
|
||||
Text(UntranslatedL10n.softLogoutClearDataTitle)
|
||||
.font(.element.title2Bold)
|
||||
.font(.compound.headingMDBold)
|
||||
.multilineTextAlignment(.leading)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.clearDataTitle)
|
||||
|
||||
Text(UntranslatedL10n.softLogoutClearDataNotice)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.multilineTextAlignment(.leading)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.accessibilityIdentifier(A11yIdentifiers.softLogoutScreen.clearDataMessage)
|
||||
|
||||
@@ -33,7 +33,7 @@ struct EmojiPickerScreen: View {
|
||||
context.send(viewAction: .emojiTapped(emoji: emoji))
|
||||
} label: {
|
||||
Text(emoji.value)
|
||||
.font(.element.title1)
|
||||
.font(.compound.headingLG)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -22,7 +22,7 @@ struct EmojiPickerScreenHeaderView: View {
|
||||
var body: some View {
|
||||
HStack {
|
||||
Text(title)
|
||||
.font(.element.subheadline.bold())
|
||||
.font(.compound.bodyMD.bold())
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
}
|
||||
|
||||
@@ -167,7 +167,7 @@ struct HomeScreen: View {
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
HStack(spacing: 16) {
|
||||
Text(L10n.sessionVerificationBannerTitle)
|
||||
.font(.element.headline)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.foregroundColor(.element.systemPrimaryLabel)
|
||||
|
||||
Spacer()
|
||||
@@ -181,7 +181,7 @@ struct HomeScreen: View {
|
||||
}
|
||||
}
|
||||
Text(L10n.sessionVerificationBannerMessage)
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
}
|
||||
|
||||
|
||||
@@ -85,14 +85,14 @@ struct HomeScreenRoomCell: View {
|
||||
var header: some View {
|
||||
HStack(alignment: .top, spacing: 16) {
|
||||
Text(room.name)
|
||||
.font(.element.headline)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.lineLimit(1)
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
|
||||
if let timestamp = room.timestamp {
|
||||
Text(timestamp)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(room.hasUnreads ? .element.brand : .element.tertiaryContent)
|
||||
}
|
||||
}
|
||||
@@ -156,7 +156,7 @@ struct HomeScreenRoomCellButtonStyle: ButtonStyle {
|
||||
|
||||
private extension View {
|
||||
func lastMessageFormatting() -> some View {
|
||||
font(.element.subheadline)
|
||||
font(.compound.bodyMD)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
.lineLimit(2)
|
||||
.multilineTextAlignment(.leading)
|
||||
|
||||
@@ -55,7 +55,7 @@ struct InviteUsersScreen: View {
|
||||
|
||||
private var noResultsContent: some View {
|
||||
Text(L10n.commonNoResults)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
.frame(maxWidth: .infinity)
|
||||
.listRowBackground(Color.clear)
|
||||
|
||||
@@ -29,7 +29,7 @@ struct InviteUsersScreenSelectedItem: View {
|
||||
avatarSize: .user(on: .inviteUsers),
|
||||
imageProvider: imageProvider)
|
||||
Text(user.displayName ?? user.userID)
|
||||
.font(.element.title3)
|
||||
.font(.compound.headingSM)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.lineLimit(1)
|
||||
}
|
||||
|
||||
@@ -42,7 +42,7 @@ struct InvitesScreen: View {
|
||||
|
||||
private var noInvitesContent: some View {
|
||||
Text(L10n.screenInvitesEmptyList)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
.frame(maxWidth: .infinity)
|
||||
.listRowBackground(Color.clear)
|
||||
|
||||
@@ -86,7 +86,7 @@ struct InvitesScreenCell: View {
|
||||
private var textualContent: some View {
|
||||
VStack(alignment: .leading) {
|
||||
Text(title)
|
||||
.font(.element.headline)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
|
||||
if let subtitle {
|
||||
|
||||
@@ -40,11 +40,11 @@ struct OnboardingPageView: View {
|
||||
Spacer()
|
||||
|
||||
Text(content.title)
|
||||
.font(.element.title1Bold)
|
||||
.font(.compound.headingLGBold)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.multilineTextAlignment(.center)
|
||||
Text(content.message)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.multilineTextAlignment(.center)
|
||||
}
|
||||
|
||||
@@ -102,7 +102,7 @@ struct RoomDetailsScreen: View {
|
||||
Section {
|
||||
Text(topic)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
} header: {
|
||||
Text(L10n.commonTopic)
|
||||
.formSectionHeader()
|
||||
@@ -122,7 +122,7 @@ struct RoomDetailsScreen: View {
|
||||
} else {
|
||||
Text(String(context.viewState.members.count))
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
}
|
||||
} label: {
|
||||
Label(L10n.commonPeople, systemImage: "person")
|
||||
@@ -145,7 +145,7 @@ struct RoomDetailsScreen: View {
|
||||
Text(L10n.screenRoomDetailsEncryptionEnabledTitle)
|
||||
Text(L10n.screenRoomDetailsEncryptionEnabledSubtitle)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
}
|
||||
} icon: {
|
||||
Image(systemName: "lock.shield")
|
||||
|
||||
@@ -32,7 +32,7 @@ struct RoomMembersListScreen: View {
|
||||
} header: {
|
||||
Text(L10n.commonMemberCount(context.viewState.members.count))
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.padding(.vertical, 12)
|
||||
}
|
||||
.padding(.horizontal)
|
||||
|
||||
+1
-1
@@ -35,7 +35,7 @@ struct RoomMembersListScreenMemberCell: View {
|
||||
.accessibilityHidden(true)
|
||||
|
||||
Text(member.name ?? "")
|
||||
.font(.element.calloutBold)
|
||||
.font(.compound.bodyMDSemibold)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.lineLimit(1)
|
||||
|
||||
|
||||
@@ -48,7 +48,7 @@ struct MessageComposer: View {
|
||||
} label: {
|
||||
submitButtonImage
|
||||
.symbolVariant(.fill)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(sendingDisabled ? .element.quaternaryContent : .global.white)
|
||||
.background {
|
||||
Circle()
|
||||
@@ -127,7 +127,7 @@ private struct MessageComposerReplyHeader: View {
|
||||
Spacer()
|
||||
Button(action: action) {
|
||||
Image(systemName: "xmark")
|
||||
.font(.element.caption2.weight(.medium))
|
||||
.font(.caption2.weight(.medium))
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.padding(12.0)
|
||||
}
|
||||
@@ -145,7 +145,7 @@ private struct MessageComposerEditHeader: View {
|
||||
Spacer()
|
||||
Button(action: action) {
|
||||
Image(systemName: "xmark")
|
||||
.font(.element.caption2.weight(.medium))
|
||||
.font(.caption2.weight(.medium))
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.padding(12.0)
|
||||
}
|
||||
@@ -159,7 +159,7 @@ private struct MessageComposerHeaderLabelStyle: LabelStyle {
|
||||
configuration.icon
|
||||
configuration.title
|
||||
}
|
||||
.font(.element.caption1)
|
||||
.font(.compound.bodyXS)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.lineLimit(1)
|
||||
}
|
||||
|
||||
@@ -28,7 +28,7 @@ struct RoomHeaderView: View {
|
||||
roomAvatar
|
||||
.accessibilityHidden(true)
|
||||
Text(context.viewState.roomTitle)
|
||||
.font(.element.headline)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.accessibilityIdentifier(A11yIdentifiers.roomScreen.name)
|
||||
}
|
||||
// Leading align whilst using the principal toolbar position.
|
||||
|
||||
@@ -74,7 +74,7 @@ struct RoomScreen: View {
|
||||
private var scrollToBottomButton: some View {
|
||||
Button { context.viewState.scrollToBottomPublisher.send(()) } label: {
|
||||
Image(systemName: "chevron.down")
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.fontWeight(.semibold)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.padding(13)
|
||||
@@ -132,7 +132,7 @@ struct RoomScreen: View {
|
||||
}
|
||||
} label: {
|
||||
Image(systemName: "plus.circle")
|
||||
.font(.element.title1)
|
||||
.font(.compound.headingLG)
|
||||
.foregroundColor(.element.brand)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -62,7 +62,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
|
||||
TimelineSenderAvatarView(timelineItem: timelineItem)
|
||||
.accessibilityHidden(true)
|
||||
Text(timelineItem.sender.displayName ?? timelineItem.sender.id)
|
||||
.font(.element.footnoteBold)
|
||||
.font(.compound.bodySMSemibold)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.lineLimit(1)
|
||||
.padding(.vertical, senderNameVerticalPadding)
|
||||
@@ -112,7 +112,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
|
||||
|
||||
if timelineItem.properties.isEdited {
|
||||
Text(L10n.commonEditedSuffix)
|
||||
.font(.element.caption2)
|
||||
.font(.compound.bodyXS)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -56,7 +56,7 @@ struct TimelineItemPlainStylerView<Content: View>: View {
|
||||
Spacer()
|
||||
Text(timelineItem.timestamp)
|
||||
.foregroundColor(Color.element.tertiaryContent)
|
||||
.font(.element.caption2)
|
||||
.font(.compound.bodyXS)
|
||||
}
|
||||
.padding(.top, 16)
|
||||
}
|
||||
@@ -67,7 +67,7 @@ struct TimelineItemPlainStylerView<Content: View>: View {
|
||||
VStack {
|
||||
if timelineItem.properties.isEdited {
|
||||
Text(L10n.commonEditedSuffix)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
}
|
||||
|
||||
|
||||
@@ -43,9 +43,9 @@ struct TimelineReactionButton: View {
|
||||
var label: some View {
|
||||
HStack(spacing: 4) {
|
||||
Text(reaction.key)
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
Text(String(reaction.count))
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
}
|
||||
.padding(.vertical, 6)
|
||||
|
||||
@@ -60,7 +60,7 @@ private struct CollapsibleRoomTimelineItemDisclosureGroupStyle: DisclosureGroupS
|
||||
.animation(.elementDefault, value: configuration.isExpanded)
|
||||
}
|
||||
.frame(maxWidth: .infinity)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.padding(.horizontal, 36.0)
|
||||
.padding(.top, 20.0)
|
||||
|
||||
@@ -152,7 +152,7 @@ struct FormattedBodyText: View {
|
||||
|
||||
private var blockquoteAttributes: AttributeContainer {
|
||||
var container = AttributeContainer()
|
||||
container.font = .element.subheadline
|
||||
container.font = .compound.bodyMD
|
||||
return container
|
||||
}
|
||||
}
|
||||
|
||||
@@ -24,7 +24,7 @@ struct ReadMarkerRoomTimelineView: View {
|
||||
VStack(alignment: .trailing, spacing: 2) {
|
||||
Text(L10n.roomTimelineReadMarkerTitle)
|
||||
.textCase(.uppercase)
|
||||
.font(.element.caption2Bold)
|
||||
.font(.compound.bodyXSSemibold)
|
||||
.foregroundColor(.element.quaternaryContent)
|
||||
Rectangle()
|
||||
.frame(height: 0.5)
|
||||
|
||||
@@ -21,7 +21,7 @@ struct SeparatorRoomTimelineView: View {
|
||||
|
||||
var body: some View {
|
||||
Text(timelineItem.text)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.frame(maxWidth: .infinity)
|
||||
.padding(.horizontal, 36.0)
|
||||
|
||||
@@ -21,7 +21,7 @@ struct StateRoomTimelineView: View {
|
||||
|
||||
var body: some View {
|
||||
Text(timelineItem.body)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.frame(maxWidth: .infinity, alignment: .center)
|
||||
|
||||
+1
-1
@@ -21,7 +21,7 @@ struct TimelineStartRoomTimelineView: View {
|
||||
|
||||
var body: some View {
|
||||
Text(title)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
.padding(.vertical, 24)
|
||||
.frame(maxWidth: .infinity)
|
||||
|
||||
@@ -28,7 +28,7 @@ struct UnsupportedRoomTimelineView: View {
|
||||
|
||||
Text(timelineItem.error)
|
||||
.fixedSize(horizontal: false, vertical: true)
|
||||
.font(.element.footnote)
|
||||
.font(.compound.bodySM)
|
||||
}
|
||||
} icon: {
|
||||
Image(systemName: "exclamationmark.triangle")
|
||||
|
||||
@@ -74,7 +74,7 @@ struct TimelineItemDebugView: View {
|
||||
DisclosureGroup(title, isExpanded: $isExpanded) {
|
||||
disclosureGroupContent
|
||||
}
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
.padding()
|
||||
|
||||
Divider()
|
||||
@@ -89,7 +89,7 @@ struct TimelineItemDebugView: View {
|
||||
Divider()
|
||||
|
||||
Text(text)
|
||||
.font(.element.caption1.monospaced())
|
||||
.font(.compound.bodyXS.monospaced())
|
||||
.foregroundColor(.element.primaryContent)
|
||||
}
|
||||
.frame(maxWidth: .infinity)
|
||||
|
||||
+4
@@ -49,6 +49,10 @@ struct SessionVerificationScreenViewState: BindableState {
|
||||
return L10n.commonVerificationCancelled
|
||||
}
|
||||
}
|
||||
|
||||
var titleAccessibilityIdentifier: String {
|
||||
verificationState == .verified ? A11yIdentifiers.sessionVerificationScreen.verificationComplete : ""
|
||||
}
|
||||
|
||||
var message: String {
|
||||
switch verificationState {
|
||||
|
||||
+6
-5
@@ -79,6 +79,7 @@ struct SessionVerificationScreen: View {
|
||||
.multilineTextAlignment(.center)
|
||||
.foregroundColor(.element.primaryContent)
|
||||
.padding(.bottom, 8)
|
||||
.accessibilityIdentifier(context.viewState.titleAccessibilityIdentifier)
|
||||
|
||||
Text(context.viewState.message)
|
||||
.font(.subheadline)
|
||||
@@ -156,7 +157,7 @@ struct SessionVerificationScreen: View {
|
||||
Button(L10n.screenSessionVerificationTheyDontMatch) {
|
||||
context.send(viewAction: .decline)
|
||||
}
|
||||
.font(.element.bodyBold)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.accessibilityIdentifier(A11yIdentifiers.sessionVerificationScreen.declineChallenge)
|
||||
}
|
||||
|
||||
@@ -176,7 +177,7 @@ struct SessionVerificationScreen: View {
|
||||
Button(L10n.screenSessionVerificationTheyDontMatch) {
|
||||
context.send(viewAction: .decline)
|
||||
}
|
||||
.font(.element.bodyBold)
|
||||
.font(.compound.bodyLGSemibold)
|
||||
.accessibilityIdentifier(A11yIdentifiers.sessionVerificationScreen.declineChallenge)
|
||||
.disabled(true)
|
||||
}
|
||||
@@ -203,9 +204,9 @@ struct SessionVerificationScreen: View {
|
||||
var body: some View {
|
||||
VStack(spacing: 16.0) {
|
||||
Text(emoji.symbol)
|
||||
.font(.element.largeTitleBold)
|
||||
.font(.compound.headingXLBold)
|
||||
Text(emoji.description)
|
||||
.font(.element.subheadline)
|
||||
.font(.compound.bodyMD)
|
||||
.foregroundColor(.element.secondaryContent)
|
||||
}
|
||||
.padding(8.0)
|
||||
@@ -218,7 +219,7 @@ struct SessionVerificationScreen: View {
|
||||
var body: some View {
|
||||
Image(systemName: systemName)
|
||||
.resizable()
|
||||
.font(.element.body.weight(.light))
|
||||
.font(.compound.bodyLG.weight(.light))
|
||||
.scaledToFit()
|
||||
.foregroundColor(.element.accent)
|
||||
.frame(width: 100, height: 100)
|
||||
|
||||
@@ -103,7 +103,7 @@ struct StartChatScreen: View {
|
||||
|
||||
private var noResultsContent: some View {
|
||||
Text(L10n.commonNoResults)
|
||||
.font(.element.body)
|
||||
.font(.compound.bodyLG)
|
||||
.foregroundColor(.element.tertiaryContent)
|
||||
.frame(maxWidth: .infinity)
|
||||
.listRowBackground(Color.clear)
|
||||
|
||||
Reference in New Issue
Block a user