From df5ef14597cd399c504525bbe6dd6216551afbcb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jakub=20=C5=BBerko?= Date: Fri, 20 Dec 2024 09:27:50 +0100 Subject: [PATCH] fix: tertiary selected button color [WPB-15120] (#3757) --- .../com/wire/android/ui/home/HomeTopBar.kt | 33 +++++++++--- .../ui/common/button/WireTertiaryButton.kt | 27 +++++----- .../common/button/WireTertiaryIconButton.kt | 51 ++++++++++++++++--- .../wire/android/ui/theme/WireColorScheme.kt | 4 +- 4 files changed, 87 insertions(+), 28 deletions(-) diff --git a/app/src/main/kotlin/com/wire/android/ui/home/HomeTopBar.kt b/app/src/main/kotlin/com/wire/android/ui/home/HomeTopBar.kt index 9f34130884c..d3fd259605d 100644 --- a/app/src/main/kotlin/com/wire/android/ui/home/HomeTopBar.kt +++ b/app/src/main/kotlin/com/wire/android/ui/home/HomeTopBar.kt @@ -70,11 +70,11 @@ fun HomeTopBar( } if (navigationItem.withUserAvatar) { val openLabel = stringResource(R.string.content_description_open_label) - val contentDescription = if (shouldShowCreateTeamUnreadIndicator) { - stringResource(R.string.content_description_home_profile_btn_with_notification) - } else { - stringResource(R.string.content_description_home_profile_btn) - } + val contentDescription = if (shouldShowCreateTeamUnreadIndicator) { + stringResource(R.string.content_description_home_profile_btn_with_notification) + } else { + stringResource(R.string.content_description_home_profile_btn) + } UserProfileAvatar( avatarData = userAvatarData, clickable = remember { @@ -87,7 +87,7 @@ fun HomeTopBar( legalHoldIndicatorVisible = withLegalHoldIndicator ), shouldShowCreateTeamUnreadIndicator = shouldShowCreateTeamUnreadIndicator, - contentDescription = contentDescription + contentDescription = contentDescription ) } }, @@ -112,6 +112,27 @@ fun PreviewTopBar() { } } +@PreviewMultipleThemes +@Composable +fun PreviewTopBarWithSelectedFilter() { + WireTheme { + HomeTopBar( + navigationItem = HomeDestination.Group, + userAvatarData = UserAvatarData( + asset = null, + availabilityStatus = UserAvailabilityStatus.AVAILABLE, + nameBasedAvatar = NameBasedAvatar("Jon Doe", -1) + ), + elevation = 0.dp, + withLegalHoldIndicator = false, + shouldShowCreateTeamUnreadIndicator = false, + onHamburgerMenuClick = {}, + onNavigateToSelfUserProfile = {}, + onOpenConversationFilter = {} + ) + } +} + @PreviewMultipleThemes @Composable fun PreviewSettingsTopBarWithoutAvatar() { diff --git a/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryButton.kt b/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryButton.kt index 80696e05ecf..78e8ac5afac 100644 --- a/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryButton.kt +++ b/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryButton.kt @@ -32,14 +32,15 @@ import androidx.compose.runtime.remember import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Shape import androidx.compose.ui.text.TextStyle -import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpSize import androidx.compose.ui.unit.dp import com.wire.android.model.ClickBlockParams import com.wire.android.ui.common.Icon +import com.wire.android.ui.theme.WireTheme import com.wire.android.ui.theme.wireDimensions import com.wire.android.ui.theme.wireTypography +import com.wire.android.util.PreviewMultipleThemes @Composable fun WireTertiaryButton( @@ -93,15 +94,15 @@ fun WireTertiaryButton( description = description ) -@Preview(name = "Default WireSecondaryButton") +@PreviewMultipleThemes @Composable -fun PreviewWireTertiaryButton() { +fun PreviewWireTertiaryButton() = WireTheme { WireTertiaryButton(onClick = { }, text = "text") } -@Preview(name = "Default narrow WireTertiaryButton with icon") +@PreviewMultipleThemes @Composable -fun PreviewWireTertiaryButtonNarrowWithIcons() { +fun PreviewWireTertiaryButtonNarrowWithIcons() = WireTheme { WireTertiaryButton( onClick = { }, text = "text", @@ -111,9 +112,9 @@ fun PreviewWireTertiaryButtonNarrowWithIcons() { ) } -@Preview(name = "Default narrow WireTertiaryButton only icon") +@PreviewMultipleThemes @Composable -fun PreviewWireTertiaryButtonNarrowOnlyIcons() { +fun PreviewWireTertiaryButtonNarrowOnlyIcons() = WireTheme { WireTertiaryButton( onClick = { }, leadingIcon = Icons.Filled.Search.Icon(), @@ -122,20 +123,20 @@ fun PreviewWireTertiaryButtonNarrowOnlyIcons() { ) } -@Preview(name = "Default narrow Disabled WireSecondaryButton") +@PreviewMultipleThemes @Composable -fun PreviewWireTertiaryButtonDisabled() { +fun PreviewWireTertiaryButtonDisabled() = WireTheme { WireTertiaryButton(onClick = { }, state = WireButtonState.Disabled, text = "text", fillMaxWidth = false) } -@Preview(name = "Selected narrow WireSecondaryButton") +@PreviewMultipleThemes @Composable -fun PreviewWireTertiaryButtonSelected() { +fun PreviewWireTertiaryButtonSelected() = WireTheme { WireTertiaryButton(onClick = { }, state = WireButtonState.Selected, text = "text", fillMaxWidth = false) } -@Preview(name = "Error narrow WireSecondaryButton") +@PreviewMultipleThemes @Composable -fun PreviewWireTertiaryButtonError() { +fun PreviewWireTertiaryButtonError() = WireTheme { WireTertiaryButton(onClick = { }, state = WireButtonState.Error, text = "text", fillMaxWidth = false) } diff --git a/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryIconButton.kt b/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryIconButton.kt index 3f7b63ebbd6..fdaa1bc9177 100644 --- a/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryIconButton.kt +++ b/core/ui-common/src/main/kotlin/com/wire/android/ui/common/button/WireTertiaryIconButton.kt @@ -31,13 +31,14 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Shape import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource -import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpSize import androidx.compose.ui.unit.dp import com.wire.android.model.ClickBlockParams import com.wire.android.ui.common.R import com.wire.android.ui.common.dimensions +import com.wire.android.ui.common.preview.MultipleThemePreviews +import com.wire.android.ui.theme.WireTheme import com.wire.android.ui.theme.wireDimensions @Composable @@ -78,21 +79,57 @@ fun WireTertiaryIconButton( ) } -@Preview +@MultipleThemePreviews @Composable -fun PreviewWireTertiaryIconButton() { +fun PreviewWireTertiaryIconButton() = WireTheme { WireTertiaryIconButton({}, loading = false, iconResource = R.drawable.ic_close, contentDescription = 0) } -@Preview +@MultipleThemePreviews @Composable -fun PreviewWireTertiaryIconButtonLoading() { +fun PreviewWireTertiaryIconButtonSelected() = WireTheme { + WireTertiaryIconButton( + {}, + loading = false, + iconResource = R.drawable.ic_close, + contentDescription = 0, + state = WireButtonState.Selected, + ) +} + +@MultipleThemePreviews +@Composable +fun PreviewWireTertiaryIconButtonError() = WireTheme { + WireTertiaryIconButton( + {}, + loading = false, + iconResource = R.drawable.ic_close, + contentDescription = 0, + state = WireButtonState.Error, + ) +} + +@MultipleThemePreviews +@Composable +fun PreviewWireTertiaryIconButtonDisabled() = WireTheme { + WireTertiaryIconButton( + {}, + loading = false, + iconResource = R.drawable.ic_close, + contentDescription = 0, + state = WireButtonState.Disabled, + ) +} + +@MultipleThemePreviews +@Composable +fun PreviewWireTertiaryIconButtonLoading() = WireTheme { WireTertiaryIconButton({}, loading = true, iconResource = R.drawable.ic_close, contentDescription = 0) } -@Preview +@MultipleThemePreviews @Composable -fun PreviewWireTertiaryIconButtonRound() { +fun PreviewWireTertiaryIconButtonRound() = WireTheme { WireTertiaryIconButton( {}, loading = false, diff --git a/core/ui-common/src/main/kotlin/com/wire/android/ui/theme/WireColorScheme.kt b/core/ui-common/src/main/kotlin/com/wire/android/ui/theme/WireColorScheme.kt index e6599228ef0..f7f84e9d861 100644 --- a/core/ui-common/src/main/kotlin/com/wire/android/ui/theme/WireColorScheme.kt +++ b/core/ui-common/src/main/kotlin/com/wire/android/ui/theme/WireColorScheme.kt @@ -227,8 +227,8 @@ private val DarkWireColorScheme = WireColorScheme( secondaryButtonRipple = Color.White, tertiaryButtonEnabled = Color.Transparent, onTertiaryButtonEnabled = Color.White, tertiaryButtonDisabled = Color.Transparent, onTertiaryButtonDisabled = WireColorPalette.Gray60, - tertiaryButtonSelected = WireColorPalette.DarkBlue50, onTertiaryButtonSelected = WireColorPalette.DarkBlue500, - tertiaryButtonSelectedOutline = WireColorPalette.DarkBlue300, + tertiaryButtonSelected = WireColorPalette.DarkBlue800, onTertiaryButtonSelected = WireColorPalette.DarkBlue500, + tertiaryButtonSelectedOutline = WireColorPalette.DarkBlue800, tertiaryButtonRipple = Color.White, // strokes and shadows