Extract Password field from Registration into a reusable component

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-05-14 20:19:15 +01:00
parent eb6796bd0e
commit cf3c4d9e5f
8 changed files with 148 additions and 69 deletions

View file

@ -41,6 +41,7 @@
@import "./views/auth/_CountryDropdown.scss";
@import "./views/auth/_InteractiveAuthEntryComponents.scss";
@import "./views/auth/_LanguageSelector.scss";
@import "./views/auth/_PassphraseField.scss";
@import "./views/auth/_ServerConfig.scss";
@import "./views/auth/_ServerTypeSelector.scss";
@import "./views/auth/_Welcome.scss";

View file

@ -146,9 +146,3 @@ limitations under the License.
.mx_AuthBody_spinner {
margin: 1em 0;
}
.mx_AuthBody_passwordScore {
height: 4px;
position: absolute;
top: -12px;
}

View file

@ -18,6 +18,8 @@ $PassphraseStrengthHigh: $accent-color;
$PassphraseStrengthMedium: $username-variant5-color;
$PassphraseStrengthLow: $notice-primary-color;
.mx_PassphraseField {}
@define-mixin ProgressBarColour $colour {
color: $colour;
&::-moz-progress-bar {
@ -28,10 +30,13 @@ $PassphraseStrengthLow: $notice-primary-color;
}
}
progress.mx_ZxcvbnProgressBar {
progress.mx_PassphraseField_progress {
appearance: none;
width: 100%;
border: 0;
height: 4px;
position: absolute;
top: -12px;
border-radius: 2px;
&::-moz-progress-bar {