Merge pull request #840 from vector-im/feature/bma/cleanupText

Cleanup text

appnav/src/main/kotlin/io/element/android/appnav/room/LoadingRoomNodeView.kt

@@ -81,7 +81,7 @@ fun LoadingRoomNodeView(
                     Text(
                         text = stringResource(id = CommonStrings.error_unknown),
                         color = ElementTheme.colors.textSecondary,
-                        fontSize = 14.sp,
+                        style = ElementTheme.typography.fontBodyMdRegular,
                     )
                 } else {
                     CircularProgressIndicator()

features/analytics/impl/src/main/kotlin/io/element/android/features/analytics/impl/AnalyticsOptInView.kt

@@ -41,14 +41,11 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.analytics.api.AnalyticsOptInEvents
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMolecule
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
 import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
@@ -59,6 +56,7 @@ import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TextButton
+import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -109,7 +107,7 @@ private fun AnalyticsOptInHeader(
                 .clip(shape = RoundedCornerShape(8.dp))
                 .clickable { onClickTerms() }
                 .padding(8.dp),
-            style = ElementTextStyles.Regular.subheadline,
+            style = ElementTheme.typography.fontBodyMdRegular,
             textAlign = TextAlign.Center,
             color = MaterialTheme.colorScheme.secondary,
         )
@@ -162,7 +160,7 @@ private fun AnalyticsOptInContentRow(
         modifier = modifier
             .fillMaxWidth()
             .background(
-                color = ElementTheme.legacyColors.quinary,
+                color = ElementTheme.colors.temporaryColorBgSpecial,
                 shape = bgShape,
             )
             .padding(vertical = 12.dp, horizontal = 20.dp),
@@ -179,8 +177,7 @@ private fun AnalyticsOptInContentRow(
         Text(
             modifier = Modifier.padding(start = 16.dp),
             text = text,
-            fontSize = 14.sp,
+            style = ElementTheme.typography.fontBodyMdMedium,
-            fontWeight = FontWeight.SemiBold,
             color = MaterialTheme.colorScheme.primary,
         )
     }

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/addpeople/AddPeopleView.kt

@@ -26,11 +26,9 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.createroom.impl.R
 import io.element.android.features.createroom.impl.components.UserListView
 import io.element.android.features.createroom.impl.userlist.UserListEvents
@@ -38,10 +36,13 @@ import io.element.android.features.createroom.impl.userlist.UserListState
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TextButton
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalLayoutApi::class)
@@ -97,8 +98,7 @@ fun AddPeopleViewTopBar(
         title = {
             Text(
                 text = stringResource(id = R.string.screen_create_room_add_people_title),
-                fontSize = 16.sp,
+                style = ElementTheme.typography.aliasScreenTitle
-                fontWeight = FontWeight.SemiBold,
             )
         },
         navigationIcon = { BackButton(onClick = onBackPressed) },
@@ -110,7 +110,7 @@ fun AddPeopleViewTopBar(
                 val textActionResId = if (hasSelectedUsers) CommonStrings.action_next else CommonStrings.action_skip
                 Text(
                     text = stringResource(id = textActionResId),
-                    fontSize = 16.sp,
+                    style = ElementTheme.typography.aliasButtonText,
                 )
             }
         }

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/components/RoomPrivacyOption.kt

@@ -38,6 +38,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.RadioButton
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun RoomPrivacyOption(
@@ -70,14 +71,13 @@ fun RoomPrivacyOption(
         ) {
             Text(
                 text = roomPrivacyItem.title,
-                fontSize = 16.sp,
+                style = ElementTheme.typography.fontBodyLgRegular,
                 color = MaterialTheme.colorScheme.primary,
             )
             Spacer(Modifier.size(3.dp))
             Text(
                 text = roomPrivacyItem.description,
-                fontSize = 12.sp,
+                style = ElementTheme.typography.fontBodySmRegular,
-                lineHeight = 17.sp,
                 color = MaterialTheme.colorScheme.tertiary,
             )
         }

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/configureroom/ConfigureRoomView.kt

@@ -43,11 +43,9 @@ import androidx.compose.ui.focus.FocusManager
 import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.createroom.impl.R
 import io.element.android.features.createroom.impl.components.RoomPrivacyOption
 import io.element.android.libraries.architecture.Async
@@ -57,6 +55,8 @@ import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TextButton
@@ -65,6 +65,7 @@ import io.element.android.libraries.matrix.api.core.RoomId
 import io.element.android.libraries.matrix.ui.components.AvatarActionBottomSheet
 import io.element.android.libraries.matrix.ui.components.SelectedUsersList
 import io.element.android.libraries.matrix.ui.components.UnsavedAvatar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.coroutines.launch
 
@@ -186,8 +187,7 @@ fun ConfigureRoomToolbar(
         title = {
             Text(
                 text = stringResource(R.string.screen_create_room_title),
-                fontSize = 16.sp,
+                style = ElementTheme.typography.aliasScreenTitle,
-                fontWeight = FontWeight.SemiBold,
             )
         },
         navigationIcon = { BackButton(onClick = onBackPressed) },
@@ -199,7 +199,7 @@ fun ConfigureRoomToolbar(
             ) {
                 Text(
                     text = stringResource(CommonStrings.action_create),
-                    fontSize = 16.sp,
+                    style = ElementTheme.typography.aliasButtonText,
                 )
             }
         }

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/root/CreateRoomRootView.kt

@@ -36,11 +36,9 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.createroom.impl.R
 import io.element.android.features.createroom.impl.components.UserListView
 import io.element.android.libraries.architecture.Async
@@ -48,12 +46,14 @@ import io.element.android.libraries.designsystem.components.ProgressDialog
 import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.matrix.api.core.RoomId
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import io.element.android.libraries.designsystem.R as DrawableR
 
@@ -138,8 +138,7 @@ fun CreateRoomRootViewTopBar(
         title = {
             Text(
                 text = stringResource(id = CommonStrings.action_start_chat),
-                fontSize = 16.sp,
+                style = ElementTheme.typography.aliasScreenTitle,
-                fontWeight = FontWeight.SemiBold,
             )
         },
         navigationIcon = {
@@ -199,8 +198,7 @@ fun CreateRoomActionButton(
         )
         Text(
             text = text,
-            fontSize = 16.sp,
+            style = ElementTheme.typography.fontBodyLgRegular,
-            fontWeight = FontWeight.Normal
         )
     }
 }

features/invitelist/impl/src/main/kotlin/io/element/android/features/invitelist/impl/InviteListView.kt

@@ -42,11 +42,13 @@ import io.element.android.libraries.designsystem.components.dialogs.Confirmation
 import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.matrix.api.core.RoomId
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
@@ -124,7 +126,10 @@ fun InviteListContent(
                     BackButton(onClick = onBackClicked)
                 },
                 title = {
-                    Text(text = stringResource(CommonStrings.action_invites_list))
+                    Text(
+                        text = stringResource(CommonStrings.action_invites_list),
+                        style = ElementTheme.typography.aliasScreenTitle,
+                    )
                 }
             )
         },

features/invitelist/impl/src/main/kotlin/io/element/android/features/invitelist/impl/components/InviteSummaryRow.kt

@@ -41,20 +41,19 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.invitelist.impl.R
 import io.element.android.features.invitelist.impl.model.InviteListInviteSummary
 import io.element.android.features.invitelist.impl.model.InviteListInviteSummaryProvider
 import io.element.android.features.invitelist.impl.model.InviteSender
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.atoms.UnreadIndicatorAtom
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.OutlinedButton
 import io.element.android.libraries.designsystem.theme.components.Text
-import io.element.android.libraries.designsystem.theme.noFontPadding
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 private val minHeight = 72.dp
@@ -106,21 +105,18 @@ internal fun DefaultInviteSummaryRow(
 
             // Name
             Text(
-                fontSize = 16.sp,
-                fontWeight = FontWeight.Medium,
                 text = invite.roomName,
                 color = MaterialTheme.colorScheme.primary,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                style = noFontPadding,
+                style = ElementTheme.typography.fontBodyLgMedium,
                 modifier = Modifier.padding(end = bonusPadding),
             )
 
             // ID or Alias
             invite.roomAlias?.let {
                 Text(
-                    fontSize = 14.sp,
+                    style = ElementTheme.typography.fontBodyMdRegular,
-                    fontWeight = FontWeight.Normal,
                     text = it,
                     color = MaterialTheme.colorScheme.secondary,
                     maxLines = 1,
@@ -137,7 +133,7 @@ internal fun DefaultInviteSummaryRow(
             // CTAs
             Row(Modifier.padding(top = 12.dp)) {
                 OutlinedButton(
-                    content = { Text(stringResource(CommonStrings.action_decline), style = ElementTextStyles.Button) },
+                    content = { Text(stringResource(CommonStrings.action_decline), style = ElementTheme.typography.aliasButtonText) },
                     onClick = onDeclineClicked,
                     modifier = Modifier
                         .weight(1f)
@@ -148,7 +144,7 @@ internal fun DefaultInviteSummaryRow(
                 Spacer(modifier = Modifier.width(12.dp))
 
                 Button(
-                    content = { Text(stringResource(CommonStrings.action_accept), style = ElementTextStyles.Button) },
+                    content = { Text(stringResource(CommonStrings.action_accept), style = ElementTheme.typography.aliasButtonText) },
                     onClick = onAcceptClicked,
                     modifier = Modifier
                         .weight(1f)
@@ -188,10 +184,8 @@ private fun SenderRow(sender: InviteSender) {
                     )
                 )
             },
-            style = noFontPadding,
+            style = ElementTheme.typography.fontBodyMdRegular,
             color = MaterialTheme.colorScheme.secondary,
-            fontSize = 14.sp,
-            fontWeight = FontWeight.Normal,
         )
     }
 }

features/location/impl/src/main/kotlin/io/element/android/features/location/impl/SendLocationView.kt

@@ -36,21 +36,21 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.location.impl.map.MapView
 import io.element.android.features.location.impl.map.rememberMapState
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.BottomSheetScaffold
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import io.element.android.libraries.designsystem.R as DesignSystemR
 
@@ -95,8 +95,7 @@ fun SendLocationView(
                 title = {
                     Text(
                         text = stringResource(CommonStrings.screen_share_location_title),
-                        fontSize = 16.sp,
+                        style = ElementTheme.typography.aliasScreenTitle,
-                        fontWeight = FontWeight.SemiBold,
                     )
                 },
                 navigationIcon = {

features/location/impl/src/main/kotlin/io/element/android/features/location/impl/show/ShowLocationView.kt

@@ -39,11 +39,13 @@ import io.element.android.features.location.impl.map.rememberMapState
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.theme.compound.generated.TypographyTokens
 import io.element.android.libraries.ui.strings.CommonStrings
 
@@ -65,7 +67,7 @@ fun ShowLocationView(
                 title = {
                     Text(
                         text = stringResource(CommonStrings.screen_view_location_title),
-                        style = TypographyTokens.fontBodyLgMedium,
+                        style = ElementTheme.typography.aliasScreenTitle,
                     )
                 },
                 navigationIcon = {

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/accountprovider/AccountProviderView.kt

@@ -35,7 +35,6 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.features.login.impl.R
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtomSize
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
@@ -43,6 +42,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 /**
  * https://www.figma.com/file/o9p34zmiuEpZRyvZXJZAYL/FTUE?type=design&node-id=604-60817
@@ -86,7 +86,7 @@ fun AccountProviderView(
                         .padding(start = 16.dp)
                         .weight(1f),
                     text = item.title,
-                    style = ElementTextStyles.Regular.headline.copy(textAlign = TextAlign.Start),
+                    style = ElementTheme.typography.fontBodyLgMedium,
                     color = MaterialTheme.colorScheme.primary,
                 )
                 if (item.isPublic) {
@@ -105,7 +105,7 @@ fun AccountProviderView(
                     modifier = Modifier
                         .padding(start = 46.dp, bottom = 12.dp, end = 26.dp),
                     text = item.subtitle,
-                    style = ElementTextStyles.Regular.subheadline.copy(textAlign = TextAlign.Start),
+                    style = ElementTheme.typography.fontBodyMdRegular,
                     color = MaterialTheme.colorScheme.secondary,
                 )
             }

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/loginpassword/LoginPasswordView.kt

@@ -58,7 +58,6 @@ import io.element.android.features.login.impl.R
 import io.element.android.features.login.impl.error.isWaitListError
 import io.element.android.features.login.impl.error.loginError
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
@@ -76,6 +75,7 @@ import io.element.android.libraries.designsystem.theme.components.autofill
 import io.element.android.libraries.designsystem.theme.components.onTabOrEnterKeyFocusNext
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
@@ -186,7 +186,7 @@ internal fun LoginForm(
         Text(
             text = stringResource(R.string.screen_login_form_header),
             modifier = Modifier.padding(start = 16.dp),
-            style = ElementTextStyles.Regular.formHeader
+            style = ElementTheme.typography.fontBodyMdRegular,
         )
 
         Spacer(modifier = Modifier.height(8.dp))

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/waitlistscreen/WaitListView.kt

@@ -52,6 +52,7 @@ import io.element.android.libraries.architecture.Async
 import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -151,7 +152,7 @@ private fun WaitListContent(
             ) {
                 Text(
                     text = stringResource(CommonStrings.action_cancel),
-                    style = ElementTheme.typography.fontBodyLgMedium,
+                    style = ElementTheme.typography.aliasButtonText,
                 )
             }
         }
@@ -222,7 +223,7 @@ private fun WaitListContent(
             ) {
                 Text(
                     text = stringResource(id = CommonStrings.action_continue),
-                    style = ElementTheme.typography.fontBodyLgMedium,
+                    style = ElementTheme.typography.aliasButtonText,
                 )
             }
         }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesView.kt

@@ -79,6 +79,7 @@ import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.designsystem.utils.rememberSnackbarHostState
 import io.element.android.libraries.matrix.api.core.UserId
 import io.element.android.libraries.matrix.api.timeline.item.event.LocalEventSendState
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.collections.immutable.ImmutableList
 import timber.log.Timber
@@ -307,9 +308,8 @@ fun MessagesViewTopBar(
                 Avatar(roomAvatar)
                 Spacer(modifier = Modifier.width(8.dp))
                 Text(
-                    fontSize = 16.sp,
-                    fontWeight = FontWeight.SemiBold,
                     text = roomTitle,
+                    style = ElementTheme.typography.fontBodyLgMedium,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis
                 )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListView.kt

@@ -66,12 +66,10 @@ import io.element.android.features.messages.impl.timeline.model.event.TimelineIt
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemVideoContent
 import io.element.android.features.messages.impl.utils.messagesummary.MessageSummaryFormatterImpl
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
-import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.text.toSp
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Icon
@@ -221,7 +219,7 @@ private fun SheetContent(
 private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modifier) {
     val content: @Composable () -> Unit
     var icon: @Composable () -> Unit = { Avatar(avatarData = event.senderAvatar.copy(size = AvatarSize.MessageActionSender)) }
-    val contentStyle = ElementTextStyles.Regular.bodyMD.copy(color = MaterialTheme.colorScheme.secondary)
+    val contentStyle = ElementTheme.typography.fontBodyMdRegular.copy(color = MaterialTheme.colorScheme.secondary)
     val imageModifier = Modifier
         .size(AvatarSize.MessageActionSender.dp)
         .clip(RoundedCornerShape(9.dp))
@@ -306,7 +304,7 @@ private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modif
                 if (event.senderDisplayName != null) {
                     Text(
                         text = event.senderDisplayName,
-                        style = ElementTextStyles.Bold.caption1,
+                        style = ElementTheme.typography.fontBodySmMedium,
                         color = MaterialTheme.colorScheme.primary
                     )
                 }
@@ -316,7 +314,7 @@ private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modif
         Spacer(modifier = Modifier.width(16.dp))
         Text(
             event.sentTime,
-            style = ElementTextStyles.Regular.caption2,
+            style = ElementTheme.typography.fontBodyXsRegular,
             color = MaterialTheme.colorScheme.secondary,
             textAlign = TextAlign.End,
         )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/forward/ForwardMessagesView.kt

@@ -38,13 +38,10 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.ProgressDialog
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
@@ -54,6 +51,7 @@ import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
 import io.element.android.libraries.designsystem.components.dialogs.ErrorDialogDefaults
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.RadioButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
@@ -67,6 +65,7 @@ import io.element.android.libraries.designsystem.theme.roomListRoomName
 import io.element.android.libraries.matrix.api.core.RoomId
 import io.element.android.libraries.matrix.api.room.RoomSummaryDetails
 import io.element.android.libraries.matrix.ui.components.SelectedRoom
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.collections.immutable.ImmutableList
 
@@ -112,7 +111,12 @@ fun ForwardMessagesView(
         modifier = modifier,
         topBar = {
             TopAppBar(
-                title = { Text(stringResource(CommonStrings.common_forward_message), style = ElementTextStyles.Bold.callout) },
+                title = {
+                    Text(
+                        text = stringResource(CommonStrings.common_forward_message),
+                        style = ElementTheme.typography.aliasScreenTitle
+                    )
+                },
                 navigationIcon = {
                     BackButton(onClick = { onBackButton(state) })
                 },
@@ -248,8 +252,7 @@ internal fun RoomSummaryView(
         ) {
             // Name
             Text(
-                fontSize = 16.sp,
+                style = ElementTheme.typography.fontBodyLgRegular,
-                fontWeight = FontWeight.SemiBold,
                 text = summary.name,
                 color = MaterialTheme.roomListRoomName(),
                 maxLines = 1,
@@ -259,7 +262,7 @@ internal fun RoomSummaryView(
             Text(
                 text = roomAlias,
                 color = MaterialTheme.roomListRoomMessage(),
-                fontSize = 14.sp,
+                style = ElementTheme.typography.fontBodySmRegular,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis
             )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/media/local/LocalMediaView.kt

@@ -66,6 +66,7 @@ import io.element.android.libraries.designsystem.R
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.utils.OnLifecycleEvent
+import io.element.android.libraries.theme.ElementTheme
 import me.saket.telephoto.zoomable.ZoomSpec
 import me.saket.telephoto.zoomable.ZoomableState
 import me.saket.telephoto.zoomable.coil.ZoomableAsyncImage
@@ -238,7 +239,7 @@ fun MediaFileView(
                 Text(
                     text = info.name,
                     maxLines = 2,
-                    fontSize = 16.sp,
+                    style = ElementTheme.typography.fontBodyLgRegular,
                     overflow = TextOverflow.Ellipsis,
                     textAlign = TextAlign.Center,
                     color = MaterialTheme.colorScheme.primary
@@ -246,7 +247,7 @@ fun MediaFileView(
                 Spacer(modifier = Modifier.height(4.dp))
                 Text(
                     text = formatFileExtensionAndSize(info.fileExtension, info.formattedFileSize),
-                    fontSize = 14.sp,
+                    style = ElementTheme.typography.fontBodyMdRegular,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
                     color = MaterialTheme.colorScheme.primary

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/report/ReportMessageView.kt

@@ -38,22 +38,22 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
 import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.OutlinedTextField
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
@@ -87,8 +87,7 @@ fun ReportMessageView(
                 title = {
                     Text(
                         stringResource(CommonStrings.action_report_content),
-                        style = ElementTextStyles.Regular.callout,
+                        style = ElementTheme.typography.aliasScreenTitle,
-                        fontWeight = FontWeight.Medium,
                     )
                 },
                 navigationIcon = {
@@ -120,7 +119,7 @@ fun ReportMessageView(
             )
             Text(
                 text = stringResource(CommonStrings.report_content_explanation),
-                style = ElementTextStyles.Regular.caption1,
+                style = ElementTheme.typography.fontBodySmRegular,
                 color = MaterialTheme.colorScheme.secondary,
                 textAlign = TextAlign.Start,
                 modifier = Modifier.padding(top = 4.dp, bottom = 24.dp, start = 16.dp, end = 16.dp)
@@ -134,11 +133,11 @@ fun ReportMessageView(
                 Column(modifier = Modifier.weight(1f), verticalArrangement = Arrangement.spacedBy(4.dp)) {
                     Text(
                         text = stringResource(CommonStrings.screen_report_content_block_user),
-                        style = ElementTextStyles.Regular.callout,
+                        style = ElementTheme.typography.fontBodyLgRegular,
                     )
                     Text(
                         text = stringResource(CommonStrings.screen_report_content_block_user_hint),
-                        style = ElementTextStyles.Regular.bodyMD,
+                        style = ElementTheme.typography.fontBodyMdRegular,
                         color = MaterialTheme.colorScheme.secondary,
                     )
                 }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/EmojiPicker.kt

@@ -48,6 +48,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import kotlinx.coroutines.launch
 
 @OptIn(ExperimentalFoundationApi::class)
@@ -105,8 +106,10 @@ fun EmojiPicker(
                             ),
                         contentAlignment = Alignment.Center
                     ) {
-                        Text(text = item.unicode, fontSize = 20.sp)
+                        Text(
-                    }
+                            text = item.unicode,
+                            style = ElementTheme.typography.fontHeadingSmRegular,
+                        )                    }
                 }
             }
         }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessageEventBubble.kt

@@ -163,8 +163,8 @@ private fun ContentToPreview(state: BubbleState) {
                 contentAlignment = Alignment.Center,
             ) {
                 Text(
-                    fontSize = 10.sp,
+                    text = "${state.groupPosition.javaClass.simpleName} m:${state.isMine.to01()} h:${state.isHighlighted.to01()}",
-                    text = "${state.groupPosition.javaClass.simpleName} m:${state.isMine.to01()} h:${state.isHighlighted.to01()}"
+                    style = ElementTheme.typography.fontBodyXsRegular,
                 )
             }
         }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessagesReactionButton.kt

@@ -45,7 +45,6 @@ import io.element.android.features.messages.impl.R
 import io.element.android.features.messages.impl.timeline.model.AggregatedReaction
 import io.element.android.features.messages.impl.timeline.model.AggregatedReactionProvider
 import io.element.android.features.messages.impl.timeline.model.aTimelineItemReactions
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.text.toDp
@@ -117,7 +116,7 @@ private fun TextContent(
     modifier = modifier
         .height(reactionEmojiLineHeight.toDp()),
     text = text,
-    style = ElementTextStyles.Regular.bodyMD
+    style = ElementTheme.typography.fontBodyMdRegular,
 )
 
 @Composable
@@ -142,14 +141,17 @@ private fun ReactionContent(
 ) {
     Text(
         text = reaction.displayKey,
-        fontSize = 15.sp, lineHeight = reactionEmojiLineHeight
+        style = ElementTheme.typography.fontBodyMdRegular.copy(
+            fontSize = 15.sp,
+            lineHeight = reactionEmojiLineHeight,
+        ),
     )
     if (reaction.count > 1) {
         Spacer(modifier = Modifier.width(4.dp))
         Text(
             text = reaction.count.toString(),
             color = if (reaction.isHighlighted) MaterialTheme.colorScheme.primary else MaterialTheme.colorScheme.secondary,
-            fontSize = 14.sp,
+            style = ElementTheme.typography.fontBodyMdRegular,
         )
     }
 }
@@ -176,9 +178,11 @@ internal fun MessagesReactionExtraButtonsPreview() = ElementPreview {
             onClick = {}
         )
         MessagesReactionButton(
-            content = MessagesReactionsButtonContent.Reaction(aTimelineItemReactions().reactions.first().copy(
+            content = MessagesReactionsButtonContent.Reaction(
-                key = "A very long reaction with many characters that should be truncated"
+                aTimelineItemReactions().reactions.first().copy(
-            )),
+                    key = "A very long reaction with many characters that should be truncated"
+                )
+            ),
             onClick = {}
         )
     }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineEventTimestampView.kt

@@ -38,12 +38,12 @@ import androidx.compose.ui.unit.dp
 import io.element.android.features.messages.impl.timeline.model.TimelineItem
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContent
 import io.element.android.libraries.core.bool.orFalse
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.api.timeline.item.event.LocalEventSendState
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalFoundationApi::class)
@@ -78,14 +78,14 @@ fun TimelineEventTimestampView(
         if (isMessageEdited) {
             Text(
                 stringResource(CommonStrings.common_edited_suffix),
-                style = ElementTextStyles.Regular.caption2,
+                style = ElementTheme.typography.fontBodyXsRegular,
                 color = tint ?: MaterialTheme.colorScheme.secondary,
             )
             Spacer(modifier = Modifier.width(4.dp))
         }
         Text(
             formattedTime,
-            style = ElementTextStyles.Regular.caption2,
+            style = ElementTheme.typography.fontBodyXsRegular,
             color = tint ?: MaterialTheme.colorScheme.secondary,
         )
         if (hasMessageSendingFailed && tint != null) {

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemEventRow.kt

@@ -336,9 +336,8 @@ private fun MessageSenderInformation(
             Spacer(modifier = Modifier.width(4.dp))
             Text(
                 text = sender,
-                fontSize = 14.sp,
                 color = MaterialTheme.colorScheme.primary,
-                style = MaterialTheme.typography.titleMedium,
+                style = ElementTheme.typography.fontBodyMdMedium,
             )
         }
     }
@@ -393,7 +392,7 @@ private fun MessageEventBubbleContent(
                     onLongClick = ::onTimestampLongClick,
                     modifier = timestampModifier
                         .padding(horizontal = 4.dp, vertical = 4.dp) // Outer padding
-                        .background(ElementTheme.legacyColors.gray300, RoundedCornerShape(10.0.dp))
+                        .background(ElementTheme.colors.bgSubtleSecondary, RoundedCornerShape(10.0.dp))
                         .align(Alignment.BottomEnd)
                         .padding(horizontal = 4.dp, vertical = 2.dp) // Inner padding
                 )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemFileView.kt

@@ -75,13 +75,13 @@ fun TimelineItemFileView(
                 text = content.body,
                 color = ElementTheme.materialColors.primary,
                 maxLines = 2,
-                fontSize = 16.sp,
+                style = ElementTheme.typography.fontBodyLgRegular,
                 overflow = TextOverflow.Ellipsis
             )
             Text(
                 text = content.fileExtensionAndSize + extraPadding.getStr(12.sp),
                 color = ElementTheme.materialColors.secondary,
-                fontSize = 12.sp,
+                style = ElementTheme.typography.fontBodySmRegular,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
             )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemInformativeView.kt

@@ -35,6 +35,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun TimelineItemInformativeView(
@@ -58,7 +59,7 @@ fun TimelineItemInformativeView(
         Text(
             fontStyle = FontStyle.Italic,
             color = MaterialTheme.colorScheme.secondary,
-            fontSize = 14.sp,
+            style = ElementTheme.typography.fontBodyMdRegular,
             text = text + extraPadding.getStr(14.sp)
         )
     }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemStateView.kt

@@ -21,12 +21,12 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.sp
 import io.element.android.features.messages.impl.timeline.model.event.TimelineItemStateContent
 import io.element.android.features.messages.impl.timeline.model.event.aTimelineItemStateEventContent
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun TimelineItemStateView(
@@ -36,7 +36,7 @@ fun TimelineItemStateView(
     Text(
         modifier = modifier,
         color = MaterialTheme.colorScheme.secondary,
-        fontSize = 13.sp,
+        style = ElementTheme.typography.fontBodyMdRegular,
         text = content.body,
         textAlign = TextAlign.Center,
     )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/group/GroupHeaderView.kt

@@ -41,6 +41,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 private val CORNER_RADIUS = 8.dp
 
@@ -76,7 +77,7 @@ fun GroupHeaderView(
                 Text(
                     text = text,
                     color = MaterialTheme.colorScheme.secondary,
-                    fontSize = 13.sp
+                    style = ElementTheme.typography.fontBodyMdRegular,
                 )
                 val icon = if (isExpanded) {
                     Icons.Default.ExpandLess

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/retrysendmenu/RetrySendMessageMenu.kt

@@ -35,11 +35,12 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
+import io.element.android.features.messages.impl.R
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
-import io.element.android.libraries.designsystem.theme.components.Text
-import io.element.android.features.messages.impl.R
 import io.element.android.libraries.designsystem.theme.components.ModalBottomSheet
+import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import kotlinx.coroutines.launch
 
 @Composable
@@ -112,11 +113,17 @@ private fun ColumnScope.RetrySendMenuContents(
     val coroutineScope = rememberCoroutineScope()
 
     ListItem(headlineContent = {
-        Text(stringResource(R.string.screen_room_retry_send_menu_title), fontWeight = FontWeight.Medium)
+        Text(
+            text = stringResource(R.string.screen_room_retry_send_menu_title),
+            style = ElementTheme.typography.fontBodyLgMedium,
+        )
     })
     ListItem(
         headlineContent = {
-            Text(stringResource(R.string.screen_room_retry_send_menu_send_again_action))
+            Text(
+                text = stringResource(R.string.screen_room_retry_send_menu_send_again_action),
+                style = ElementTheme.typography.fontBodyLgRegular,
+            )
         },
         modifier = Modifier.clickable {
             coroutineScope.launch {
@@ -127,7 +134,10 @@ private fun ColumnScope.RetrySendMenuContents(
     )
     ListItem(
         headlineContent = {
-            Text(stringResource(R.string.screen_room_retry_send_menu_remove_action))
+            Text(
+                text = stringResource(R.string.screen_room_retry_send_menu_remove_action),
+                style = ElementTheme.typography.fontBodyLgRegular,
+            )
         },
         colors = ListItemDefaults.colors(headlineColor = MaterialTheme.colorScheme.error),
         modifier = Modifier.clickable {

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/virtual/TimelineItemDaySeparatorView.kt

@@ -33,6 +33,7 @@ import io.element.android.features.messages.impl.timeline.model.virtual.Timeline
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 internal fun TimelineItemDaySeparatorView(
@@ -48,7 +49,7 @@ internal fun TimelineItemDaySeparatorView(
     ) {
         Text(
             text = model.formattedDate,
-            style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.Medium),
+            style = ElementTheme.typography.fontBodyMdMedium,
             color = MaterialTheme.colorScheme.primary,
         )
     }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/debug/EventDebugInfoView.kt

@@ -18,7 +18,6 @@ package io.element.android.features.messages.impl.timeline.debug
 
 import android.content.ClipData
 import android.content.ClipboardManager
-import android.content.Context
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.expandVertically
 import androidx.compose.animation.shrinkVertically
@@ -52,16 +51,17 @@ import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import androidx.core.content.getSystemService
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.matrix.api.core.EventId
+import io.element.android.libraries.theme.ElementTheme
 
 /**
  * Screen used to display debug info for events.
@@ -83,18 +83,22 @@ fun EventDebugInfoView(
         topBar = {
             TopAppBar(
                 title = {
-                    Text("Debug event info")
+                    Text(
+                        text = "Debug event info",
+                        style = ElementTheme.typography.aliasScreenTitle,
+                    )
                 },
                 navigationIcon = { BackButton(onClick = onBackPressed) }
             )
         },
         modifier = modifier
     ) { padding ->
-        LazyColumn(modifier = Modifier
+        LazyColumn(
-            .fillMaxWidth()
+            modifier = Modifier
-            .padding(padding) // Window insets
+                .fillMaxWidth()
-            .consumeWindowInsets(padding)
+                .padding(padding) // Window insets
-            .padding(horizontal = 16.dp) // Internal padding
+                .consumeWindowInsets(padding)
+                .padding(horizontal = 16.dp) // Internal padding
         ) {
             item {
                 Column(Modifier.padding(vertical = 10.dp), verticalArrangement = Arrangement.spacedBy(6.dp)) {
@@ -161,7 +165,11 @@ private fun CopyableText(
             .padding(6.dp)
             .clickable { clipboardManager.setPrimaryClip(ClipData.newPlainText("JSON", text)) }
     ) {
-        Text(text = text, fontFamily = FontFamily.Monospace, fontSize = 14.sp, modifier = Modifier.padding(8.dp))
+        Text(
+            text = text,
+            style = ElementTheme.typography.fontBodyMdRegular.copy(fontFamily = FontFamily.Monospace),
+            modifier = Modifier.padding(8.dp),
+        )
     }
 }
 

features/networkmonitor/api/src/main/kotlin/io/element/android/features/networkmonitor/api/ui/ConnectivityIndicatorView.kt

@@ -45,9 +45,9 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
@@ -98,7 +98,7 @@ private fun Indicator(modifier: Modifier = Modifier) {
         Spacer(modifier = Modifier.width(8.dp))
         Text(
             text = stringResource(CommonStrings.common_offline),
-            style = ElementTextStyles.Regular.bodyMD.copy(fontWeight = FontWeight.Medium),
+            style = ElementTheme.typography.fontBodyMdMedium,
             color = tint,
         )
     }

features/onboarding/impl/src/main/kotlin/io/element/android/features/onboarding/impl/OnBoardingView.kt

@@ -44,6 +44,7 @@ import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMo
 import io.element.android.libraries.designsystem.atomic.pages.OnBoardingPage
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.OutlinedButton
@@ -166,7 +167,7 @@ private fun OnBoardingButtons(
                 Spacer(Modifier.width(14.dp))
                 Text(
                     text = stringResource(id = R.string.screen_onboarding_sign_in_with_qr_code),
-                    style = ElementTheme.typography.fontBodyLgMedium,
+                    style = ElementTheme.typography.aliasButtonText,
                 )
             }
         }
@@ -179,7 +180,7 @@ private fun OnBoardingButtons(
         ) {
             Text(
                 text = stringResource(id = signInButtonStringRes),
-                style = ElementTheme.typography.fontBodyLgMedium,
+                style = ElementTheme.typography.aliasButtonText,
             )
         }
         if (state.canCreateAccount) {
@@ -191,7 +192,7 @@ private fun OnBoardingButtons(
             ) {
                 Text(
                     text = stringResource(id = R.string.screen_onboarding_sign_up),
-                    style = ElementTheme.typography.fontBodyLgMedium,
+                    style = ElementTheme.typography.aliasButtonText,
                 )
             }
         }

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/RoomDetailsView.kt

@@ -57,7 +57,6 @@ import io.element.android.features.roomdetails.impl.blockuser.BlockUserDialogs
 import io.element.android.features.roomdetails.impl.blockuser.BlockUserSection
 import io.element.android.features.roomdetails.impl.members.details.RoomMemberHeaderSection
 import io.element.android.features.roomdetails.impl.members.details.RoomMemberMainActionsSection
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
@@ -77,6 +76,7 @@ import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.matrix.api.room.RoomMember
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalLayoutApi::class)
@@ -234,10 +234,10 @@ internal fun RoomHeaderSection(
             )
         }
         Spacer(modifier = Modifier.height(24.dp))
-        Text(roomName, style = ElementTextStyles.Bold.title1)
+        Text(roomName, style = ElementTheme.typography.fontHeadingLgBold)
         if (roomAlias != null) {
             Spacer(modifier = Modifier.height(6.dp))
-            Text(roomAlias, style = ElementTextStyles.Regular.body, color = MaterialTheme.colorScheme.secondary)
+            Text(roomAlias, style = ElementTheme.typography.fontBodyLgRegular, color = MaterialTheme.colorScheme.secondary)
         }
         Spacer(Modifier.height(32.dp))
     }

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/edit/RoomDetailsEditView.kt

@@ -52,11 +52,9 @@ import androidx.compose.ui.focus.FocusManager
 import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.roomdetails.impl.R
 import io.element.android.libraries.architecture.Async
 import io.element.android.libraries.designsystem.components.LabelledTextField
@@ -68,6 +66,8 @@ import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -75,6 +75,7 @@ import io.element.android.libraries.designsystem.theme.components.TextButton
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.matrix.ui.components.AvatarActionBottomSheet
 import io.element.android.libraries.matrix.ui.components.UnsavedAvatar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.coroutines.launch
 
@@ -106,8 +107,7 @@ fun RoomDetailsEditView(
                 title = {
                     Text(
                         text = stringResource(id = R.string.screen_room_details_edit_room_title),
-                        fontSize = 16.sp,
+                        style = ElementTheme.typography.aliasScreenTitle,
-                        fontWeight = FontWeight.SemiBold,
                     )
                 },
                 navigationIcon = { BackButton(onClick = onBackPressed) },
@@ -121,7 +121,7 @@ fun RoomDetailsEditView(
                     ) {
                         Text(
                             text = stringResource(CommonStrings.action_save),
-                            fontSize = 16.sp,
+                            style = ElementTheme.typography.aliasButtonText,
                         )
                     }
                 }
@@ -264,8 +264,7 @@ private fun LabelledReadOnlyField(
     ) {
         Text(
             modifier = Modifier.padding(horizontal = 16.dp),
-            style = MaterialTheme.typography.titleSmall,
+            style = ElementTheme.typography.fontBodyMdRegular,
-            fontWeight = FontWeight.Normal,
             color = MaterialTheme.colorScheme.primary,
             text = title,
         )

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/invite/RoomInviteMembersView.kt

@@ -29,16 +29,15 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.roomdetails.impl.R
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.SearchBar
@@ -52,6 +51,7 @@ import io.element.android.libraries.matrix.ui.components.CheckableUserRow
 import io.element.android.libraries.matrix.ui.components.SelectedUsersList
 import io.element.android.libraries.matrix.ui.model.getAvatarData
 import io.element.android.libraries.matrix.ui.model.getBestName
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.collections.immutable.ImmutableList
 
@@ -122,8 +122,7 @@ fun RoomInviteMembersTopBar(
         title = {
             Text(
                 text = stringResource(R.string.screen_room_details_invite_people_title),
-                fontSize = 16.sp,
+                style = ElementTheme.typography.aliasScreenTitle,
-                fontWeight = FontWeight.SemiBold,
             )
         },
         navigationIcon = { BackButton(onClick = onBackPressed) },
@@ -174,8 +173,8 @@ private fun RoomInviteMembersSearchBar(
         resultState = state,
         resultHandler = { results ->
             Text(
-                text = "Search results",
+                text = stringResource(id = CommonStrings.common_search_results),
-                fontWeight = FontWeight.Medium,
+                style = ElementTheme.typography.fontBodyLgMedium,
                 modifier = Modifier
                     .fillMaxWidth()
                     .padding(start = 16.dp, top = 12.dp, end = 16.dp, bottom = 8.dp)

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/RoomMemberListView.kt

@@ -36,19 +36,17 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.pluralStringResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.roomdetails.impl.R
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.SearchBar
@@ -60,6 +58,7 @@ import io.element.android.libraries.matrix.api.core.UserId
 import io.element.android.libraries.matrix.api.room.RoomMember
 import io.element.android.libraries.matrix.api.user.MatrixUser
 import io.element.android.libraries.matrix.ui.components.MatrixUserRow
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import kotlinx.collections.immutable.ImmutableList
 
@@ -163,10 +162,8 @@ private fun LazyListScope.roomMemberListSection(
         Text(
             modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp),
             text = headerText(),
-            fontSize = 16.sp,
+            style = ElementTheme.typography.fontBodyLgRegular,
-            style = ElementTextStyles.Regular.callout,
             color = MaterialTheme.colorScheme.secondary,
-            textAlign = TextAlign.Start,
         )
     }
     items(members) { matrixUser ->
@@ -208,8 +205,7 @@ private fun RoomMemberListTopBar(
         title = {
             Text(
                 text = stringResource(R.string.screen_room_details_people_title),
-                fontSize = 16.sp,
+                style = ElementTheme.typography.aliasScreenTitle,
-                fontWeight = FontWeight.SemiBold,
             )
         },
         navigationIcon = { BackButton(onClick = onBackPressed) },
@@ -221,7 +217,7 @@ private fun RoomMemberListTopBar(
                 ) {
                     Text(
                         text = stringResource(CommonStrings.action_invite),
-                        fontSize = 16.sp,
+                        style = ElementTheme.typography.aliasButtonText,
                     )
                 }
             }

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/details/RoomMemberDetailsView.kt

@@ -43,7 +43,6 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.features.roomdetails.impl.blockuser.BlockUserDialogs
 import io.element.android.features.roomdetails.impl.blockuser.BlockUserSection
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
@@ -57,6 +56,7 @@ import io.element.android.libraries.designsystem.preview.LargeHeightPreview
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
@@ -118,10 +118,10 @@ internal fun RoomMemberHeaderSection(
         }
         Spacer(modifier = Modifier.height(24.dp))
         if (userName != null) {
-            Text(userName, style = ElementTextStyles.Bold.title1)
+            Text(userName, style = ElementTheme.typography.fontHeadingLgBold)
             Spacer(modifier = Modifier.height(6.dp))
         }
-        Text(userId, style = ElementTextStyles.Regular.body, color = MaterialTheme.colorScheme.secondary)
+        Text(userId, style = ElementTheme.typography.fontBodyLgRegular, color = MaterialTheme.colorScheme.secondary)
         Spacer(Modifier.height(40.dp))
     }
 }

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/RoomListContextMenu.kt

@@ -40,6 +40,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.ModalBottomSheet
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.api.core.RoomId
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -79,13 +80,16 @@ private fun RoomListModalBottomSheetContent(
             headlineContent = {
                 Text(
                     text = contextMenu.roomName,
-                    fontWeight = FontWeight.Bold,
+                    style = ElementTheme.typography.fontBodyLgMedium,
                 )
             }
         )
         ListItem(
             headlineContent = {
-                Text(text = stringResource(id = CommonStrings.common_settings))
+                Text(
+                    text = stringResource(id = CommonStrings.common_settings),
+                    style = MaterialTheme.typography.bodyLarge,
+                )
             },
             modifier = Modifier.clickable { onRoomSettingsClicked(contextMenu.roomId) },
             leadingContent = {
@@ -102,6 +106,7 @@ private fun RoomListModalBottomSheetContent(
                 Text(
                     text = stringResource(id = CommonStrings.action_leave_room),
                     color = MaterialTheme.colorScheme.error,
+                    style = MaterialTheme.typography.bodyLarge,
                 )
             },
             modifier = Modifier.clickable { onLeaveRoomClicked(contextMenu.roomId) },

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/components/RequestVerificationHeader.kt

@@ -35,13 +35,14 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.features.roomlist.impl.R
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
@@ -65,7 +66,7 @@ internal fun RequestVerificationHeader(
                     Text(
                         stringResource(R.string.session_verification_banner_title),
                         modifier = Modifier.weight(1f),
-                        style = ElementTextStyles.Bold.body,
+                        style = ElementTheme.typography.fontBodyLgMedium,
                         color = MaterialTheme.colorScheme.primary,
                         textAlign = TextAlign.Start,
                     )
@@ -78,7 +79,7 @@ internal fun RequestVerificationHeader(
                 Spacer(modifier = Modifier.height(4.dp))
                 Text(
                     stringResource(R.string.session_verification_banner_message),
-                    style = ElementTextStyles.Regular.bodyMD
+                    style = ElementTheme.typography.fontBodyMdRegular,
                 )
                 Spacer(modifier = Modifier.height(12.dp))
                 Button(
@@ -88,7 +89,7 @@ internal fun RequestVerificationHeader(
                 ) {
                     Text(
                         stringResource(CommonStrings.action_continue),
-                        style = ElementTextStyles.Button
+                        style = ElementTheme.typography.aliasButtonText
                     )
                 }
             }

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/components/RoomListTopBar.kt

@@ -24,7 +24,6 @@ import androidx.compose.material.icons.filled.Search
 import androidx.compose.material.icons.outlined.BugReport
 import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.TopAppBarScrollBehavior
 import androidx.compose.material3.rememberTopAppBarState
@@ -37,15 +36,14 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.features.roomlist.impl.R
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+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.DropdownMenuItemText
@@ -113,10 +111,12 @@ private fun DefaultRoomListTopBar(
         modifier = modifier
             .nestedScroll(scrollBehavior.nestedScrollConnection),
         title = {
-            val fontSize = if (scrollBehavior.state.collapsedFraction > 0.5) 20.sp else 22.sp
+            val fontStyle = if (scrollBehavior.state.collapsedFraction > 0.5)
+                ElementTheme.typography.aliasScreenTitle
+            else
+                ElementTheme.typography.fontHeadingLgBold
             Text(
-                fontWeight = FontWeight.Bold,
+                style = fontStyle,
-                style = MaterialTheme.typography.headlineMedium.copy(fontSize = fontSize),
                 text = stringResource(id = R.string.screen_roomlist_main_space_title)
             )
         },

features/verifysession/impl/src/main/kotlin/io/element/android/features/verifysession/impl/VerifySelfSessionView.kt

@@ -41,16 +41,17 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import io.element.android.libraries.architecture.Async
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMolecule
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
 import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
 import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasButtonText
 import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.api.verification.VerificationEmoji
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 import io.element.android.features.verifysession.impl.VerifySelfSessionState.VerificationStep as FlowStep
 
@@ -158,11 +159,14 @@ internal fun ContentVerifying(verificationFlowStep: FlowStep.Verifying, modifier
 @Composable
 internal fun EmojiItemView(emoji: VerificationEmoji, modifier: Modifier = Modifier) {
     Column(horizontalAlignment = Alignment.CenterHorizontally, modifier = modifier) {
-        Text(emoji.code, fontSize = 34.sp)
+        Text(
+            text = emoji.code,
+            style = ElementTheme.typography.fontBodyMdRegular.copy(fontSize = 34.sp),
+        )
         Spacer(modifier = Modifier.height(16.dp))
         Text(
             emoji.name,
-            style = ElementTextStyles.Regular.bodyMD,
+            style = ElementTheme.typography.fontBodyMdRegular,
             color = MaterialTheme.colorScheme.secondary,
             maxLines = 1,
             overflow = TextOverflow.Ellipsis,
@@ -227,7 +231,10 @@ internal fun BottomMenu(screenState: VerifySelfSessionState, goBack: () -> Unit)
                 onClick = negativeButtonCallback,
                 enabled = negativeButtonEnabled,
             ) {
-                Text(stringResource(negativeButtonTitle), fontSize = 16.sp)
+                Text(
+                    text = stringResource(negativeButtonTitle),
+                    style = ElementTheme.typography.aliasButtonText,
+                )
             }
         }
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/ElementTextStyles.kt

@@ -1,234 +0,0 @@
-/*
- * Copyright (c) 2023 New Vector Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-package io.element.android.libraries.designsystem
-
-import androidx.compose.ui.text.PlatformTextStyle
-import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.FontStyle
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.sp
-
-// TODO Remove
-object ElementTextStyles {
-
-    @Suppress("DEPRECATION")
-    val Button = TextStyle(
-        fontSize = 16.sp,
-        fontWeight = FontWeight.Medium,
-        lineHeight = 22.sp,
-        fontStyle = FontStyle.Normal,
-        textAlign = TextAlign.Center,
-        platformStyle = PlatformTextStyle(includeFontPadding = false)
-    )
-
-    object Bold {
-        val largeTitle = TextStyle(
-            fontSize = 34.sp,
-            fontWeight = FontWeight.Bold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 41.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title1 = TextStyle(
-            fontSize = 28.sp,
-            fontWeight = FontWeight.Bold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 34.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title2 = TextStyle(
-            fontSize = 22.sp,
-            fontWeight = FontWeight.Bold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 28.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title3 = TextStyle(
-            fontSize = 20.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 25.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val headline = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val body = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val callout = TextStyle(
-            fontSize = 16.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 21.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val subheadline = TextStyle(
-            fontSize = 15.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val footnote = TextStyle(
-            fontSize = 13.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 18.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption1 = TextStyle(
-            fontSize = 12.sp,
-            fontWeight = FontWeight.Medium,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 16.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption2 = TextStyle(
-            fontSize = 11.sp,
-            fontWeight = FontWeight.Medium,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 13.sp,
-            textAlign = TextAlign.Center
-        )
-    }
-
-    object Regular {
-        val largeTitle = TextStyle(
-            fontSize = 34.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 41.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title1 = TextStyle(
-            fontSize = 28.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 34.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title2 = TextStyle(
-            fontSize = 22.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 28.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val title3 = TextStyle(
-            fontSize = 20.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 25.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val headline = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val body = TextStyle(
-            fontSize = 17.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 22.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val callout = TextStyle(
-            fontSize = 16.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 21.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val subheadline = TextStyle(
-            fontSize = 15.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val formHeader = TextStyle(
-            fontSize = 14.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Start
-        )
-
-        val bodyMD = TextStyle(
-            fontSize = 14.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 20.sp,
-            textAlign = TextAlign.Start
-        )
-
-        val footnote = TextStyle(
-            fontSize = 13.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 18.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption1 = TextStyle(
-            fontSize = 12.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 16.sp,
-            textAlign = TextAlign.Center
-        )
-
-        val caption2 = TextStyle(
-            fontSize = 11.sp,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            lineHeight = 13.sp,
-            textAlign = TextAlign.Center
-        )
-    }
-}

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/RoundedIconAtom.kt

@@ -36,6 +36,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
 import io.element.android.libraries.theme.ElementTheme
 
 /**
@@ -59,7 +60,7 @@ fun RoundedIconAtom(
         modifier = modifier
             .size(size.toContainerSize())
             .background(
-                color = ElementTheme.legacyColors.quinary,
+                color = ElementTheme.colors.temporaryColorBgSpecial,
                 shape = RoundedCornerShape(size.toCornerSize())
             )
     ) {

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/molecules/IconTitleSubtitleMolecule.kt

@@ -29,13 +29,13 @@ import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.R
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtomSize
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 /**
  * IconTitleSubtitleMolecule is a molecule which displays an icon, a title and a subtitle.
@@ -71,7 +71,7 @@ fun IconTitleSubtitleMolecule(
             modifier = Modifier
                 .fillMaxWidth(),
             textAlign = TextAlign.Center,
-            style = ElementTextStyles.Bold.title2,
+            style = ElementTheme.typography.fontHeadingMdBold,
             color = MaterialTheme.colorScheme.primary,
         )
         Spacer(Modifier.height(8.dp))
@@ -79,7 +79,7 @@ fun IconTitleSubtitleMolecule(
             text = subTitle,
             modifier = Modifier.fillMaxWidth(),
             textAlign = TextAlign.Center,
-            style = ElementTextStyles.Regular.subheadline,
+            style = ElementTheme.typography.fontBodyMdRegular,
             color = MaterialTheme.colorScheme.secondary,
         )
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/LabelledTextField.kt

@@ -23,13 +23,13 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TextField
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun LabelledTextField(
@@ -47,8 +47,7 @@ fun LabelledTextField(
     ) {
         Text(
             modifier = Modifier.padding(horizontal = 16.dp),
-            style = MaterialTheme.typography.titleSmall,
+            style = ElementTheme.typography.fontBodyMdRegular,
-            fontWeight = FontWeight.Normal,
             color = MaterialTheme.colorScheme.primary,
             text = label
         )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt

@@ -94,7 +94,7 @@ private fun InitialsAvatar(
         Text(
             modifier = Modifier.align(Alignment.Center),
             text = avatarData.initial,
-            fontSize = avatarData.size.dp.toSp() / 2,
+            style = ElementTheme.typography.fontBodyMdRegular.copy(fontSize = avatarData.size.dp.toSp() / 2),
             color = Color.White,
         )
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/ButtonWithProgress.kt

@@ -32,13 +32,14 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.theme.aliasButtonText
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
 import io.element.android.libraries.designsystem.theme.components.ElementButtonDefaults
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 /**
  * A component that will display a button with an indeterminate circular progressbar.
@@ -64,7 +65,9 @@ fun ButtonWithProgress(
 ) {
     Button(
         onClick = {
-            if (!showProgress) { onClick() }
+            if (!showProgress) {
+                onClick()
+            }
         },
         modifier = modifier,
         enabled = enabled,
@@ -85,10 +88,10 @@ fun ButtonWithProgress(
             )
             if (progressText != null) {
                 Spacer(Modifier.width(10.dp))
-                Text(progressText, style = ElementTextStyles.Button)
+                Text(progressText, style = ElementTheme.typography.aliasButtonText)
             }
         } else if (text != null) {
-            Text(text, style = ElementTextStyles.Button)
+            Text(text, style = ElementTheme.typography.aliasButtonText)
         }
     }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/MainActionButton.kt

@@ -33,14 +33,13 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun MainActionButton(
@@ -71,7 +70,7 @@ fun MainActionButton(
         Spacer(modifier = Modifier.height(14.dp))
         Text(
             title,
-            style = ElementTextStyles.Regular.bodyMD.copy(fontWeight = FontWeight.Medium),
+            style = ElementTheme.typography.fontBodyMdMedium,
             color = tintColor,
         )
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/AlertDialogContent.kt

@@ -38,8 +38,8 @@ import androidx.compose.ui.layout.Layout
 import androidx.compose.ui.layout.Placeable
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import kotlin.math.max
 
 @Composable
@@ -72,24 +72,26 @@ internal fun SimpleAlertDialogContent(
                     // If there is a 3rd item it should be at the end of the dialog
                     // Having this 3rd action is discouraged, see https://m3.material.io/components/dialogs/guidelines#e13b68f5-e367-4275-ad6f-c552ee8e358f
                     TextButton(onClick = onThirdButtonClicked) {
-                        Text(thirdButtonText)
+                        Text(
+                            text = thirdButtonText,
+                            style = ElementTheme.typography.fontBodyMdRegular,
+                        )
                     }
                 }
                 TextButton(onClick = onCancelClicked) {
-                    Text(cancelText)
+                    Text(
+                        text = cancelText,
+                        style = ElementTheme.typography.fontBodyMdRegular,
+                    )
                 }
                 if (submitText != null) {
-                    TextButton(
+                    TextButton(onClick = onSubmitClicked) {
-                        onClick = {
-                            onSubmitClicked()
-                        },
-                    ) {
                         Text(
-                            submitText,
+                            text = submitText,
                             style = if (emphasizeSubmitButton) {
-                                ElementTextStyles.Bold.subheadline
+                                ElementTheme.typography.fontBodyMdMedium
                             } else {
-                                MaterialTheme.typography.labelLarge
+                                ElementTheme.typography.fontBodyMdRegular
                             }
                         )
                     }
@@ -98,10 +100,18 @@ internal fun SimpleAlertDialogContent(
         },
         modifier = modifier,
         title = {
-            if (title != null) { Text(text = title) }
+            if (title != null) {
+                Text(
+                    text = title,
+                    style = ElementTheme.typography.fontHeadingSmRegular,
+                )
+            }
         },
         text = {
-            Text(content)
+            Text(
+                text = content,
+                style = ElementTheme.typography.fontBodyMdRegular,
+            )
         },
         shape = shape,
         containerColor = containerColor,

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/RetryDialog.kt

@@ -29,6 +29,7 @@ import androidx.compose.ui.unit.Dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
@@ -51,19 +52,31 @@ fun RetryDialog(
         modifier = modifier,
         onDismissRequest = onDismiss,
         title = {
-            Text(title)
+            Text(
+                text = title,
+                style = ElementTheme.typography.fontHeadingSmRegular,
+            )
         },
         text = {
-            Text(content)
+            Text(
+                text = content,
+                style = ElementTheme.typography.fontBodyMdRegular,
+            )
         },
         confirmButton = {
             TextButton(onClick = onRetry) {
-                Text(retryText)
+                Text(
+                    text = retryText,
+                    style = ElementTheme.typography.fontBodyMdRegular,
+                )
             }
         },
         dismissButton = {
             TextButton(onClick = onDismiss) {
-                Text(dismissText)
+                Text(
+                    text = dismissText,
+                    style = ElementTheme.typography.fontBodyMdRegular,
+                )
             }
         },
         shape = shape,

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceScreen.kt

@@ -39,6 +39,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
+import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
@@ -94,7 +95,7 @@ fun PreferenceTopAppBar(
         title = {
             Text(
                 text = title,
-                style = ElementTheme.typography.fontHeadingSmMedium,
+                style = ElementTheme.typography.aliasScreenTitle,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis
             )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/ColorAliases.kt

@@ -65,6 +65,10 @@ val SemanticColors.messageFromOtherBackground
         Color(0xFF26282D)
     }
 
+// Temporary color, which is not in the token right now
+val SemanticColors.temporaryColorBgSpecial
+    get() = if (isLight) Color(0xFFE4E8F0) else Color(0xFF3A4048)
+
 @Preview
 @Composable
 internal fun ColorAliasesLightPreview() = ElementPreviewLight { ContentToPreview() }
@@ -86,6 +90,7 @@ private fun ContentToPreview() {
             "placeholderBackground" to ElementTheme.colors.placeholderBackground,
             "messageFromMeBackground" to ElementTheme.colors.messageFromMeBackground,
             "messageFromOtherBackground" to ElementTheme.colors.messageFromOtherBackground,
+            "temporaryColorBgSpecial" to ElementTheme.colors.temporaryColorBgSpecial,
         )
     )
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/TypographyAliases.kt

@@ -0,0 +1,30 @@
+/*
+ * Copyright (c) 2023 New Vector Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package io.element.android.libraries.designsystem.theme
+
+import androidx.compose.ui.text.TextStyle
+import io.element.android.libraries.theme.compound.generated.TypographyTokens
+
+/*
+ * This file contains aliases for TypographyTokens.
+ */
+
+val TypographyTokens.aliasScreenTitle: TextStyle
+    get() = fontHeadingSmMedium
+
+val TypographyTokens.aliasButtonText: TextStyle
+    get() = fontBodyLgMedium

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/SearchBar.kt

@@ -156,10 +156,10 @@ object ElementSearchBarDefaults {
     @OptIn(ExperimentalMaterial3Api::class)
     @Composable
     fun inactiveColors() = SearchBarDefaults.colors(
-        containerColor = ElementTheme.legacyColors.gray300,
+        containerColor = ElementTheme.materialColors.surfaceVariant,
         inputFieldColors = TextFieldDefaults.colors(
-            unfocusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
+            unfocusedPlaceholderColor = ElementTheme.colors.textDisabled,
-            focusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
+            focusedPlaceholderColor = ElementTheme.colors.textDisabled,
             unfocusedLeadingIconColor = MaterialTheme.colorScheme.primary,
             focusedLeadingIconColor = MaterialTheme.colorScheme.primary,
             unfocusedTrailingIconColor = MaterialTheme.colorScheme.primary,
@@ -172,8 +172,8 @@ object ElementSearchBarDefaults {
     fun activeColors() = SearchBarDefaults.colors(
         containerColor = Color.Transparent,
         inputFieldColors = TextFieldDefaults.colors(
-            unfocusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
+            unfocusedPlaceholderColor = ElementTheme.colors.textDisabled,
-            focusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
+            focusedPlaceholderColor = ElementTheme.colors.textDisabled,
             unfocusedLeadingIconColor = MaterialTheme.colorScheme.primary,
             focusedLeadingIconColor = MaterialTheme.colorScheme.primary,
             unfocusedTrailingIconColor = MaterialTheme.colorScheme.primary,
@@ -243,19 +243,28 @@ internal fun SearchBarPreviewActiveWithContent() = ElementThemedPreview {
         active = true,
         resultState = SearchBarResultState.Results("result!"),
         contentPrefix = {
-            Text(text = "Content that goes before the search results", modifier = Modifier
+            Text(
-                .background(color = Color.Red)
+                text = "Content that goes before the search results",
-                .fillMaxWidth())
+                modifier = Modifier
+                    .background(color = Color.Red)
+                    .fillMaxWidth()
+            )
         },
         contentSuffix = {
-            Text(text = "Content that goes after the search results", modifier = Modifier
+            Text(
-                .background(color = Color.Blue)
+                text = "Content that goes after the search results",
-                .fillMaxWidth())
+                modifier = Modifier
+                    .background(color = Color.Blue)
+                    .fillMaxWidth()
+            )
         },
         resultHandler = {
-            Text(text = "Results go here", modifier = Modifier
+            Text(
-                .background(color = Color.Green)
+                text = "Results go here",
-                .fillMaxWidth())
+                modifier = Modifier
+                    .background(color = Color.Green)
+                    .fillMaxWidth()
+            )
         }
     )
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/Text.kt

@@ -56,19 +56,9 @@ fun Text(
     text: String,
     modifier: Modifier = Modifier,
     color: Color = Color.Unspecified,
-    // Will be removed, only style should be used
-    fontSize: TextUnit = TextUnit.Unspecified,
     fontStyle: FontStyle? = null,
-    // Will be removed, only style should be used
-    fontWeight: FontWeight? = null,
-    // Will be removed, only style should be used
-    fontFamily: FontFamily? = null,
-    // Will be removed, only style should be used
-    letterSpacing: TextUnit = TextUnit.Unspecified,
     textDecoration: TextDecoration? = null,
     textAlign: TextAlign? = null,
-    // Will be removed, only style should be used
-    lineHeight: TextUnit = TextUnit.Unspecified,
     overflow: TextOverflow = TextOverflow.Clip,
     softWrap: Boolean = true,
     minLines: Int = 1,
@@ -80,14 +70,9 @@ fun Text(
         text = text,
         modifier = modifier,
         color = color,
-        fontSize = fontSize,
         fontStyle = fontStyle,
-        fontWeight = fontWeight,
-        fontFamily = fontFamily,
-        letterSpacing = letterSpacing,
         textDecoration = textDecoration,
         textAlign = textAlign,
-        lineHeight = lineHeight,
         overflow = overflow,
         softWrap = softWrap,
         minLines = minLines,

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/AvatarActionBottomSheet.kt

@@ -34,13 +34,13 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.ModalBottomSheetLayout
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.ui.media.AvatarAction
+import io.element.android.libraries.theme.ElementTheme
 import kotlinx.collections.immutable.ImmutableList
 import kotlinx.collections.immutable.persistentListOf
 import kotlinx.coroutines.launch
@@ -93,7 +93,7 @@ private fun AvatarActionBottomSheetContent(
                 headlineContent = {
                     Text(
                         text = stringResource(action.titleResId),
-                        fontSize = 16.sp,
+                        style = ElementTheme.typography.fontBodyLgRegular,
                         color = if (action.destructive) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.primary,
                     )
                 },

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/MatrixUserRow.kt

@@ -25,22 +25,20 @@ import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
-import io.element.android.libraries.designsystem.theme.noFontPadding
 import io.element.android.libraries.matrix.api.user.MatrixUser
 import io.element.android.libraries.matrix.ui.model.getAvatarData
 import io.element.android.libraries.matrix.ui.model.getBestName
+import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun MatrixUserRow(
@@ -75,23 +73,20 @@ fun UserRow(
         ) {
             // Name
             Text(
-                fontSize = 16.sp,
-                fontWeight = FontWeight.Normal,
                 text = name,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
                 color = MaterialTheme.colorScheme.primary,
-                style = noFontPadding,
+                style = ElementTheme.typography.fontBodyLgRegular,
             )
             // Id
             subtext?.let {
                 Text(
                     text = subtext,
                     color = MaterialTheme.colorScheme.secondary,
-                    fontSize = 12.sp,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
-                    style = noFontPadding,
+                    style = ElementTheme.typography.fontBodySmRegular,
                 )
             }
         }

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/UnresolvedUserRow.kt

@@ -32,7 +32,6 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.semantics.Role
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
@@ -45,8 +44,8 @@ import io.element.android.libraries.designsystem.theme.components.Checkbox
 import io.element.android.libraries.designsystem.theme.components.Divider
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
-import io.element.android.libraries.designsystem.theme.noFontPadding
 import io.element.android.libraries.matrix.ui.model.getAvatarData
+import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
@@ -70,13 +69,11 @@ fun UnresolvedUserRow(
         ) {
             // ID
             Text(
-                fontSize = 16.sp,
-                fontWeight = FontWeight.SemiBold,
                 text = id,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
                 color = MaterialTheme.colorScheme.primary,
-                style = noFontPadding,
+                style = ElementTheme.typography.fontBodyLgMedium,
             )
 
             // Warning
@@ -98,8 +95,7 @@ fun UnresolvedUserRow(
                 Text(
                     text = stringResource(CommonStrings.common_invite_unknown_profile),
                     color = MaterialTheme.colorScheme.secondary,
-                    fontSize = 12.sp,
+                    style = ElementTheme.typography.fontBodySmRegular.copy(lineHeight = 16.sp),
-                    lineHeight = 16.sp,
                 )
             }
         }

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/UnsavedAvatar.kt

@@ -40,6 +40,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.preview.debugPlaceholderBackground
 import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
 import io.element.android.libraries.theme.ElementTheme
 
 /**
@@ -69,7 +70,7 @@ fun UnsavedAvatar(
             contentDescription = null,
         )
     } else {
-        Box(modifier = commonModifier.background(ElementTheme.legacyColors.quinary)) {
+        Box(modifier = commonModifier.background(ElementTheme.colors.temporaryColorBgSpecial)) {
             Icon(
                 imageVector = Icons.Outlined.AddAPhoto,
                 contentDescription = "",

libraries/textcomposer/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt

@@ -68,14 +68,11 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import io.element.android.libraries.designsystem.ElementTextStyles
 import io.element.android.libraries.designsystem.VectorIcons
 import io.element.android.libraries.designsystem.modifiers.applyIf
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
-import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -141,7 +138,7 @@ fun TextComposer(
             if (composerMode is MessageComposerMode.Special) {
                 ComposerModeView(composerMode = composerMode, onResetComposerMode = onResetComposerMode)
             }
-            val defaultTypography = ElementTextStyles.Regular.callout.copy(textAlign = TextAlign.Start)
+            val defaultTypography = ElementTheme.typography.fontBodyLgRegular
             Box {
                 BasicTextField(
                     modifier = Modifier

libraries/theme/README.md

@@ -8,14 +8,10 @@ The module contains public tokens and color schemes that are later used in `Mate
 
 All tokens can be accessed through the `ElementTheme` object, which contains the following properties:
 
-* `ElementTheme.legacyColors`: contains legacy colors and custom colors not present in either Material or Compound. Usage of these colors should be avoided, and they're usually prefixed in Figma with the `Zzz/` prefix or have no name at all.
 * `ElementTheme.materialColors`: contains all Material color tokens. In Figma, they're prefixed with `M3/`. It's an alias to `MaterialTheme.colorScheme`.
 * `ElementTheme.colors`: contains all Compound semantic color tokens. In Figma, they're prefixed with either `Light/` or `Dark/`.
-* `ElementTheme.materialTypography`: contains the Material `Typography` values. In Figma, they're prefixed with `M3/`. It's an alias to `MaterialTheme.typography`.
 * `ElementTheme.typography`: contains the Compound `TypographyTokens` values. In Figma, they're prefixed with `Android/font/`.
 
 ## Adding new tokens
 
 All new tokens **should** come from Compound and added to the `compound.generated` package. To map the literal tokens to the semantic ones, you'll have to update both `compoundColorsLight` and `compoundColorsDark` in `CompoundColors.kt`.
-
-As we're still migrating to using Compound tokens, it's possible that you might need to add some tokens manually. In that case, you should add them to `LegacyColors.kt` and map them later in `ElementColors.kt` so they can be used in light and dark themes. However, keep in mind this is just a temporary step, as those tokens should either be added later to Compound or replaced by Compound tokens in the future.

libraries/theme/src/main/kotlin/io/element/android/libraries/theme/ElementColors.kt

@@ -1,107 +0,0 @@
-/*
- * Copyright (c) 2023 New Vector Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-package io.element.android.libraries.theme
-
-import androidx.compose.runtime.Stable
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.setValue
-import androidx.compose.ui.graphics.Color
-import io.element.android.libraries.theme.compound.generated.internal.DarkDesignTokens
-import io.element.android.libraries.theme.compound.generated.internal.LightDesignTokens
-import io.element.android.libraries.theme.compound.generated.SemanticColors
-
-/**
- * Element Android legacy color palette.
- *
- * ## IMPORTANT!
- * **We should not add any new colors here, all new colors should come from [SemanticColors] instead.**
- *
- * If a design needs you to add a different color here, talk to some designer first, as they'll probably be using
- * the legacy color palette.
- */
-@Deprecated("Use SemanticColors instead")
-@Stable
-class ElementColors(
-    quaternary: Color,
-    quinary: Color,
-    gray300: Color,
-    accentColor: Color,
-    placeholder: Color,
-    isLight: Boolean
-) {
-    var quaternary by mutableStateOf(quaternary)
-        private set
-
-    var quinary by mutableStateOf(quinary)
-        private set
-
-    var gray300 by mutableStateOf(gray300)
-        private set
-
-    var accentColor by mutableStateOf(accentColor)
-        private set
-
-    var placeholder by mutableStateOf(placeholder)
-        private set
-
-    var isLight by mutableStateOf(isLight)
-        private set
-
-    fun copy(
-        quaternary: Color = this.quaternary,
-        quinary: Color = this.quinary,
-        gray300: Color = this.gray300,
-        accentColor: Color = this.accentColor,
-        placeholder: Color = this.placeholder,
-        isLight: Boolean = this.isLight,
-    ) = ElementColors(
-        quaternary = quaternary,
-        quinary = quinary,
-        gray300 = gray300,
-        accentColor = accentColor,
-        placeholder = placeholder,
-        isLight = isLight,
-    )
-
-    fun updateColorsFrom(other: ElementColors) {
-        quaternary = other.quaternary
-        quinary = other.quinary
-        gray300 = other.gray300
-        accentColor = other.accentColor
-        placeholder = other.placeholder
-        isLight = other.isLight
-    }
-}
-
-internal fun elementColorsLight() = ElementColors(
-    quaternary = Gray_100,
-    quinary = Gray_50,
-    gray300 = LightDesignTokens.colorGray300,
-    accentColor = ElementGreen,
-    placeholder = LightDesignTokens.colorGray800,
-    isLight = true,
-)
-
-internal fun elementColorsDark() = ElementColors(
-    quaternary = Gray_400,
-    quinary = Gray_450,
-    gray300 = DarkDesignTokens.colorGray300,
-    accentColor = ElementGreen,
-    placeholder = DarkDesignTokens.colorGray800,
-    isLight = false,
-)

libraries/theme/src/main/kotlin/io/element/android/libraries/theme/ElementTheme.kt

@@ -44,15 +44,6 @@ import io.element.android.libraries.theme.compound.generated.TypographyTokens
  * Inspired from https://medium.com/@lucasyujideveloper/54cbcbde1ace
  */
 object ElementTheme {
-    /**
-     * The current [ElementColors] provided by [ElementTheme]. Usage of these colors is discouraged.
-     * In Figma, they usually have the `Zzz` prefix or have no name at all.
-     */
-    val legacyColors: ElementColors
-        @Composable
-        @ReadOnlyComposable
-        get() = LocalLegacyColors.current
-
     /**
      * The current [SemanticColors] provided by [ElementTheme].
      * These come from Compound and are the recommended colors to use for custom components.
@@ -72,14 +63,6 @@ object ElementTheme {
         @ReadOnlyComposable
         get() = MaterialTheme.colorScheme
 
-    /**
-     * Material 3 [Typography] tokens. In Figma, these have the `M3/` prefix.
-     */
-    val materialTypography: Typography
-        @Composable
-        @ReadOnlyComposable
-        get() = MaterialTheme.typography
-
     /**
      * Compound [Typography] tokens. In Figma, these have the `Android/font/` prefix.
      */
@@ -95,14 +78,12 @@ object ElementTheme {
 }
 
 /* Global variables (application level) */
-internal val LocalLegacyColors = staticCompositionLocalOf { elementColorsLight() }
 internal val LocalCompoundColors = staticCompositionLocalOf { compoundColorsLight }
 
 @Composable
 fun ElementTheme(
     darkTheme: Boolean = isSystemInDarkTheme(),
     dynamicColor: Boolean = false, /* true to enable MaterialYou */
-    legacyColors: ElementColors = if (darkTheme) elementColorsDark() else elementColorsLight(),
     compoundColors: SemanticColors = if (darkTheme) compoundColorsDark else compoundColorsLight,
     materialLightColors: ColorScheme = materialColorSchemeLight,
     materialDarkColors: ColorScheme = materialColorSchemeDark,
@@ -110,9 +91,6 @@ fun ElementTheme(
     content: @Composable () -> Unit,
 ) {
     val systemUiController = rememberSystemUiController()
-    val currentLegacyColor = remember(darkTheme) {
-        legacyColors.copy()
-    }.apply { updateColorsFrom(legacyColors) }
     val currentCompoundColor = remember(darkTheme) {
         compoundColors.copy()
     }.apply { updateColorsFrom(compoundColors) }
@@ -128,7 +106,6 @@ fun ElementTheme(
         systemUiController.applyTheme(colorScheme = colorScheme, darkTheme = darkTheme)
     }
     CompositionLocalProvider(
-        LocalLegacyColors provides currentLegacyColor,
         LocalCompoundColors provides currentCompoundColor,
     ) {
         MaterialTheme(
@@ -149,7 +126,7 @@ fun ForcedDarkElementTheme(
 ) {
     val systemUiController = rememberSystemUiController()
     val colorScheme = MaterialTheme.colorScheme
-    val wasDarkTheme = !ElementTheme.legacyColors.isLight
+    val wasDarkTheme = !ElementTheme.colors.isLight
     DisposableEffect(Unit) {
         onDispose {
             systemUiController.applyTheme(colorScheme, wasDarkTheme)

libraries/theme/src/main/kotlin/io/element/android/libraries/theme/LegacyColors.kt

@@ -17,7 +17,6 @@
 package io.element.android.libraries.theme
 
 import androidx.compose.ui.graphics.Color
-import com.airbnb.android.showkase.annotation.ShowkaseColor
 
 // =================================================================================================
 // IMPORTANT!
@@ -26,50 +25,4 @@ import com.airbnb.android.showkase.annotation.ShowkaseColor
 // iterate through the designs. All new colors should come from Compound's Design Tokens.
 // =================================================================================================
 
-@ShowkaseColor(name = "LightGrey", group = "Material Design")
-val LightGrey = Color(0x993C3C43)
-
-@ShowkaseColor(name = "DarkGrey", group = "Material Design")
-val DarkGrey = Color(0x99EBEBF5)
-
-val SystemGreyLight = Color(0xFF8E8E93)
-val SystemGreyDark = Color(0xFF8E8E93)
-val SystemGrey2Light = Color(0xFFAEAEB2)
-val SystemGrey2Dark = Color(0xFF636366)
-val SystemGrey3Light = Color(0xFFC7C7CC)
-val SystemGrey3Dark = Color(0xFF48484A)
-val SystemGrey4Light = Color(0xFFD1D1D6)
-val SystemGrey4Dark = Color(0xFF3A3A3C)
-val SystemGrey5Light = Color(0xFFE5E5EA)
-val SystemGrey5Dark = Color(0xFF2C2C2E)
-val SystemGrey6Light = Color(0xFFF2F2F7)
-val SystemGrey6Dark = Color(0xFF1C1C1E)
-
-// For light themes
-val Gray_25 = Color(0xFFF4F6FA)
-val Gray_50 = Color(0xFFE3E8F0)
-val Gray_100 = Color(0xFFC1C6CD)
-val Gray_150 = Color(0xFF8D97A5)
-val Gray_200 = Color(0xFF737D8C)
-val Black_900 = Color(0xFF17191C)
-
-// For dark themes
-val Gray_250 = Color(0xFFA9B2BC)
-val Gray_300 = Color(0xFF8E99A4)
-val Gray_400 = Color(0xFF6F7882)
-val Gray_450 = Color(0xFF394049)
-val Black_800 = Color(0xFF15191E)
-val Black_950 = Color(0xFF21262C)
-
-val Azure = Color(0xFF368BD6)
-val Kiwi = Color(0xFF74D12C)
-val Grape = Color(0xFFAC3BA8)
-val Verde = Color(0xFF03B381)
-val Polly = Color(0xFFE64F7A)
-val Melon = Color(0xFFFF812D)
-
-val ElementGreen = Color(0xFF0DBD8B)
-val ElementOrange = Color(0xFFD9B072)
-val Vermilion = Color(0xFFFF5B55)
-
 val LinkColor = Color(0xFF0086E6)

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[Color_Material Design_DarkGrey,NEXUS_5,1.0,en].png

@@ -1,3 +0,0 @@
-version https://git-lfs.github.com/spec/v1
-oid sha256:0c51ed0a004218e97af5f34e3011e0c4e4b50cccf0eff1417234186bdb786839
-size 4983

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[Color_Material Design_LightGrey,NEXUS_5,1.0,en].png

@@ -1,3 +0,0 @@
-version https://git-lfs.github.com/spec/v1
-oid sha256:1042b183b2703322af7a43d959992340b47618b27d706cfba8cf1556e70f793e
-size 4984

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.analytics.impl_null_DefaultGroup_AnalyticsOptInViewDarkPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ff97fc37fcdb158bfeea7a201437207c6ee94b06b62127d51ab44073b78d803f
+oid sha256:434f7619fb6bd337ede775fc343acc05950907987523acbd0f578624e5d26857
-size 50174
+size 49246

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.analytics.impl_null_DefaultGroup_AnalyticsOptInViewLightPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:5b370696e3dc1753ad1b76c08c68dcc436c44bb1c2f715b3fad57f51e6997394
+oid sha256:93036a30e1af96805c20ea5d65b6d3eb40d2ee11f8f3420436e936dd5b4ca38b
-size 51424
+size 50201

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.addpeople_null_DefaultGroup_AddPeopleViewDarkPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:df4db13529aa1125687e4cdbd2282b9511cbd533e8fbc9b5fcb1226ef93cfd86
+oid sha256:92fda75e246b46ab786da2f54f920bf96959618ac20cece5f6ca754f7fcf6914
-size 13613
+size 14161

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.addpeople_null_DefaultGroup_AddPeopleViewDarkPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b74b37e5bcc506e7351512b2b2c9f6b933877e67920ab90033259ecb2f0849d2
+oid sha256:a2a005b84bbf1be15028d36e153e79eb5acbe41e65e3f274a6d78b22be95efb5
-size 28040
+size 28509

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.addpeople_null_DefaultGroup_AddPeopleViewLightPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a5576ba05fa04c1110e76a3ddb3a0d61778f007da38eac639e6f9794ec296110
+oid sha256:6bb2d3d6e83f5b0ca17809c415e636bf5dbfa846259e8fabd6c3afae37d7d1f9
-size 14625
+size 15231

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.addpeople_null_DefaultGroup_AddPeopleViewLightPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d04ba274e93685d099ba9c407c38c339604514a446ae2055d0900b8a6f35b39f
+oid sha256:d3f7631f15054ac55688f76805a6f1924e79058881957b67284865b6508886cc
-size 28840
+size 29249

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_RoomPrivacyOptionDarkPreview_0_null,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d9f420e553a0006b8b9823763bd1cb9790a4e681b058618f4ec4bbf709c43817
+oid sha256:d47034cafef80cdac5d702e52092f07ebc0bb96dbdd7f9f0c1ea2e302cbe9917
-size 33552
+size 33858

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_RoomPrivacyOptionLightPreview_0_null,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b803dd94cde258efd6ff3c5c137442f2b7967135065c06d0869553f5f5d66847
+oid sha256:84ea420320bd406588cb4d9aa3fea79d63ec37fc31a00d4fa77a06a7c8499145
-size 35201
+size 35452

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_SearchMultipleUsersResultItemPreview_0_null,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:504a8fdf5e67a430e37d7efd1a990f1f506fe73cb1cf556ef91184624860591d
+oid sha256:d01eaadfd0b9508c44145ba2e6cd85a6a24fdb43f665188404f9da1cf3e03321
-size 86041
+size 86292

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_SearchSingleUserResultItemPreview_0_null,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2869cf8af38a526ea7b5b3e387c7c01924905635dd03a049f2679e48c6e1c522
+oid sha256:0eadad4490c76da04073c25dffff74a2fe5a6a0dd7612f9c5a61a631a54edd77
-size 45289
+size 45613

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_UserListViewDarkPreview_0_null_5,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b0457439922b1990f6fd72449c6f4042b72755e09ab9f3c9c8a8c03c9fc925eb
+oid sha256:f57dd2c8b41fca0a1ef74ae16ad720054a29ccfca3c38d5d16dbfbf8c79ef3d6
-size 63888
+size 64119

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_UserListViewDarkPreview_0_null_6,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:98c56ef886a3d1b6b3109bb835e587176f4e420bb05057dc150c82153605f7d1
+oid sha256:45f4c5a3edbf61d815a7b1221a73123b09c8767d15ae2d9ae04f11ae3defe697
-size 67794
+size 67911

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_UserListViewLightPreview_0_null_5,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a2ba6ed9981ea1ad3f0cdf76d600d6a51daf58a04f15c5bf23713c7f31e84b94
+oid sha256:faf0fc318f5b70b0251b5e1334e2532f156e8ed62ef0a3608d2bf056e145f30d
-size 65471
+size 65876

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.components_null_DefaultGroup_UserListViewLightPreview_0_null_6,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:c1f75b3ada8d9462a23b7defd26ac16562ff6ccf9babfcc7330286712ceb805e
+oid sha256:6811324cfc868722c57a02f2544ffcbbb2f2247fc9284e4e6fe869e33447c7b1
-size 69581
+size 69939

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.configureroom_null_DefaultGroup_ConfigureRoomViewDarkPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a9f5b609ec3828639f4f9257cf6f69affdf802238cb6d87dbd879d922c9889b6
+oid sha256:0169cdedfc56ba1b55f133ed41146a0ec3597123a88ed086f7584f06d235da26
-size 56715
+size 57732

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.configureroom_null_DefaultGroup_ConfigureRoomViewDarkPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:00030af95c37343791901f6990cd3c41aa65ae00d9515915b2d841cdbb0247ef
+oid sha256:a0cdeea89592fbad03e1ad29aa1616bd779403f022097ca11510ff9cda3457aa
-size 82801
+size 83656

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.configureroom_null_DefaultGroup_ConfigureRoomViewLightPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7a2d26a6b91a57621f178d09b2c54ab769760145f23b216c5e9d62db82493941
+oid sha256:f61e37505ee1276d894641647ec34323f415f4a3cdc699de01579a92255c2a4e
-size 60140
+size 60941

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.configureroom_null_DefaultGroup_ConfigureRoomViewLightPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:4d327234d494f77c3c8a11cf32f16e80fdadbe42ea87df8b34770e000545e8de
+oid sha256:630fa772c15d8f16461655b2c2763d8ca85dc29812fea7d01366d68e3a446eaf
-size 85937
+size 86660

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.root_null_DefaultGroup_CreateRoomRootViewDarkPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:873df9138a6dbf973c37cb76a0880d29894bda0fd92ba49c166ef7167a791344
+oid sha256:b26cfcc46bf0f1e3669424d4e135019c3a045fea09af5006fc90bca5f93e776a
-size 21419
+size 21870

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.root_null_DefaultGroup_CreateRoomRootViewDarkPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b2567be3b27bb2ea979b7da492fb059e87b25c5938c07aacaa621a97685bacd5
+oid sha256:e3199a1e88702733887ce8d29c1373711c600060fb15cb6f24fde388d706ea86
-size 21095
+size 21256

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.root_null_DefaultGroup_CreateRoomRootViewDarkPreview_0_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:300883c3e49ff5e655952cf2b5a0a194718fde9c6fd289c3125e4cd3609cea00
+oid sha256:5312bd01a41dc0d1b022b6ce7258435d1cd9de75bd4231ce7f86ed6f84de2e4b
-size 26379
+size 26306

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.root_null_DefaultGroup_CreateRoomRootViewLightPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:18a343f9fce08b0ff9e12f22e1c8e4efb6f16b3eac886675c9534d088dbe3f80
+oid sha256:9bb18fdd2396fd913b2e7fe0fe40a20aa100cf4df1660d69a280e968abcaf625
-size 23098
+size 23535

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.root_null_DefaultGroup_CreateRoomRootViewLightPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e80d2a64eb4c39e117dbd3bdd6b1b45b19a99f8e1ccb905547f82096fae8510d
+oid sha256:8327feb32afb0d33e85c75a3f05c651149440a25834dcb926be44a13c51153e5
-size 21465
+size 21606

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.createroom.impl.root_null_DefaultGroup_CreateRoomRootViewLightPreview_0_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:1b91f0e2d72bf5b12430183ccb98cb30e1e0ab3859472c5a6368b5cca1ceb33c
+oid sha256:1b9b88deb5557da8b4670231ee41aa737543244d61abfd399d7de0f6d4496dde
-size 27574
+size 27439

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowDarkPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:4233e67a2f27e3e73924b9af5f43d0e877a397f4a2ee3f8d436a713e1d2b3c0c
+oid sha256:07e722c2936e1332168319059d5b4a553b1fc7f03da8aff40b005a05b203632d
-size 28738
+size 28679

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowDarkPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:69b2702985d50fedbb720e86eef63c2734e328d8537c6a8f644fcf75c7e710a8
+oid sha256:eab30f7ec6ad8e289f4987d23f373ca8f96220a5d0762d46723058bca53d0a41
-size 32883
+size 33580

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowDarkPreview_0_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:76681a4959008b8646273424cd50566d7c868620938e07849da596ccd3172781
+oid sha256:6a344ef3f77b759e1d43733f85fc7ee9bee98d6eb3980ce13c435bb33c0703f0
-size 33020
+size 33720

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowDarkPreview_0_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0052281199753556fd2d8ed411360ee15e5019e2ddd3ec2b1a9695c81be3a233
+oid sha256:6e5874a0e224636c5ad13f4022e8f2ef3dff97206a5551734de560fbc40c562a
-size 14402
+size 14447

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowDarkPreview_0_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:57878214b3949c4eaa782f763095e9e8234a979e0e7fe83fcf1e5083bfb32bf0
+oid sha256:1e526f418f5c8d1d0c51509808e22548ce3c295752e7a1cf28cfe394fccc01f4
-size 28878
+size 28834

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowLightPreview_0_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9482e9994ab5c2367d52811fa72559d9c1660e517b5d242e7d714f3e84ba03c5
+oid sha256:97639d0985e0303e3a58120fbb7a2bba67b4279d198140a9f4cf6b19aa74bed0
-size 29271
+size 29199

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowLightPreview_0_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9bb46ebec6a9fbdab74f9634d1c834c52c1f690183b3b360e24c79012ed3a192
+oid sha256:f0372c5389850f853652ad40ad54069e456aa33e13335e733d779a8d4d384049
-size 34823
+size 35297

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowLightPreview_0_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:fca36d620adf924e4c6605832dea8df4f2b87e7ac472c98a5ffae0056816be8a
+oid sha256:62f57ee9fc205539ede541baf8e4b887ef7776675c4760acd5b27545cd021df8
-size 34944
+size 35420

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowLightPreview_0_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9b202f4160bdb58a9e87cfc66f11a5aaf66a90591c978dfc797b3cf351c94103
+oid sha256:ea79f0de34ba0613fea7ba98c65f5ff925a336ddf2d6734ea77b1a2d559527f0
-size 14396
+size 14416

tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.features.invitelist.impl.components_null_DefaultGroup_InviteSummaryRowLightPreview_0_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:afc363e9509019637ad9a7b4120462e1b2679d02a4b815c5840a83336cb9616a
+oid sha256:4b13ebc73e257d5f588f9e74d0a35bc9af951faece57556636378914786429e3
-size 29654
+size 29503