mirror of
https://github.com/bitwarden/android.git
synced 2024-12-18 07:11:51 +03:00
PM-15049 PW strength indicator design audit (#4334)
This commit is contained in:
parent
dca88a58e7
commit
531b003347
1 changed files with 22 additions and 22 deletions
|
@ -42,14 +42,20 @@ fun PasswordStrengthIndicator(
|
||||||
currentCharacterCount: Int,
|
currentCharacterCount: Int,
|
||||||
minimumCharacterCount: Int? = null,
|
minimumCharacterCount: Int? = null,
|
||||||
) {
|
) {
|
||||||
|
val minimumRequirementMet = (minimumCharacterCount == null) ||
|
||||||
|
(currentCharacterCount >= minimumCharacterCount)
|
||||||
val widthPercent by animateFloatAsState(
|
val widthPercent by animateFloatAsState(
|
||||||
targetValue = when (state) {
|
targetValue = if (minimumRequirementMet) {
|
||||||
|
when (state) {
|
||||||
PasswordStrengthState.NONE -> 0f
|
PasswordStrengthState.NONE -> 0f
|
||||||
PasswordStrengthState.WEAK_1 -> .25f
|
PasswordStrengthState.WEAK_1 -> .25f
|
||||||
PasswordStrengthState.WEAK_2 -> .5f
|
PasswordStrengthState.WEAK_2 -> .5f
|
||||||
PasswordStrengthState.WEAK_3 -> .66f
|
PasswordStrengthState.WEAK_3 -> .66f
|
||||||
PasswordStrengthState.GOOD -> .82f
|
PasswordStrengthState.GOOD -> .82f
|
||||||
PasswordStrengthState.STRONG -> 1f
|
PasswordStrengthState.STRONG -> 1f
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
0f
|
||||||
},
|
},
|
||||||
label = "Width Percent State",
|
label = "Width Percent State",
|
||||||
)
|
)
|
||||||
|
@ -107,6 +113,7 @@ fun PasswordStrengthIndicator(
|
||||||
minimumCharacterCount = minCount,
|
minimumCharacterCount = minCount,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
if (minimumRequirementMet) {
|
||||||
Text(
|
Text(
|
||||||
text = label(),
|
text = label(),
|
||||||
style = BitwardenTheme.typography.labelSmall,
|
style = BitwardenTheme.typography.labelSmall,
|
||||||
|
@ -114,6 +121,7 @@ fun PasswordStrengthIndicator(
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
|
@ -122,14 +130,6 @@ private fun MinimumCharacterCount(
|
||||||
minimumRequirementMet: Boolean,
|
minimumRequirementMet: Boolean,
|
||||||
minimumCharacterCount: Int,
|
minimumCharacterCount: Int,
|
||||||
) {
|
) {
|
||||||
val characterCountColor by animateColorAsState(
|
|
||||||
targetValue = if (minimumRequirementMet) {
|
|
||||||
BitwardenTheme.colorScheme.status.strong
|
|
||||||
} else {
|
|
||||||
BitwardenTheme.colorScheme.text.secondary
|
|
||||||
},
|
|
||||||
label = "minmumCharacterCountColor",
|
|
||||||
)
|
|
||||||
Row(
|
Row(
|
||||||
modifier = modifier,
|
modifier = modifier,
|
||||||
verticalAlignment = Alignment.CenterVertically,
|
verticalAlignment = Alignment.CenterVertically,
|
||||||
|
@ -145,14 +145,14 @@ private fun MinimumCharacterCount(
|
||||||
Icon(
|
Icon(
|
||||||
painter = rememberVectorPainter(id = it),
|
painter = rememberVectorPainter(id = it),
|
||||||
contentDescription = null,
|
contentDescription = null,
|
||||||
tint = characterCountColor,
|
tint = BitwardenTheme.colorScheme.text.secondary,
|
||||||
modifier = Modifier.size(12.dp),
|
modifier = Modifier.size(12.dp),
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
Spacer(modifier = Modifier.width(2.dp))
|
Spacer(modifier = Modifier.width(2.dp))
|
||||||
Text(
|
Text(
|
||||||
text = stringResource(R.string.minimum_characters, minimumCharacterCount),
|
text = stringResource(R.string.minimum_characters, minimumCharacterCount),
|
||||||
color = characterCountColor,
|
color = BitwardenTheme.colorScheme.text.secondary,
|
||||||
style = BitwardenTheme.typography.labelSmall,
|
style = BitwardenTheme.typography.labelSmall,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue