diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/base/util/ModifierExtensions.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/base/util/ModifierExtensions.kt index cc44a0c965..92098c0b95 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/base/util/ModifierExtensions.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/base/util/ModifierExtensions.kt @@ -142,6 +142,15 @@ fun Modifier.bottomDivider( alpha: Float = 1f, ): Modifier = drawWithCache { onDrawWithContent { + val (startX, endX) = when (layoutDirection) { + LayoutDirection.Ltr -> { + paddingStart.toPx() to (size.width - paddingEnd.toPx()) + } + + LayoutDirection.Rtl -> { + (size.width - paddingEnd.toPx()) to paddingStart.toPx() + } + } drawContent() if (enabled) { drawLine( @@ -149,11 +158,11 @@ fun Modifier.bottomDivider( color = color, strokeWidth = thickness.toPx(), start = Offset( - x = paddingStart.toPx(), + x = startX, y = size.height - thickness.toPx() / 2, ), end = Offset( - x = size.width - paddingEnd.toPx(), + x = endX, y = size.height - thickness.toPx() / 2, ), ) diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsScreen.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsScreen.kt index dbca198521..b841ef11b7 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsScreen.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsScreen.kt @@ -1,5 +1,6 @@ package com.x8bit.bitwarden.ui.platform.feature.settings +import androidx.annotation.DrawableRes import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column @@ -98,7 +99,12 @@ fun SettingsScreen( key = settingEntry, defaultValue = 0, ), - cardStyle = Settings.entries.toListItemCardStyle(index = index), + cardStyle = Settings.entries.toListItemCardStyle( + index = index, + // Start padding, plus icon, plus spacing between text. + dividerPadding = 48.dp, + ), + iconVectorResource = settingEntry.vectorIconRes, modifier = Modifier .testTag(tag = settingEntry.testTag) .standardHorizontalMargin() @@ -115,28 +121,40 @@ private fun SettingsRow( onClick: () -> Unit, notificationCount: Int, cardStyle: CardStyle?, + @DrawableRes iconVectorResource: Int, modifier: Modifier = Modifier, ) { Row( modifier = modifier + .fillMaxWidth() .defaultMinSize(minHeight = 60.dp) .cardStyle( cardStyle = cardStyle, onClick = onClick, - paddingStart = 16.dp, + paddingStart = 12.dp, paddingEnd = 12.dp, ), horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically, ) { - Text( - modifier = Modifier - .padding(end = 16.dp) - .weight(weight = 1f), - text = text(), - style = BitwardenTheme.typography.bodyLarge, - color = BitwardenTheme.colorScheme.text.primary, - ) + Row( + verticalAlignment = Alignment.CenterVertically, + ) { + Icon( + painter = rememberVectorPainter(iconVectorResource), + contentDescription = null, + tint = BitwardenTheme.colorScheme.icon.primary, + modifier = Modifier.size(24.dp), + ) + Spacer(Modifier.width(12.dp)) + Text( + modifier = Modifier + .padding(end = 16.dp), + text = text(), + style = BitwardenTheme.typography.bodyLarge, + color = BitwardenTheme.colorScheme.text.primary, + ) + } TrailingContent(notificationCount = notificationCount) } } @@ -185,7 +203,11 @@ private fun SettingsRows_preview() { text = it.text, onClick = { }, notificationCount = index % 3, - cardStyle = Settings.entries.toListItemCardStyle(index = index), + iconVectorResource = it.vectorIconRes, + cardStyle = Settings.entries.toListItemCardStyle( + index = index, + dividerPadding = 48.dp, + ), ) } } diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsViewModel.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsViewModel.kt index d138076fd6..c7551faf2e 100644 --- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsViewModel.kt +++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/SettingsViewModel.kt @@ -1,5 +1,6 @@ package com.x8bit.bitwarden.ui.platform.feature.settings +import androidx.annotation.DrawableRes import androidx.compose.material3.Text import androidx.lifecycle.viewModelScope import com.x8bit.bitwarden.R @@ -194,30 +195,37 @@ sealed class SettingsAction { */ enum class Settings( val text: Text, + @DrawableRes val vectorIconRes: Int, val testTag: String, ) { ACCOUNT_SECURITY( text = R.string.account_security.asText(), + vectorIconRes = R.drawable.ic_locked, testTag = "AccountSecuritySettingsButton", ), AUTO_FILL( text = R.string.autofill.asText(), + vectorIconRes = R.drawable.ic_check_mark, testTag = "AutofillSettingsButton", ), VAULT( text = R.string.vault.asText(), + vectorIconRes = R.drawable.ic_vault, testTag = "VaultSettingsButton", ), APPEARANCE( text = R.string.appearance.asText(), + vectorIconRes = R.drawable.ic_paintbrush, testTag = "AppearanceSettingsButton", ), OTHER( text = R.string.other.asText(), + vectorIconRes = R.drawable.ic_filter, testTag = "OtherSettingsButton", ), ABOUT( text = R.string.about.asText(), + vectorIconRes = R.drawable.ic_info_circle, testTag = "AboutSettingsButton", ), } diff --git a/app/src/main/res/drawable/ic_filter.xml b/app/src/main/res/drawable/ic_filter.xml new file mode 100644 index 0000000000..171d167c36 --- /dev/null +++ b/app/src/main/res/drawable/ic_filter.xml @@ -0,0 +1,22 @@ + + + + + + diff --git a/app/src/main/res/drawable/ic_info_circle.xml b/app/src/main/res/drawable/ic_info_circle.xml new file mode 100644 index 0000000000..718bdb6a42 --- /dev/null +++ b/app/src/main/res/drawable/ic_info_circle.xml @@ -0,0 +1,16 @@ + + + + + diff --git a/app/src/main/res/drawable/ic_paintbrush.xml b/app/src/main/res/drawable/ic_paintbrush.xml new file mode 100644 index 0000000000..17e7132ebf --- /dev/null +++ b/app/src/main/res/drawable/ic_paintbrush.xml @@ -0,0 +1,13 @@ + + + +