From 32cc18e314bbdec064a0d767643fcf25bc8f5cfd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Forlini?= Date: Mon, 29 Dec 2025 09:48:01 +0100 Subject: [PATCH] Minor tweaks to FeatureSpotlightScreen ET-5607 --- .../presentation/ui/FeatureSpotlightScreen.kt | 44 ++++++++++++++----- 1 file changed, 33 insertions(+), 11 deletions(-) diff --git a/mail-spotlight/presentation/src/main/kotlin/ch/protonmail/android/mailspotlight/presentation/ui/FeatureSpotlightScreen.kt b/mail-spotlight/presentation/src/main/kotlin/ch/protonmail/android/mailspotlight/presentation/ui/FeatureSpotlightScreen.kt index fab77aaaee..a506686a5e 100644 --- a/mail-spotlight/presentation/src/main/kotlin/ch/protonmail/android/mailspotlight/presentation/ui/FeatureSpotlightScreen.kt +++ b/mail-spotlight/presentation/src/main/kotlin/ch/protonmail/android/mailspotlight/presentation/ui/FeatureSpotlightScreen.kt @@ -49,6 +49,8 @@ import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Brush +import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.layout.onSizeChanged import androidx.compose.ui.platform.LocalConfiguration @@ -56,6 +58,7 @@ import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.vectorResource +import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.tooling.preview.Preview @@ -73,6 +76,7 @@ import ch.protonmail.android.mailspotlight.presentation.model.FeatureItem import ch.protonmail.android.mailspotlight.presentation.viewmodel.FeatureSpotlightViewModel import ch.protonmail.android.uicomponents.BottomNavigationBarSpacer import ch.protonmail.android.uicomponents.TopNavigationBarSpacer +import dev.chrisbanes.haze.HazeProgressive import dev.chrisbanes.haze.HazeStyle import dev.chrisbanes.haze.HazeTint import dev.chrisbanes.haze.hazeEffect @@ -116,11 +120,17 @@ private fun FeatureSpotlightScreen( Box( modifier = modifier + .background( + Brush.linearGradient( + colors = listOf(ProtonTheme.colors.brandMinus40, ProtonTheme.colors.backgroundNorm) + ) + ) .windowInsetsPadding(WindowInsets.safeDrawing.only(WindowInsetsSides.Horizontal)) ) { Column( modifier = Modifier .fillMaxSize() + .padding(horizontal = ProtonDimens.Spacing.Large) .hazeSource(hazeState) .verticalScroll(rememberScrollState()), verticalArrangement = Arrangement.Top, @@ -135,25 +145,27 @@ private fun FeatureSpotlightScreen( contentDescription = NO_CONTENT_DESCRIPTION ) - Spacer(modifier = Modifier.height(ProtonDimens.Spacing.Standard)) + Spacer(modifier = Modifier.height(ProtonDimens.Spacing.ExtraLarge)) Text( text = appVersionUiModel.text.string(), style = ProtonTheme.typography.titleMedium, - color = ProtonTheme.colors.textWeak + color = ProtonTheme.colors.textWeak, + textAlign = TextAlign.Center ) - Spacer(modifier = Modifier.height(ProtonDimens.Spacing.Standard)) + Spacer(modifier = Modifier.height(ProtonDimens.Spacing.Medium)) Text( text = stringResource(R.string.spotlight_screen_title), - style = ProtonTheme.typography.titleLarge + style = ProtonTheme.typography.headlineMedium.copy(fontWeight = FontWeight.Bold), + textAlign = TextAlign.Center ) - Spacer(modifier = Modifier.height(ProtonDimens.Spacing.Huge)) + Spacer(modifier = Modifier.height(ProtonDimens.Spacing.Jumbo)) Column( - modifier = Modifier.padding(horizontal = ProtonDimens.Spacing.ExtraLarge), + modifier = Modifier.padding(horizontal = ProtonDimens.Spacing.Large), verticalArrangement = Arrangement.spacedBy(ProtonDimens.Spacing.ExtraLarge) ) { featureItems.forEach { @@ -174,16 +186,24 @@ private fun FeatureSpotlightScreen( .hazeEffect( state = hazeState, style = HazeStyle( - tint = HazeTint(color = ProtonTheme.colors.backgroundNorm.copy(0.6f)), - fallbackTint = HazeTint(color = ProtonTheme.colors.backgroundNorm) + tint = HazeTint(color = Color.Transparent), + fallbackTint = HazeTint(color = ProtonTheme.colors.backgroundNorm), + noiseFactor = 0f, + blurRadius = BLUR_RADIUS ) - ) + ) { + progressive = HazeProgressive.verticalGradient( + preferPerformance = true, + startIntensity = 0f, + endIntensity = .5f + ) + } ) { ProtonTextButton( modifier = Modifier .fillMaxWidth() - .padding(horizontal = ProtonDimens.Spacing.Standard) - .padding(bottom = ProtonDimens.Spacing.Standard) + .padding(horizontal = ProtonDimens.Spacing.Large) + .padding(bottom = ProtonDimens.Spacing.Large) .background( color = ProtonTheme.colors.brandNorm, shape = ProtonTheme.shapes.massive @@ -244,6 +264,8 @@ private fun FeatureRow( } } +private val BLUR_RADIUS = 2.dp + @Preview(uiMode = Configuration.UI_MODE_NIGHT_NO, showBackground = true) @Preview(uiMode = Configuration.UI_MODE_NIGHT_YES, showBackground = true) @Composable