Tweak BitwardenListHeaderText and BitwardenWideSwitch to follow patterns. (#195)

This commit is contained in:
David Perez 2023-11-01 16:14:54 -05:00 committed by Álison Fernandes
parent c6cf9712e1
commit 5dbe07a2cc
5 changed files with 70 additions and 58 deletions

View file

@ -24,7 +24,10 @@ fun BitwardenListHeaderText(
text = label, text = label,
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant, color = MaterialTheme.colorScheme.onSurfaceVariant,
modifier = modifier.padding(top = 8.dp), modifier = modifier.padding(
top = 12.dp,
bottom = 4.dp,
),
) )
} }

View file

@ -4,8 +4,10 @@ import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.material.ripple.rememberRipple import androidx.compose.material.ripple.rememberRipple
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
@ -44,7 +46,6 @@ fun BitwardenWideSwitch(
horizontalArrangement = Arrangement.SpaceBetween, horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
modifier = Modifier modifier = Modifier
.fillMaxWidth()
.wrapContentHeight() .wrapContentHeight()
.clickable( .clickable(
interactionSource = remember { MutableInteractionSource() }, interactionSource = remember { MutableInteractionSource() },
@ -53,9 +54,7 @@ fun BitwardenWideSwitch(
) )
.semantics(mergeDescendants = true) { .semantics(mergeDescendants = true) {
toggleableState = ToggleableState(isChecked) toggleableState = ToggleableState(isChecked)
if (contentDescription != null) { contentDescription?.let { this.contentDescription = it }
this.contentDescription = contentDescription
}
} }
.then(modifier), .then(modifier),
) { ) {
@ -63,8 +62,13 @@ fun BitwardenWideSwitch(
text = label, text = label,
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onSurface, color = MaterialTheme.colorScheme.onSurface,
modifier = Modifier
.weight(1f)
.padding(vertical = 8.dp),
) )
Spacer(modifier = Modifier.width(16.dp))
Switch( Switch(
modifier = Modifier modifier = Modifier
.height(56.dp), .height(56.dp),

View file

@ -161,7 +161,7 @@ private fun ContentColum(
isChecked = state.isSubmitCrashLogsEnabled, isChecked = state.isSubmitCrashLogsEnabled,
onCheckedChange = onSubmitCrashLogsCheckedChange, onCheckedChange = onSubmitCrashLogsCheckedChange,
modifier = Modifier modifier = Modifier
.defaultMinSize(56.dp) .fillMaxWidth()
.padding(horizontal = 16.dp), .padding(horizontal = 16.dp),
contentDescription = stringResource(id = R.string.submit_crash_logs), contentDescription = stringResource(id = R.string.submit_crash_logs),
) )

View file

@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentWidth import androidx.compose.foundation.layout.wrapContentWidth
@ -47,14 +46,14 @@ import androidx.lifecycle.compose.collectAsStateWithLifecycle
import com.x8bit.bitwarden.R import com.x8bit.bitwarden.R
import com.x8bit.bitwarden.ui.platform.base.util.EventsEffect import com.x8bit.bitwarden.ui.platform.base.util.EventsEffect
import com.x8bit.bitwarden.ui.platform.base.util.toDp import com.x8bit.bitwarden.ui.platform.base.util.toDp
import com.x8bit.bitwarden.ui.platform.components.BitwardenIconButtonWithResource
import com.x8bit.bitwarden.ui.platform.components.BitwardenListHeaderText import com.x8bit.bitwarden.ui.platform.components.BitwardenListHeaderText
import com.x8bit.bitwarden.ui.platform.components.BitwardenMediumTopAppBar import com.x8bit.bitwarden.ui.platform.components.BitwardenMediumTopAppBar
import com.x8bit.bitwarden.ui.platform.components.BitwardenMultiSelectButton import com.x8bit.bitwarden.ui.platform.components.BitwardenMultiSelectButton
import com.x8bit.bitwarden.ui.platform.components.BitwardenOverflowActionItem import com.x8bit.bitwarden.ui.platform.components.BitwardenOverflowActionItem
import com.x8bit.bitwarden.ui.platform.components.BitwardenTextField
import com.x8bit.bitwarden.ui.platform.components.BitwardenReadOnlyTextFieldWithActions import com.x8bit.bitwarden.ui.platform.components.BitwardenReadOnlyTextFieldWithActions
import com.x8bit.bitwarden.ui.platform.components.BitwardenTextField
import com.x8bit.bitwarden.ui.platform.components.BitwardenWideSwitch import com.x8bit.bitwarden.ui.platform.components.BitwardenWideSwitch
import com.x8bit.bitwarden.ui.platform.components.BitwardenIconButtonWithResource
import com.x8bit.bitwarden.ui.platform.components.model.IconResource import com.x8bit.bitwarden.ui.platform.components.model.IconResource
import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
import com.x8bit.bitwarden.ui.tools.feature.generator.GeneratorState.MainType.Passcode.PasscodeType.Password.Companion.PASSWORD_LENGTH_SLIDER_MAX import com.x8bit.bitwarden.ui.tools.feature.generator.GeneratorState.MainType.Passcode.PasscodeType.Password.Companion.PASSWORD_LENGTH_SLIDER_MAX
@ -167,15 +166,12 @@ private fun ScrollContent(
onMainStateOptionClicked = onMainStateOptionClicked, onMainStateOptionClicked = onMainStateOptionClicked,
) )
Row( BitwardenListHeaderText(
Modifier.height(32.dp), label = stringResource(id = R.string.options),
verticalAlignment = Alignment.Bottom, modifier = Modifier
) { .fillMaxWidth()
BitwardenListHeaderText( .padding(horizontal = 16.dp),
label = stringResource(id = R.string.options), )
modifier = Modifier.padding(horizontal = 16.dp),
)
}
when (val selectedType = state.selectedType) { when (val selectedType = state.selectedType) {
is GeneratorState.MainType.Passcode -> { is GeneratorState.MainType.Passcode -> {
@ -419,7 +415,9 @@ private fun PasswordCapitalLettersToggleItem(
label = "A—Z", label = "A—Z",
isChecked = useCapitals, isChecked = useCapitals,
onCheckedChange = onPasswordToggleCapitalLettersChange, onCheckedChange = onPasswordToggleCapitalLettersChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
contentDescription = stringResource(id = R.string.uppercase_ato_z), contentDescription = stringResource(id = R.string.uppercase_ato_z),
) )
} }
@ -433,7 +431,9 @@ private fun PasswordLowercaseLettersToggleItem(
label = "a—z", label = "a—z",
isChecked = useLowercase, isChecked = useLowercase,
onCheckedChange = onPasswordToggleLowercaseLettersChange, onCheckedChange = onPasswordToggleLowercaseLettersChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
contentDescription = stringResource(id = R.string.lowercase_ato_z), contentDescription = stringResource(id = R.string.lowercase_ato_z),
) )
} }
@ -447,7 +447,9 @@ private fun PasswordNumbersToggleItem(
label = "0-9", label = "0-9",
isChecked = useNumbers, isChecked = useNumbers,
onCheckedChange = onPasswordToggleNumbersChange, onCheckedChange = onPasswordToggleNumbersChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
contentDescription = stringResource(id = R.string.numbers_zero_to_nine), contentDescription = stringResource(id = R.string.numbers_zero_to_nine),
) )
} }
@ -461,7 +463,9 @@ private fun PasswordSpecialCharactersToggleItem(
label = "!@#$%^&*", label = "!@#$%^&*",
isChecked = useSpecialChars, isChecked = useSpecialChars,
onCheckedChange = onPasswordToggleSpecialCharactersChange, onCheckedChange = onPasswordToggleSpecialCharactersChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
contentDescription = stringResource(id = R.string.special_characters), contentDescription = stringResource(id = R.string.special_characters),
) )
} }
@ -539,7 +543,9 @@ private fun PasswordAvoidAmbiguousCharsToggleItem(
label = stringResource(id = R.string.avoid_ambiguous_characters), label = stringResource(id = R.string.avoid_ambiguous_characters),
isChecked = avoidAmbiguousChars, isChecked = avoidAmbiguousChars,
onCheckedChange = onPasswordToggleAvoidAmbiguousCharsChange, onCheckedChange = onPasswordToggleAvoidAmbiguousCharsChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
) )
} }
@ -636,7 +642,9 @@ private fun PassphraseCapitalizeToggleItem(
label = stringResource(id = R.string.capitalize), label = stringResource(id = R.string.capitalize),
isChecked = capitalize, isChecked = capitalize,
onCheckedChange = onPassphraseCapitalizeToggleChange, onCheckedChange = onPassphraseCapitalizeToggleChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
) )
} }
@ -649,7 +657,9 @@ private fun PassphraseIncludeNumberToggleItem(
label = stringResource(id = R.string.include_number), label = stringResource(id = R.string.include_number),
isChecked = includeNumber, isChecked = includeNumber,
onCheckedChange = onPassphraseIncludeNumberToggleChange, onCheckedChange = onPassphraseIncludeNumberToggleChange,
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
) )
} }

View file

@ -103,7 +103,6 @@ fun VaultAddItemScreen(
modifier = Modifier modifier = Modifier
.padding(innerPadding) .padding(innerPadding)
.background(MaterialTheme.colorScheme.surface) .background(MaterialTheme.colorScheme.surface)
.padding(top = 8.dp)
.fillMaxSize() .fillMaxSize()
.verticalScroll(scrollState), .verticalScroll(scrollState),
verticalArrangement = Arrangement.spacedBy(16.dp), verticalArrangement = Arrangement.spacedBy(16.dp),
@ -111,7 +110,9 @@ fun VaultAddItemScreen(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.item_information), label = stringResource(id = R.string.item_information),
modifier = Modifier.padding(horizontal = 16.dp), modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp),
) )
TypeOptionsItem( TypeOptionsItem(
selectedType = state.selectedType, selectedType = state.selectedType,
@ -227,11 +228,10 @@ private fun AddLoginTypeItemContent(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.authenticator_key), label = stringResource(id = R.string.authenticator_key),
modifier = Modifier.padding( modifier = Modifier
top = 8.dp, .fillMaxWidth()
start = 16.dp, .padding(top = 8.dp)
end = 16.dp, .padding(horizontal = 16.dp),
),
) )
BitwardenFilledButtonWithIcon( BitwardenFilledButtonWithIcon(
@ -245,11 +245,10 @@ private fun AddLoginTypeItemContent(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.ur_is), label = stringResource(id = R.string.ur_is),
modifier = Modifier.padding( modifier = Modifier
top = 8.dp, .fillMaxWidth()
start = 16.dp, .padding(top = 8.dp)
end = 16.dp, .padding(horizontal = 16.dp),
),
) )
BitwardenTextFieldWithActions( BitwardenTextFieldWithActions(
@ -278,11 +277,10 @@ private fun AddLoginTypeItemContent(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.miscellaneous), label = stringResource(id = R.string.miscellaneous),
modifier = Modifier.padding( modifier = Modifier
top = 8.dp, .fillMaxWidth()
start = 16.dp, .padding(top = 8.dp)
end = 16.dp, .padding(horizontal = 16.dp),
),
) )
BitwardenMultiSelectButton( BitwardenMultiSelectButton(
@ -326,11 +324,10 @@ private fun AddLoginTypeItemContent(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.notes), label = stringResource(id = R.string.notes),
modifier = Modifier.padding( modifier = Modifier
top = 8.dp, .fillMaxWidth()
start = 16.dp, .padding(top = 8.dp)
end = 16.dp, .padding(horizontal = 16.dp),
),
) )
Column( Column(
@ -348,11 +345,10 @@ private fun AddLoginTypeItemContent(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.custom_fields), label = stringResource(id = R.string.custom_fields),
modifier = Modifier.padding( modifier = Modifier
top = 8.dp, .fillMaxWidth()
start = 16.dp, .padding(top = 8.dp)
end = 16.dp, .padding(horizontal = 16.dp),
),
) )
BitwardenFilledTonalButton( BitwardenFilledTonalButton(
@ -365,11 +361,10 @@ private fun AddLoginTypeItemContent(
BitwardenListHeaderText( BitwardenListHeaderText(
label = stringResource(id = R.string.ownership), label = stringResource(id = R.string.ownership),
modifier = Modifier.padding( modifier = Modifier
top = 8.dp, .fillMaxWidth()
start = 16.dp, .padding(top = 8.dp)
end = 16.dp, .padding(horizontal = 16.dp),
),
) )
BitwardenMultiSelectButton( BitwardenMultiSelectButton(