diff --git a/components/lib/password/style/PasswordStyle.js b/components/lib/password/style/PasswordStyle.js index 906cd3959..ee8fd5df9 100644 --- a/components/lib/password/style/PasswordStyle.js +++ b/components/lib/password/style/PasswordStyle.js @@ -12,7 +12,7 @@ const theme = ({ dt }) => ` .p-password-meter { height: ${dt('password.meter.height')}; - background: ${dt('password.meter.border.color')}; + background: ${dt('password.meter.background')}; border-radius: ${dt('password.meter.border.radius')}; } diff --git a/components/lib/themes/aura/password/index.js b/components/lib/themes/aura/password/index.js index a175a5ace..25cfdf5d7 100644 --- a/components/lib/themes/aura/password/index.js +++ b/components/lib/themes/aura/password/index.js @@ -1,6 +1,6 @@ export default { meter: { - borderColor: '{content.border.color}', + background: '{content.border.color}', borderRadius: '{content.border.radius}', height: '.75rem' }, diff --git a/components/lib/themes/lara/password/index.js b/components/lib/themes/lara/password/index.js index b049b9e17..f01c9c9b8 100644 --- a/components/lib/themes/lara/password/index.js +++ b/components/lib/themes/lara/password/index.js @@ -1,6 +1,6 @@ export default { meter: { - borderColor: '{content.border.color}', + background: '{content.border.color}', borderRadius: '{content.border.radius}', height: '.75rem' }, diff --git a/components/lib/themes/nora/password/index.js b/components/lib/themes/nora/password/index.js index dfec1150f..ad09beb5b 100644 --- a/components/lib/themes/nora/password/index.js +++ b/components/lib/themes/nora/password/index.js @@ -1,6 +1,5 @@ export default { meter: { - borderColor: '{content.border.color}', borderRadius: '{content.border.radius}', height: '.75rem' }, @@ -18,6 +17,9 @@ export default { }, colorScheme: { light: { + meter: { + background: '{surface.300}' + }, strength: { weakBackground: '{red.600}', mediumBackground: '{yellow.600}', @@ -25,6 +27,9 @@ export default { } }, dark: { + meter: { + background: '{surface.600}' + }, strength: { weakBackground: '{red.500}', mediumBackground: '{yellow.500}',