Use ElementTheme instead of MaterialTheme

app/src/main/kotlin/io/element/android/x/MainActivity.kt

@@ -14,7 +14,6 @@ import androidx.activity.enableEdgeToEdge
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
@@ -26,6 +25,7 @@ import androidx.lifecycle.repeatOnLifecycle
 import com.bumble.appyx.core.integration.NodeHost
 import com.bumble.appyx.core.integrationpoint.NodeActivity
 import com.bumble.appyx.core.plugin.NodeReadyObserver
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.features.lockscreen.api.LockScreenEntryPoint
 import io.element.android.features.lockscreen.api.LockScreenLockState
 import io.element.android.features.lockscreen.api.LockScreenService
@@ -73,7 +73,7 @@ class MainActivity : NodeActivity() {
                 Box(
                     modifier = Modifier
                         .fillMaxSize()
-                        .background(MaterialTheme.colorScheme.background),
+                        .background(ElementTheme.colors.bgCanvasDefault),
                 ) {
                     if (migrationState.migrationAction.isSuccess()) {
                         MainNodeHost()

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

@@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.systemBarsPadding
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.BiasAlignment
@@ -111,7 +110,7 @@ private fun AnalyticsOptInHeader(
                 .padding(8.dp),
             style = ElementTheme.typography.fontBodyMdRegular
                 .copy(
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     textAlign = TextAlign.Center,
                 )
         )

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

@@ -19,7 +19,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -211,7 +210,7 @@ private fun CreateRoomActionButton(
     ) {
         Icon(
             modifier = Modifier.size(24.dp),
-            tint = MaterialTheme.colorScheme.secondary,
+            tint = ElementTheme.colors.iconSecondary,
             resourceId = iconRes,
             contentDescription = null,
         )

features/joinroom/impl/src/main/kotlin/io/element/android/features/joinroom/impl/JoinRoomView.kt

@@ -24,7 +24,6 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -308,7 +307,7 @@ private fun JoinRoomContent(
                         Text(
                             text = stringResource(id = CommonStrings.error_unknown),
                             textAlign = TextAlign.Center,
-                            color = MaterialTheme.colorScheme.error,
+                            color = ElementTheme.colors.textCriticalPrimary,
                         )
                     },
                 )
@@ -380,13 +379,13 @@ private fun DefaultLoadedContent(
                         text = stringResource(R.string.screen_join_room_space_not_supported_title),
                         textAlign = TextAlign.Center,
                         style = ElementTheme.typography.fontBodyLgMedium,
-                        color = MaterialTheme.colorScheme.primary,
+                        color = ElementTheme.colors.textPrimary,
                     )
                     Text(
                         text = stringResource(R.string.screen_join_room_space_not_supported_description, applicationName),
                         textAlign = TextAlign.Center,
                         style = ElementTheme.typography.fontBodyMdRegular,
-                        color = MaterialTheme.colorScheme.secondary,
+                        color = ElementTheme.colors.textSecondary,
                     )
                 } else if (contentState.joinAuthorisationStatus is JoinAuthorisationStatus.CanKnock) {
                     Spacer(modifier = Modifier.height(24.dp))

features/knockrequests/impl/src/main/kotlin/io/element/android/features/knockrequests/impl/banner/KnockRequestsBannerView.kt

@@ -128,14 +128,14 @@ private fun KnockRequestsBannerContent(
                 Text(
                     text = state.formattedTitle(),
                     style = ElementTheme.typography.fontBodyMdMedium,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                     textAlign = TextAlign.Start,
                 )
                 if (state.subtitle != null) {
                     Text(
                         text = state.subtitle,
                         style = ElementTheme.typography.fontBodySmRegular,
-                        color = MaterialTheme.colorScheme.secondary,
+                        color = ElementTheme.colors.textSecondary,
                         textAlign = TextAlign.Start,
                     )
                 }

features/knockrequests/impl/src/main/kotlin/io/element/android/features/knockrequests/impl/list/KnockRequestsListView.kt

@@ -27,7 +27,6 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableIntStateOf
@@ -331,7 +330,7 @@ private fun KnockRequestItem(
                     text = knockRequest.getBestName(),
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                     style = ElementTheme.typography.fontBodyLgMedium,
                 )
                 val formattedDate = knockRequest.formattedDate
@@ -339,7 +338,7 @@ private fun KnockRequestItem(
                     Spacer(modifier = Modifier.width(8.dp))
                     Text(
                         text = formattedDate,
-                        color = MaterialTheme.colorScheme.secondary,
+                        color = ElementTheme.colors.textSecondary,
                         style = ElementTheme.typography.fontBodySmRegular,
                     )
                 }
@@ -348,7 +347,7 @@ private fun KnockRequestItem(
             if (!knockRequest.displayName.isNullOrEmpty()) {
                 Text(
                     text = knockRequest.userId.value,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
                     style = ElementTheme.typography.fontBodyMdRegular,

features/lockscreen/impl/src/main/kotlin/io/element/android/features/lockscreen/impl/unlock/PinUnlockView.kt

@@ -27,7 +27,6 @@ import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Lock
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -316,7 +315,7 @@ private fun PinUnlockHeader(
                 .fillMaxWidth(),
             textAlign = TextAlign.Center,
             style = ElementTheme.typography.fontHeadingMdBold,
-            color = MaterialTheme.colorScheme.primary,
+            color = ElementTheme.colors.textPrimary,
         )
         Spacer(Modifier.height(8.dp))
         val remainingAttempts = state.remainingAttempts.dataOrNull()
@@ -330,9 +329,9 @@ private fun PinUnlockHeader(
             ""
         }
         val subtitleColor = if (state.showWrongPinTitle) {
-            MaterialTheme.colorScheme.error
+            ElementTheme.colors.textCriticalPrimary
         } else {
-            MaterialTheme.colorScheme.secondary
+            ElementTheme.colors.textSecondary
         }
         Text(
             text = subtitle,

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

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -68,7 +67,7 @@ fun AccountProviderView(
                     RoundedIconAtom(
                         size = RoundedIconAtomSize.Medium,
                         imageVector = CompoundIcons.Search(),
-                        tint = MaterialTheme.colorScheme.primary,
+                        tint = ElementTheme.colors.iconPrimary,
                     )
                 }
                 Text(
@@ -77,7 +76,7 @@ fun AccountProviderView(
                         .weight(1f),
                     text = item.title,
                     style = ElementTheme.typography.fontBodyLgMedium,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                 )
                 if (item.isPublic) {
                     Icon(
@@ -96,7 +95,7 @@ fun AccountProviderView(
                         .padding(start = 46.dp, bottom = 12.dp, end = 26.dp),
                     text = item.subtitle,
                     style = ElementTheme.typography.fontBodyMdRegular,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                 )
             }
         }

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/qrcode/scan/QrCodeScanView.kt

@@ -22,7 +22,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.progressSemantics
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -138,7 +137,7 @@ private fun ColumnScope.Buttons(
                     ) {
                         Icon(
                             imageVector = CompoundIcons.Error(),
-                            tint = MaterialTheme.colorScheme.error,
+                            tint = ElementTheme.colors.iconCriticalPrimary,
                             contentDescription = null,
                             modifier = Modifier.size(24.dp)
                         )
@@ -151,7 +150,7 @@ private fun ColumnScope.Buttons(
                                 else -> stringResource(R.string.screen_qr_code_login_invalid_scan_state_subtitle)
                             },
                             textAlign = TextAlign.Center,
-                            color = MaterialTheme.colorScheme.error,
+                            color = ElementTheme.colors.textCriticalPrimary,
                             style = ElementTheme.typography.fontBodySmMedium,
                         )
                     }

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

@@ -513,14 +513,14 @@ private fun CantSendMessageBanner() {
     Row(
         modifier = Modifier
             .fillMaxWidth()
-                .background(MaterialTheme.colorScheme.secondary)
+            .background(ElementTheme.colors.bgSubtleSecondary)
             .padding(16.dp),
         verticalAlignment = Alignment.CenterVertically,
         horizontalArrangement = Arrangement.Center
     ) {
         Text(
             text = stringResource(id = R.string.screen_room_timeline_no_permission_to_post),
-            color = MaterialTheme.colorScheme.onSecondary,
+            color = ElementTheme.colors.textSecondary,
             style = MaterialTheme.typography.bodyMedium,
             textAlign = TextAlign.Center,
             fontStyle = FontStyle.Italic,

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

@@ -27,7 +27,6 @@ import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.ListItemDefaults
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
@@ -253,7 +252,7 @@ private fun MessageSummary(
 ) {
     val content: @Composable () -> Unit
     val icon: @Composable () -> Unit = { Avatar(avatarData = event.senderAvatar.copy(size = AvatarSize.MessageActionSender)) }
-    val contentStyle = ElementTheme.typography.fontBodyMdRegular.copy(color = MaterialTheme.colorScheme.secondary)
+    val contentStyle = ElementTheme.typography.fontBodyMdRegular.copy(color = ElementTheme.colors.textSecondary)
 
     @Composable
     fun ContentForBody(body: String) {
@@ -316,7 +315,7 @@ private fun MessageSummary(
                 Text(
                     text = sentTimeFull,
                     style = ElementTheme.typography.fontBodyXsRegular,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     textAlign = TextAlign.End,
                 )
             }
@@ -358,7 +357,7 @@ private fun EmojiReactionsRow(
             Icon(
                 imageVector = CompoundIcons.ReactionAdd(),
                 contentDescription = stringResource(id = CommonStrings.a11y_react_with_other_emojis),
-                tint = MaterialTheme.colorScheme.secondary,
+                tint = ElementTheme.colors.iconSecondary,
                 modifier = Modifier
                     .size(24.dp)
                     .clickable(

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

@@ -21,7 +21,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Switch
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -113,7 +112,7 @@ fun ReportMessageView(
                     Text(
                         text = stringResource(R.string.screen_report_content_block_user_hint),
                         style = ElementTheme.typography.fontBodyMdRegular,
-                        color = MaterialTheme.colorScheme.secondary,
+                        color = ElementTheme.colors.textSecondary,
                     )
                 }
                 Switch(

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

@@ -23,7 +23,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CornerSize
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
 import androidx.compose.ui.Alignment
@@ -76,7 +75,7 @@ fun MessagesReactionButton(
             .background(Color.Transparent)
             // Outer border, same colour as background
             .border(
-                BorderStroke(2.dp, MaterialTheme.colorScheme.background),
+                BorderStroke(2.dp, ElementTheme.colors.bgCanvasDefault),
                 shape = RoundedCornerShape(corner = CornerSize(14.dp))
             )
             .padding(vertical = 2.dp, horizontal = 2.dp)
@@ -164,7 +163,7 @@ private fun ReactionContent(
         Spacer(modifier = Modifier.width(4.dp))
         Text(
             text = reaction.count.toString(),
-            color = if (reaction.isHighlighted) MaterialTheme.colorScheme.primary else MaterialTheme.colorScheme.secondary,
+            color = if (reaction.isHighlighted) ElementTheme.colors.textPrimary else ElementTheme.colors.textSecondary,
             style = ElementTheme.typography.fontBodyMdRegular,
         )
     }

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

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -45,7 +44,7 @@ fun TimelineEventTimestampView(
     val hasError = event.localSendState is LocalEventSendState.Failed
     val hasEncryptionCritical = event.messageShield?.isCritical.orFalse()
     val isMessageEdited = event.content.isEdited()
-    val tint = if (hasError || hasEncryptionCritical) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.secondary
+    val tint = if (hasError || hasEncryptionCritical) ElementTheme.colors.textCriticalPrimary else ElementTheme.colors.textSecondary
     Row(
         modifier = Modifier
                 .padding(PaddingValues(start = TimelineEventTimestampViewDefaults.spacing))

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

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -53,7 +52,7 @@ fun TimelineItemInformativeView(
         ) {
             Icon(
                 resourceId = iconResourceId,
-                tint = MaterialTheme.colorScheme.secondary,
+                tint = ElementTheme.colors.iconSecondary,
                 contentDescription = iconDescription,
                 modifier = Modifier.size(16.dp)
             )
@@ -61,7 +60,7 @@ fun TimelineItemInformativeView(
         Spacer(modifier = Modifier.width(4.dp))
         Text(
             fontStyle = FontStyle.Italic,
-            color = MaterialTheme.colorScheme.secondary,
+            color = ElementTheme.colors.textSecondary,
             style = ElementTheme.typography.fontBodyMdRegular,
             text = text
         )

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

@@ -7,7 +7,6 @@
 
 package io.element.android.features.messages.impl.timeline.components.event
 
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.style.TextAlign
@@ -25,7 +24,7 @@ fun TimelineItemStateView(
 ) {
     Text(
         modifier = modifier,
-        color = MaterialTheme.colorScheme.secondary,
+        color = ElementTheme.colors.textSecondary,
         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

@@ -17,7 +17,6 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
@@ -67,7 +66,7 @@ fun GroupHeaderView(
             ) {
                 Text(
                     text = text,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     style = ElementTheme.typography.fontBodyMdRegular,
                 )
                 val rotation: Float by animateFloatAsState(
@@ -82,7 +81,7 @@ fun GroupHeaderView(
                     modifier = Modifier.rotate(rotation),
                     imageVector = CompoundIcons.ChevronRight(),
                     contentDescription = null,
-                    tint = MaterialTheme.colorScheme.secondary
+                    tint = ElementTheme.colors.iconSecondary
                 )
             }
         }

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

@@ -172,7 +172,7 @@ private fun AggregatedReactionButton(
     val textColor = if (isHighlighted) {
         MaterialTheme.colorScheme.inversePrimary
     } else {
-        MaterialTheme.colorScheme.primary
+        ElementTheme.colors.textPrimary
     }
 
     val roundedCornerShape = RoundedCornerShape(corner = CornerSize(percent = 50))
@@ -250,12 +250,12 @@ private fun SenderRow(
                     text = name,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                     style = ElementTheme.typography.fontBodyMdRegular,
                 )
                 Text(
                     text = sentTime,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
                     style = ElementTheme.typography.fontBodySmRegular,
@@ -263,7 +263,7 @@ private fun SenderRow(
             }
             Text(
                 text = userId,
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
                 style = ElementTheme.typography.fontBodySmRegular,

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

@@ -18,7 +18,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -131,7 +130,7 @@ private fun ReadReceiptsAvatars(
 ) {
     val avatarSize = AvatarSize.TimelineReadReceipt.dp
     val avatarStrokeSize = 1.dp
-    val avatarStrokeColor = MaterialTheme.colorScheme.background
+    val avatarStrokeColor = ElementTheme.colors.bgCanvasDefault
     val receiptDescription = computeReceiptDescription(receipts)
     Row(
         modifier = modifier

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

@@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.wrapContentHeight
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -39,7 +38,7 @@ internal fun TimelineItemDaySeparatorView(
         Text(
             text = model.formattedDate,
             style = ElementTheme.typography.fontBodyMdMedium,
-            color = MaterialTheme.colorScheme.primary,
+            color = ElementTheme.colors.textPrimary,
         )
     }
 }

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

@@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -41,7 +40,7 @@ fun TimelineItemRoomBeginningView(
             stringResource(id = R.string.screen_room_timeline_beginning_of_room, roomName)
         }
         Text(
-            color = MaterialTheme.colorScheme.secondary,
+            color = ElementTheme.colors.textSecondary,
             style = ElementTheme.typography.fontBodyMdRegular,
             text = text,
             textAlign = TextAlign.Center,

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

@@ -16,7 +16,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBarsPadding
 import androidx.compose.foundation.layout.width
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -25,6 +24,8 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
+import io.element.android.libraries.designsystem.preview.ElementPreview
+import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.designsystem.text.toDp
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -37,24 +38,29 @@ internal fun Indicator(
     Row(
         modifier
             .fillMaxWidth()
-            .background(MaterialTheme.colorScheme.secondaryContainer)
+            .background(ElementTheme.colors.bgSubtlePrimary)
             .statusBarsPadding()
             .padding(vertical = 6.dp),
         horizontalArrangement = Arrangement.Center,
         verticalAlignment = Alignment.CenterVertically,
     ) {
-        val tint = MaterialTheme.colorScheme.primary
         Icon(
             imageVector = CompoundIcons.Offline(),
             contentDescription = null,
-            tint = tint,
+            tint = ElementTheme.colors.iconPrimary,
             modifier = Modifier.size(16.sp.toDp()),
         )
         Spacer(modifier = Modifier.width(8.dp))
         Text(
             text = stringResource(CommonStrings.common_offline),
             style = ElementTheme.typography.fontBodyMdMedium,
-            color = tint,
+            color = ElementTheme.colors.textPrimary,
         )
     }
 }
+
+@PreviewsDayNight
+@Composable
+internal fun IndicatorPreview() = ElementPreview {
+    Indicator()
+}

features/poll/impl/src/main/kotlin/io/element/android/features/poll/impl/history/PollHistoryView.kt

@@ -24,7 +24,6 @@ import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.rememberPagerState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SingleChoiceSegmentedButtonRow
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -236,7 +235,7 @@ private fun PollHistoryItemRow(
         Column(modifier = Modifier.padding(16.dp)) {
             Text(
                 text = pollHistoryItem.formattedDate,
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
                 style = ElementTheme.typography.fontBodySmRegular,
             )
             Spacer(modifier = Modifier.height(4.dp))

features/roomaliasresolver/impl/src/main/kotlin/io/element/android/features/roomaliasresolver/impl/RoomAliasResolverView.kt

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -25,6 +24,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.architecture.AsyncData
 import io.element.android.libraries.designsystem.atomic.atoms.PlaceholderAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewTitleAtom
@@ -127,7 +127,7 @@ private fun RoomAliasResolverContent(
                 Text(
                     text = stringResource(id = R.string.screen_room_alias_resolver_resolve_alias_failure),
                     textAlign = TextAlign.Center,
-                    color = MaterialTheme.colorScheme.error,
+                    color = ElementTheme.colors.textCriticalPrimary,
                 )
             }
         },

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

@@ -424,7 +424,7 @@ private fun TitleAndSubtitle(
             Text(
                 text = subtitle,
                 style = ElementTheme.typography.fontBodyLgRegular,
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
                 textAlign = TextAlign.Center,
             )
         }

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

@@ -26,7 +26,6 @@ import androidx.compose.foundation.lazy.LazyListScope
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SingleChoiceSegmentedButtonRow
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.SideEffect
@@ -278,7 +277,7 @@ private fun LazyListScope.roomMemberListSection(
                 modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp),
                 text = it(),
                 style = ElementTheme.typography.fontBodyLgRegular,
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
             )
         }
     }

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

@@ -13,7 +13,6 @@ import androidx.compose.foundation.layout.consumeWindowInsets
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -111,7 +110,7 @@ private fun RoomSpecificNotificationSettingsView(
                             .padding(start = 16.dp, bottom = 16.dp, end = 16.dp),
                         style = ElementTheme.typography.fontBodyMdRegular
                             .copy(
-                                color = MaterialTheme.colorScheme.secondary,
+                                color = ElementTheme.colors.textSecondary,
                             )
                     )
                     if (state.defaultRoomNotificationMode != null) {

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/rolesandpermissions/changeroles/ChangeRolesView.kt

@@ -29,7 +29,6 @@ import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -356,7 +355,7 @@ private fun MemberRow(
                     text = name,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                     style = ElementTheme.typography.fontBodyLgRegular,
                 )
                 // Invitation pending marker
@@ -365,7 +364,7 @@ private fun MemberRow(
                         modifier = Modifier.padding(start = 8.dp),
                         text = stringResource(id = R.string.screen_room_member_list_pending_header_title),
                         style = ElementTheme.typography.fontBodySmRegular.copy(fontStyle = FontStyle.Italic),
-                        color = MaterialTheme.colorScheme.secondary
+                        color = ElementTheme.colors.textSecondary
                     )
                 }
             }
@@ -373,7 +372,7 @@ private fun MemberRow(
             userId?.let {
                 Text(
                     text = userId,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
                     style = ElementTheme.typography.fontBodySmRegular,

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

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.statusBarsPadding
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.rememberTopAppBarState
 import androidx.compose.runtime.Composable
@@ -22,6 +21,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.PreviewParameter
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.features.leaveroom.api.LeaveRoomView
 import io.element.android.features.networkmonitor.api.ui.ConnectivityIndicatorContainer
@@ -90,7 +90,7 @@ fun RoomListView(
                     .statusBarsPadding()
                     .padding(top = topPadding)
                     .fillMaxSize()
-                    .background(MaterialTheme.colorScheme.background)
+                    .background(ElementTheme.colors.bgCanvasDefault)
             )
             acceptDeclineInviteView()
         }
@@ -152,14 +152,14 @@ private fun RoomListScaffold(
         floatingActionButton = {
             if (state.displayActions) {
                 FloatingActionButton(
-                    // FIXME align on Design system theme
+                    containerColor = ElementTheme.colors.iconPrimary,
-                    containerColor = MaterialTheme.colorScheme.primary,
                     onClick = onCreateRoomClick
                 ) {
                     Icon(
                         // Note cannot use Icons.Outlined.EditSquare, it does not exist :/
                         imageVector = CompoundIcons.Compose(),
-                        contentDescription = stringResource(id = R.string.screen_roomlist_a11y_create_message)
+                        contentDescription = stringResource(id = R.string.screen_roomlist_a11y_create_message),
+                        tint = ElementTheme.colors.iconOnSolidPrimary,
                     )
                 }
             }

features/userprofile/shared/src/main/kotlin/io/element/android/features/userprofile/shared/UserProfileHeaderSection.kt

@@ -13,7 +13,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -72,7 +71,7 @@ fun UserProfileHeaderSection(
         Text(
             text = userId.value,
             style = ElementTheme.typography.fontBodyLgRegular,
-            color = MaterialTheme.colorScheme.secondary,
+            color = ElementTheme.colors.textSecondary,
             textAlign = TextAlign.Center,
         )
         if (isUserVerified.dataOrNull() == true) {

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

@@ -18,7 +18,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.widthIn
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -49,7 +48,7 @@ internal fun VerificationContentVerifying(
                     modifier = Modifier.fillMaxWidth(),
                     text = text,
                     style = ElementTheme.typography.fontHeadingLgBold,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                     textAlign = TextAlign.Center,
                 )
             }
@@ -86,7 +85,7 @@ private fun EmojiItemView(emoji: VerificationEmoji, modifier: Modifier = Modifie
         Text(
             text = stringResource(id = emojiResource.nameRes),
             style = ElementTheme.typography.fontBodyMdRegular,
-            color = MaterialTheme.colorScheme.secondary,
+            color = ElementTheme.colors.textSecondary,
             maxLines = 1,
             overflow = TextOverflow.Ellipsis,
         )

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

@@ -7,24 +7,24 @@
 
 package io.element.android.libraries.designsystem
 
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.Color
+import io.element.android.compound.theme.ElementTheme
 
 @Composable
 fun Boolean.toEnabledColor(): Color {
     return if (this) {
-        MaterialTheme.colorScheme.primary
+        ElementTheme.colors.textPrimary
     } else {
-        MaterialTheme.colorScheme.primary.copy(alpha = 0.40f)
+        ElementTheme.colors.textDisabled
     }
 }
 
 @Composable
 fun Boolean.toSecondaryEnabledColor(): Color {
     return if (this) {
-        MaterialTheme.colorScheme.secondary
+        ElementTheme.colors.textSecondary
     } else {
-        MaterialTheme.colorScheme.secondary.copy(alpha = 0.40f)
+        ElementTheme.colors.textDisabled
     }
 }

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

@@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Home
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -45,7 +44,7 @@ fun RoundedIconAtom(
     size: RoundedIconAtomSize = RoundedIconAtomSize.Big,
     resourceId: Int? = null,
     imageVector: ImageVector? = null,
-    tint: Color = MaterialTheme.colorScheme.secondary,
+    tint: Color = ElementTheme.colors.iconSecondary,
     backgroundTint: Color = ElementTheme.colors.temporaryColorBgSpecial,
 ) {
     Box(

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

@@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -51,7 +50,7 @@ fun IconTitleSubtitleMolecule(
                 .fillMaxWidth(),
             textAlign = TextAlign.Center,
             style = ElementTheme.typography.fontHeadingMdBold,
-            color = MaterialTheme.colorScheme.primary,
+            color = ElementTheme.colors.textPrimary,
         )
         if (subTitle != null) {
             Spacer(Modifier.height(8.dp))
@@ -60,7 +59,7 @@ fun IconTitleSubtitleMolecule(
                 modifier = Modifier.fillMaxWidth(),
                 textAlign = TextAlign.Center,
                 style = ElementTheme.typography.fontBodyMdRegular,
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
             )
         }
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/HeaderFooterPage.kt

@@ -16,7 +16,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.movableContentOf
 import androidx.compose.runtime.remember
@@ -46,7 +45,7 @@ import io.element.android.libraries.designsystem.theme.components.Text
 fun HeaderFooterPage(
     modifier: Modifier = Modifier,
     paddingValues: PaddingValues = PaddingValues(20.dp),
-    containerColor: Color = MaterialTheme.colorScheme.background,
+    containerColor: Color = ElementTheme.colors.bgCanvasDefault,
     isScrollable: Boolean = false,
     background: @Composable () -> Unit = {},
     topBar: @Composable () -> Unit = {},

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/background/LightGradientBackground.kt

@@ -9,13 +9,13 @@ package io.element.android.libraries.designsystem.background
 
 import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.geometry.center
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.RadialGradientShader
 import androidx.compose.ui.graphics.ShaderBrush
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 
@@ -25,7 +25,7 @@ import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 @Composable
 fun LightGradientBackground(
     modifier: Modifier = Modifier,
-    backgroundColor: Color = MaterialTheme.colorScheme.background,
+    backgroundColor: Color = ElementTheme.colors.bgCanvasDefault,
     firstColor: Color = Color(0x1E0DBD8B),
     secondColor: Color = Color(0x001273EB),
     ratio: Float = 642 / 775f,

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

@@ -9,11 +9,11 @@ package io.element.android.libraries.designsystem.components
 
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Checkbox
@@ -38,7 +38,7 @@ fun LabelledCheckbox(
         )
         Text(
             text = text,
-            color = MaterialTheme.colorScheme.primary,
+            color = ElementTheme.colors.textPrimary,
         )
     }
 }

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

@@ -26,6 +26,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.Dialog
 import androidx.compose.ui.window.DialogProperties
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
@@ -64,13 +65,13 @@ fun ProgressDialog(
                 when (type) {
                     is ProgressDialogType.Indeterminate -> {
                         CircularProgressIndicator(
-                            color = MaterialTheme.colorScheme.primary
+                            color = ElementTheme.colors.iconPrimary
                         )
                     }
                     is ProgressDialogType.Determinate -> {
                         CircularProgressIndicator(
                             progress = { type.progress },
-                            color = MaterialTheme.colorScheme.primary
+                            color = ElementTheme.colors.iconPrimary
                         )
                     }
                 }
@@ -93,7 +94,7 @@ private fun ProgressDialogContent(
     onCancelClick: () -> Unit = {},
     progressIndicator: @Composable () -> Unit = {
         CircularProgressIndicator(
-            color = MaterialTheme.colorScheme.primary
+            color = ElementTheme.colors.iconPrimary
         )
     }
 ) {
@@ -114,7 +115,7 @@ private fun ProgressDialogContent(
                 Spacer(modifier = Modifier.height(22.dp))
                 Text(
                     text = text,
-                    color = MaterialTheme.colorScheme.primary,
+                    color = ElementTheme.colors.textPrimary,
                 )
             }
             if (showCancelButton) {

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

@@ -17,7 +17,6 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.material3.LocalContentColor
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
@@ -58,17 +57,16 @@ fun MainActionButton(
             .widthIn(min = 76.dp, max = 96.dp),
         horizontalAlignment = Alignment.CenterHorizontally,
     ) {
-        val tintColor = if (enabled) LocalContentColor.current else MaterialTheme.colorScheme.secondary
         Icon(
             imageVector = imageVector,
             contentDescription = contentDescription,
-            tint = tintColor,
+            tint = if (enabled) LocalContentColor.current else ElementTheme.colors.iconDisabled,
         )
         Spacer(modifier = Modifier.height(14.dp))
         Text(
             title,
             style = ElementTheme.typography.fontBodyMdMedium.copy(hyphens = Hyphens.Auto),
-            color = tintColor,
+            color = if (enabled) LocalContentColor.current else ElementTheme.colors.textDisabled,
             overflow = TextOverflow.Visible,
             textAlign = TextAlign.Center,
         )

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

@@ -159,7 +159,7 @@ internal fun SimpleAlertDialogContent(
         // most cases, TextButtons should be used for dismiss and confirm buttons.
         // TextButtons will not consume this provided content color value, and will used their
         // own defined or default colors.
-        buttonContentColor = MaterialTheme.colorScheme.primary,
+        buttonContentColor = ElementTheme.colors.textPrimary,
         applyPaddingToContents = applyPaddingToContents,
     )
 }

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

@@ -10,10 +10,10 @@ package io.element.android.libraries.designsystem.theme.components.previews
 import androidx.compose.material3.AlertDialogDefaults
 import androidx.compose.material3.DatePicker
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.rememberDatePickerState
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.tooling.preview.Preview
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.architecture.coverage.ExcludeFromCoverage
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
@@ -48,7 +48,7 @@ private fun ContentToPreview() {
         shape = AlertDialogDefaults.shape,
         containerColor = AlertDialogDefaults.containerColor,
         tonalElevation = AlertDialogDefaults.TonalElevation,
-        buttonContentColor = MaterialTheme.colorScheme.primary,
+        buttonContentColor = ElementTheme.colors.textPrimary,
         iconContentColor = AlertDialogDefaults.iconContentColor,
         titleContentColor = AlertDialogDefaults.titleContentColor,
         textContentColor = AlertDialogDefaults.textContentColor,

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

@@ -9,12 +9,12 @@ package io.element.android.libraries.designsystem.theme.components.previews
 
 import androidx.compose.material3.AlertDialogDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.TimePicker
 import androidx.compose.material3.TimePickerLayoutType
 import androidx.compose.material3.rememberTimePickerState
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.tooling.preview.Preview
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
@@ -35,7 +35,7 @@ internal fun TimePickerHorizontalPreview() {
             shape = AlertDialogDefaults.shape,
             containerColor = AlertDialogDefaults.containerColor,
             tonalElevation = AlertDialogDefaults.TonalElevation,
-            buttonContentColor = MaterialTheme.colorScheme.primary,
+            buttonContentColor = ElementTheme.colors.textPrimary,
             iconContentColor = AlertDialogDefaults.iconContentColor,
             titleContentColor = AlertDialogDefaults.titleContentColor,
             textContentColor = AlertDialogDefaults.textContentColor,
@@ -57,7 +57,7 @@ internal fun TimePickerVerticalLightPreview() {
             shape = AlertDialogDefaults.shape,
             containerColor = AlertDialogDefaults.containerColor,
             tonalElevation = AlertDialogDefaults.TonalElevation,
-            buttonContentColor = MaterialTheme.colorScheme.primary,
+            buttonContentColor = ElementTheme.colors.textPrimary,
             iconContentColor = AlertDialogDefaults.iconContentColor,
             titleContentColor = AlertDialogDefaults.titleContentColor,
             textContentColor = AlertDialogDefaults.textContentColor,
@@ -83,7 +83,7 @@ internal fun TimePickerVerticalDarkPreview() {
             shape = AlertDialogDefaults.shape,
             containerColor = AlertDialogDefaults.containerColor,
             tonalElevation = AlertDialogDefaults.TonalElevation,
-            buttonContentColor = MaterialTheme.colorScheme.primary,
+            buttonContentColor = ElementTheme.colors.textPrimary,
             iconContentColor = AlertDialogDefaults.iconContentColor,
             titleContentColor = AlertDialogDefaults.titleContentColor,
             textContentColor = AlertDialogDefaults.textContentColor,

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

@@ -17,7 +17,6 @@ import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.rememberCoroutineScope
@@ -97,7 +96,7 @@ private fun AvatarActionBottomSheetContent(
                     Text(
                         text = stringResource(action.titleResId),
                         style = ElementTheme.typography.fontBodyLgRegular,
-                        color = if (action.destructive) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.primary,
+                        color = if (action.destructive) ElementTheme.colors.textCriticalPrimary else ElementTheme.colors.textPrimary,
                     )
                 },
                 leadingContent = ListItemContent.Icon(IconSource.Resource(action.iconResourceId)),

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

@@ -17,7 +17,6 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
@@ -27,6 +26,7 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.tooling.preview.PreviewParameterProvider
 import androidx.compose.ui.unit.dp
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
@@ -79,7 +79,7 @@ fun EditableAvatarView(
                 modifier = Modifier
                     .align(Alignment.BottomEnd)
                     .clip(CircleShape)
-                    .background(MaterialTheme.colorScheme.primary)
+                    .background(ElementTheme.colors.iconPrimary)
                     .size(24.dp),
                 contentAlignment = Alignment.Center,
             ) {
@@ -87,7 +87,7 @@ fun EditableAvatarView(
                     modifier = Modifier.size(16.dp),
                     imageVector = CompoundIcons.EditSolid(),
                     contentDescription = null,
-                    tint = MaterialTheme.colorScheme.onPrimary,
+                    tint = ElementTheme.colors.iconOnSolidPrimary,
                 )
             }
         }

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

@@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
 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.unit.dp
@@ -40,7 +39,7 @@ fun InviteSenderView(
         Text(
             text = inviteSender.annotatedString(),
             style = ElementTheme.typography.fontBodyMdRegular,
-            color = MaterialTheme.colorScheme.secondary,
+            color = ElementTheme.colors.textSecondary,
         )
     }
 }

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

@@ -26,6 +26,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.components.avatar.CompositeAvatar
@@ -65,7 +66,7 @@ fun SelectedRoom(
             )
         }
         Surface(
-            color = MaterialTheme.colorScheme.primary,
+            color = ElementTheme.colors.iconPrimary,
             modifier = Modifier
                 .clip(CircleShape)
                 .size(20.dp)
@@ -79,7 +80,7 @@ fun SelectedRoom(
             Icon(
                 imageVector = CompoundIcons.Close(),
                 contentDescription = stringResource(id = CommonStrings.action_remove),
-                tint = MaterialTheme.colorScheme.onPrimary,
+                tint = ElementTheme.colors.iconOnSolidPrimary,
                 modifier = Modifier.padding(2.dp)
             )
         }

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

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -58,7 +57,7 @@ fun UnresolvedUserRow(
                 text = id,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                color = MaterialTheme.colorScheme.primary,
+                color = ElementTheme.colors.textPrimary,
                 style = ElementTheme.typography.fontBodyLgMedium,
             )
 
@@ -75,12 +74,11 @@ fun UnresolvedUserRow(
                         .size(18.dp)
                         .align(Alignment.Top)
                         .padding(2.dp),
-                    tint = MaterialTheme.colorScheme.error,
+                    tint = ElementTheme.colors.iconCriticalPrimary,
                 )
-
                 Text(
                     text = stringResource(CommonStrings.common_invite_unknown_profile),
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     style = ElementTheme.typography.fontBodySmRegular.copy(lineHeight = 16.sp),
                 )
             }

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

@@ -67,7 +67,7 @@ fun UnsavedAvatar(
                 modifier = Modifier
                     .align(Alignment.Center)
                     .size(40.dp),
-                tint = MaterialTheme.colorScheme.secondary,
+                tint = ElementTheme.colors.iconSecondary,
             )
         }
     }

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

@@ -12,7 +12,6 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -51,14 +50,14 @@ internal fun UserRow(
                 text = name,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                color = MaterialTheme.colorScheme.primary,
+                color = ElementTheme.colors.textPrimary,
                 style = ElementTheme.typography.fontBodyLgRegular,
             )
             // Id
             subtext?.let {
                 Text(
                     text = subtext,
-                    color = MaterialTheme.colorScheme.secondary,
+                    color = ElementTheme.colors.textSecondary,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
                     style = ElementTheme.typography.fontBodySmRegular,

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/messages/reply/InReplyToView.kt

@@ -140,7 +140,7 @@ private fun ReplyToErrorContent(
         Text(
             text = data.message,
             style = ElementTheme.typography.fontBodyMdRegular,
-            color = MaterialTheme.colorScheme.error,
+            color = ElementTheme.colors.textCriticalPrimary,
             maxLines = 2,
             overflow = TextOverflow.Ellipsis,
         )
@@ -171,7 +171,7 @@ private fun ReplyToContentText(metadata: InReplyToMetadata?) {
         if (iconResourceId != null) {
             Icon(
                 resourceId = iconResourceId,
-                tint = MaterialTheme.colorScheme.secondary,
+                tint = ElementTheme.colors.iconSecondary,
                 contentDescription = null,
                 modifier = Modifier.size(16.dp)
             )
@@ -182,7 +182,7 @@ private fun ReplyToContentText(metadata: InReplyToMetadata?) {
             style = ElementTheme.typography.fontBodyMdRegular,
             fontStyle = fontStyle,
             textAlign = TextAlign.Start,
-            color = MaterialTheme.colorScheme.secondary,
+            color = ElementTheme.colors.textSecondary,
             maxLines = 2,
             overflow = TextOverflow.Ellipsis,
         )

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/messages/sender/SenderName.kt

@@ -10,7 +10,6 @@ package io.element.android.libraries.matrix.ui.messages.sender
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -77,7 +76,7 @@ private fun RowScope.MainText(
     val color = when (mode) {
         is SenderNameMode.Timeline -> mode.mainColor
         SenderNameMode.ActionList,
-        SenderNameMode.Reply -> MaterialTheme.colorScheme.primary
+        SenderNameMode.Reply -> ElementTheme.colors.textPrimary
     }
     Text(
         modifier = modifier.clipToBounds(),
@@ -108,7 +107,7 @@ private fun RowScope.SecondaryText(
         modifier = modifier.clipToBounds(),
         text = text,
         style = style,
-        color = MaterialTheme.colorScheme.secondary,
+        color = ElementTheme.colors.textSecondary,
         maxLines = 1,
         overflow = TextOverflow.Ellipsis,
     )

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/model/InviteSender.kt

@@ -7,7 +7,6 @@
 
 package io.element.android.libraries.matrix.ui.model
 
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
 import androidx.compose.ui.platform.LocalContext
@@ -15,6 +14,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.SpanStyle
 import androidx.compose.ui.text.font.FontWeight
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.matrix.api.core.UserId
@@ -37,7 +37,7 @@ data class InviteSender(
                     AnnotatedString.Range(
                         SpanStyle(
                             fontWeight = FontWeight.Medium,
-                            color = MaterialTheme.colorScheme.primary
+                            color = ElementTheme.colors.textPrimary
                         ),
                         start = senderNameStart,
                         end = senderNameStart + displayName.length

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/details/MediaDeleteConfirmationBottomSheet.kt

@@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -141,7 +140,7 @@ private fun MediaRow(
             // Info
             Text(
                 text = state.mediaInfo.mimeType + " - " + state.mediaInfo.formattedFileSize,
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
                 style = ElementTheme.typography.fontBodySmRegular,

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/details/MediaDetailsBottomSheet.kt

@@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -165,7 +164,7 @@ private fun SenderRow(
             // Id
             Text(
                 text = mediaInfo.senderId?.value.orEmpty(),
-                color = MaterialTheme.colorScheme.secondary,
+                color = ElementTheme.colors.textSecondary,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
                 style = ElementTheme.typography.fontBodyMdRegular,

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/local/audio/MediaAudioView.kt

@@ -25,7 +25,6 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.GraphicEq
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.derivedStateOf
@@ -261,13 +260,13 @@ private fun ExoPlayerMediaAudioView(
                             modifier = Modifier
                                 .size(72.dp)
                                 .clip(CircleShape)
-                                .background(MaterialTheme.colorScheme.onBackground),
+                                .background(ElementTheme.colors.iconPrimary),
                             contentAlignment = Alignment.Center,
                         ) {
                             Icon(
                                 imageVector = Icons.Outlined.GraphicEq,
                                 contentDescription = null,
-                                tint = MaterialTheme.colorScheme.background,
+                                tint = ElementTheme.colors.iconOnSolidPrimary,
                                 modifier = Modifier
                                     .size(32.dp),
                             )
@@ -335,7 +334,7 @@ private fun AudioInfoView(
                 style = ElementTheme.typography.fontBodyMdRegular,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                color = MaterialTheme.colorScheme.primary
+                color = ElementTheme.colors.textPrimary
             )
         }
         if (info != null) {
@@ -346,7 +345,7 @@ private fun AudioInfoView(
                 style = ElementTheme.typography.fontBodyLgRegular,
                 overflow = TextOverflow.Ellipsis,
                 textAlign = TextAlign.Center,
-                color = MaterialTheme.colorScheme.primary
+                color = ElementTheme.colors.textPrimary
             )
             Spacer(modifier = Modifier.height(4.dp))
             Text(
@@ -354,7 +353,7 @@ private fun AudioInfoView(
                 style = ElementTheme.typography.fontBodyMdRegular,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                color = MaterialTheme.colorScheme.primary
+                color = ElementTheme.colors.textPrimary
             )
         }
     }

libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/local/file/MediaFileView.kt

@@ -21,7 +21,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.GraphicEq
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
@@ -72,13 +71,13 @@ fun MediaFileView(
                 modifier = Modifier
                     .size(72.dp)
                     .clip(CircleShape)
-                    .background(MaterialTheme.colorScheme.onBackground),
+                    .background(ElementTheme.colors.iconPrimary),
                 contentAlignment = Alignment.Center,
             ) {
                 Icon(
                     imageVector = if (isAudio) Icons.Outlined.GraphicEq else CompoundIcons.Attachment(),
                     contentDescription = null,
-                    tint = MaterialTheme.colorScheme.background,
+                    tint = ElementTheme.colors.iconOnSolidPrimary,
                     modifier = Modifier
                         .size(32.dp)
                         .rotate(if (isAudio) 0f else -45f),
@@ -92,7 +91,7 @@ fun MediaFileView(
                     style = ElementTheme.typography.fontBodyLgRegular,
                     overflow = TextOverflow.Ellipsis,
                     textAlign = TextAlign.Center,
-                    color = MaterialTheme.colorScheme.primary
+                    color = ElementTheme.colors.textPrimary
                 )
                 Spacer(modifier = Modifier.height(4.dp))
                 Text(
@@ -100,7 +99,7 @@ fun MediaFileView(
                     style = ElementTheme.typography.fontBodyMdRegular,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis,
-                    color = MaterialTheme.colorScheme.primary
+                    color = ElementTheme.colors.textPrimary
                 )
             }
         }

libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/ComposerModeView.kt

@@ -140,7 +140,7 @@ private fun ReplyToModeView(
         Icon(
             imageVector = CompoundIcons.Close(),
             contentDescription = stringResource(CommonStrings.action_close),
-            tint = MaterialTheme.colorScheme.secondary,
+            tint = ElementTheme.colors.iconSecondary,
             modifier = Modifier
                 .padding(end = 4.dp, top = 4.dp, start = 8.dp, bottom = 16.dp)
                 .size(16.dp)

tests/uitests/src/test/kotlin/base/ScreenshotTest.kt

@@ -11,7 +11,6 @@ import android.content.res.Configuration
 import android.os.LocaleList
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalConfiguration
@@ -55,7 +54,7 @@ object ScreenshotTest {
                 ElementTheme {
                     Box(
                         modifier = Modifier
-                            .background(MaterialTheme.colorScheme.background)
+                            .background(ElementTheme.colors.bgCanvasDefault)
                     ) {
                         preview()
                     }

tools/templates/files/fileTemplates/Template Presentation Classes.kt.child.2.kt

@@ -1,12 +1,12 @@
 #if (${PACKAGE_NAME} && ${PACKAGE_NAME} != "")package ${PACKAGE_NAME}#end
 
 import androidx.compose.foundation.layout.Box
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
+import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -19,7 +19,7 @@ fun ${NAME}View(
     Box(modifier, contentAlignment = Alignment.Center) {
         Text(
             "${NAME} feature view",
-            color = MaterialTheme.colorScheme.primary,
+            color = ElementTheme.colors.textprimary,
         )
     }
 }