From 9586478039fec2d39697c5b759364d83cebe522b Mon Sep 17 00:00:00 2001 From: Benoit Marty Date: Mon, 24 Aug 2026 18:58:54 +0200 Subject: [PATCH] Updates to text sizes in Chats header and Space hero Closes #7476 --- .../home/impl/components/HomeTopBar.kt | 103 ++++++++++-------- .../atomic/atoms/RoomPreviewTitleAtom.kt | 4 +- .../ui/components/SpaceHeaderRootView.kt | 2 +- .../matrix/ui/components/SpaceHeaderView.kt | 9 +- 4 files changed, 67 insertions(+), 51 deletions(-) diff --git a/features/home/impl/src/main/kotlin/io/element/android/features/home/impl/components/HomeTopBar.kt b/features/home/impl/src/main/kotlin/io/element/android/features/home/impl/components/HomeTopBar.kt index 63d28dca21..1a351be9b6 100644 --- a/features/home/impl/src/main/kotlin/io/element/android/features/home/impl/components/HomeTopBar.kt +++ b/features/home/impl/src/main/kotlin/io/element/android/features/home/impl/components/HomeTopBar.kt @@ -80,7 +80,6 @@ import io.element.android.libraries.designsystem.modifiers.backgroundVerticalGra import io.element.android.libraries.designsystem.preview.ElementPreview import io.element.android.libraries.designsystem.preview.PreviewsDayNight import io.element.android.libraries.designsystem.preview.USER_NAME_ALICE -import io.element.android.libraries.designsystem.theme.aliasScreenTitle import io.element.android.libraries.designsystem.theme.components.DropdownMenu import io.element.android.libraries.designsystem.theme.components.DropdownMenuItem import io.element.android.libraries.designsystem.theme.components.Icon @@ -141,15 +140,23 @@ fun HomeTopBar( else -> stringResource(selectedNavigationItem.labelRes) } } - HomeNavigationBarItem.Spaces -> stringResource(selectedNavigationItem.labelRes) + HomeNavigationBarItem.Spaces -> null + } + displayTitle?.let { + val style = when (spaceFiltersState) { + // Space name + is SpaceFiltersState.Selected -> ElementTheme.typography.fontHeadingSmMedium + // "Chats" + else -> ElementTheme.typography.fontHeadingLgBold + } + Text( + modifier = Modifier.semantics { + heading() + }, + style = style, + text = displayTitle, + ) } - Text( - modifier = Modifier.semantics { - heading() - }, - style = ElementTheme.typography.aliasScreenTitle, - text = displayTitle, - ) }, navigationIcon = { NavigationIcon( @@ -179,7 +186,9 @@ fun HomeTopBar( TopAppBarScrollBehaviorLayout(scrollBehavior = scrollBehavior) { RoomListFiltersView( state = filtersState, - modifier = Modifier.padding(bottom = 16.dp).padding(contentPadding) + modifier = Modifier + .padding(bottom = 16.dp) + .padding(contentPadding) ) } } @@ -348,45 +357,45 @@ private fun AccountIcon( ), contentAlignment = Alignment.Center, ) { - val avatarData by remember(matrixUser) { - derivedStateOf { - matrixUser.getAvatarData(size = AvatarSize.CurrentUserTopBar) - } + val avatarData by remember(matrixUser) { + derivedStateOf { + matrixUser.getAvatarData(size = AvatarSize.CurrentUserTopBar) } - val statusEmoji = matrixUser.displayedStatus?.toEmojiText() - val avatarModifier = if (statusEmoji != null) { - Modifier.eraseStatusEmojiBackground( - parentSize = AvatarSize.CurrentUserTopBar.dp, - layoutDirection = LocalLayoutDirection.current, - ) - } else { - Modifier - } - Avatar( - avatarData = avatarData, - avatarType = AvatarType.User, - modifier = avatarModifier, - contentDescription = if (isCurrentAccount) { - if (showAvatarIndicator) { - stringResource(CommonStrings.a11y_settings_with_required_action) - } else { - stringResource(CommonStrings.common_settings) - } - } else { - null - }, + } + val statusEmoji = matrixUser.displayedStatus?.toEmojiText() + val avatarModifier = if (statusEmoji != null) { + Modifier.eraseStatusEmojiBackground( + parentSize = AvatarSize.CurrentUserTopBar.dp, + layoutDirection = LocalLayoutDirection.current, ) - if (statusEmoji != null) { - StatusEmojiBadge( - emoji = statusEmoji, - modifier = Modifier.align(Alignment.BottomEnd), - ) - } - if (showAvatarIndicator) { - RedIndicatorAtom( - modifier = Modifier.align(Alignment.TopEnd) - ) - } + } else { + Modifier + } + Avatar( + avatarData = avatarData, + avatarType = AvatarType.User, + modifier = avatarModifier, + contentDescription = if (isCurrentAccount) { + if (showAvatarIndicator) { + stringResource(CommonStrings.a11y_settings_with_required_action) + } else { + stringResource(CommonStrings.common_settings) + } + } else { + null + }, + ) + if (statusEmoji != null) { + StatusEmojiBadge( + emoji = statusEmoji, + modifier = Modifier.align(Alignment.BottomEnd), + ) + } + if (showAvatarIndicator) { + RedIndicatorAtom( + modifier = Modifier.align(Alignment.TopEnd) + ) + } } } diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/RoomPreviewTitleAtom.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/RoomPreviewTitleAtom.kt index 740605fe88..4188827a8a 100644 --- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/RoomPreviewTitleAtom.kt +++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/RoomPreviewTitleAtom.kt @@ -10,6 +10,7 @@ package io.element.android.libraries.designsystem.atomic.atoms import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.text.TextStyle import androidx.compose.ui.text.font.FontStyle import androidx.compose.ui.text.style.TextAlign import io.element.android.compound.theme.ElementTheme @@ -20,11 +21,12 @@ fun RoomPreviewTitleAtom( title: String, modifier: Modifier = Modifier, fontStyle: FontStyle? = null, + style: TextStyle = ElementTheme.typography.fontHeadingLgBold ) { Text( modifier = modifier, text = title, - style = ElementTheme.typography.fontHeadingLgBold, + style = style, textAlign = TextAlign.Center, fontStyle = fontStyle, color = ElementTheme.colors.textPrimary, diff --git a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderRootView.kt b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderRootView.kt index 1e8fb864a7..2b5e8c6fce 100644 --- a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderRootView.kt +++ b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderRootView.kt @@ -46,7 +46,7 @@ fun SpaceHeaderRootView( ) Text( text = stringResource(CommonStrings.screen_space_list_title), - style = ElementTheme.typography.fontHeadingLgBold, + style = ElementTheme.typography.fontHeadingMdBold, color = ElementTheme.colors.textPrimary, textAlign = TextAlign.Center, ) diff --git a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderView.kt b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderView.kt index 7aee62902f..8a833cee44 100644 --- a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderView.kt +++ b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderView.kt @@ -19,6 +19,7 @@ import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.font.FontStyle import androidx.compose.ui.tooling.preview.datasource.LoremIpsum import androidx.compose.ui.unit.dp +import io.element.android.compound.theme.ElementTheme import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewAliasAtom import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewDescriptionAtom import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewTitleAtom @@ -68,11 +69,15 @@ fun SpaceHeaderView( }, title = { if (name != null) { - RoomPreviewTitleAtom(title = name) + RoomPreviewTitleAtom( + title = name, + style = ElementTheme.typography.fontHeadingMdBold, + ) } else { RoomPreviewTitleAtom( title = stringResource(id = CommonStrings.common_no_space_name), - fontStyle = FontStyle.Italic + fontStyle = FontStyle.Italic, + style = ElementTheme.typography.fontHeadingMdBold, ) } },