34 lines
895 B
SCSS
34 lines
895 B
SCSS
@import "colors";
|
|
@import "constants";
|
|
|
|
$strength-bg: #EEEEEE;
|
|
$weak-strength-color: $lighter-red;
|
|
$medium-strength-color: $orange;
|
|
$strong-strength-color: $green;
|
|
|
|
.password-strength {
|
|
margin-top: -24px;
|
|
width: 100%;
|
|
min-height: 22px;
|
|
background: $strength-bg;
|
|
display: block;
|
|
margin-bottom: $default-spacer;
|
|
text-align: center;
|
|
|
|
&.strength-1 {
|
|
background: linear-gradient(to right, $weak-strength-color 0%, $weak-strength-color 25%, $strength-bg 25%, $strength-bg 100%);
|
|
}
|
|
|
|
&.strength-2 {
|
|
background: linear-gradient(to right, $medium-strength-color 0%, $medium-strength-color 50%, $strength-bg 50%, $strength-bg 100%);
|
|
}
|
|
|
|
&.strength-3 {
|
|
background: linear-gradient(to right, $medium-strength-color 0%, $medium-strength-color 75%, $strength-bg 75%, $strength-bg 100%);
|
|
}
|
|
|
|
&.strength-4 {
|
|
background: $strong-strength-color;
|
|
color: #FFFFFF;
|
|
}
|
|
}
|