Use gradient color in ComposerAlertMolecule. Fixes #6192

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/crypto/identity/IdentityChangeStateView.kt

@@ -115,7 +115,7 @@ private fun ViolationAlert(
         },
         submitText = stringResource(submitTextId),
         onSubmitClick = onSubmitClick,
-        level = if (isCritical) ComposerAlertLevel.Critical else ComposerAlertLevel.Default,
+        level = if (isCritical) ComposerAlertLevel.Critical else ComposerAlertLevel.Info,
     )
 }
 

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

@@ -26,6 +26,8 @@ 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.colors.gradientCriticalColors
+import io.element.android.libraries.designsystem.colors.gradientInfoColors
 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.AvatarType
@@ -38,6 +40,9 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.ui.strings.CommonStrings
 
+/**
+ * Ref: https://www.figma.com/design/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?node-id=2392-6721
+ */
 @Composable
 fun ComposerAlertMolecule(
     avatar: AvatarData?,
@@ -57,12 +62,6 @@ fun ComposerAlertMolecule(
             ComposerAlertLevel.Critical -> ElementTheme.colors.borderCriticalSubtle
         }
 
-        val startColor = when (level) {
-            ComposerAlertLevel.Default -> ElementTheme.colors.bgInfoSubtle
-            ComposerAlertLevel.Info -> ElementTheme.colors.bgInfoSubtle
-            ComposerAlertLevel.Critical -> ElementTheme.colors.bgCriticalSubtle
-        }
-
         val textColor = when (level) {
             ComposerAlertLevel.Default -> ElementTheme.colors.textPrimary
             ComposerAlertLevel.Info -> ElementTheme.colors.textInfoPrimary
@@ -75,12 +74,17 @@ fun ComposerAlertMolecule(
                 .height(1.dp)
                 .background(lineColor)
         )
-        val brush = Brush.verticalGradient(
+        val gradientColors = when (level) {
-            listOf(startColor, ElementTheme.colors.bgCanvasDefault),
+            ComposerAlertLevel.Default -> listOf(
-        )
+                ElementTheme.colors.bgInfoSubtle,
+                ElementTheme.colors.bgInfoSubtle,
+            )
+            ComposerAlertLevel.Info -> gradientInfoColors()
+            ComposerAlertLevel.Critical -> gradientCriticalColors()
+        }
         Box(
             modifier = Modifier
-                .background(brush)
+                .background(Brush.verticalGradient(gradientColors))
                 .padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 8.dp)
         ) {
             Column(

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

@@ -23,7 +23,6 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
-import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @Composable
 internal fun VoiceMessageRecorderButtonIcon(