shoe strength text in label

This commit is contained in:
Kyle Spearrin 2018-11-15 15:27:27 -05:00
parent 3eeba61280
commit 55dfb8df62
6 changed files with 30 additions and 19 deletions

2
jslib

@ -1 +1 @@
Subproject commit be080f4f17b782fdb22c77560bd235e81346fb21
Subproject commit b48c48470801eb88aaec2c2cd84baeb6f1876923

View File

@ -11,7 +11,13 @@
<div class="box-content-row" appBoxRow>
<div class="box-content-row-flex">
<div class="row-main">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<label for="masterPassword">
{{'masterPass' | i18n}}
<span class="sub-label text-{{masterPasswordScoreColor}}"
*ngIf="masterPasswordScoreText">
{{masterPasswordScoreText}}
</span>
</label>
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}"
name="MasterPassword" class="monospaced" [(ngModel)]="masterPassword"
required [appAutofocus]="email !== ''" (input)="updatePasswordStrength()">

View File

@ -23,21 +23,4 @@ export class RegisterComponent extends BaseRegisterComponent {
super(authService, router, i18nService, cryptoService, apiService, stateService, platformUtilsService,
passwordGenerationService);
}
get masterPasswordScoreWidth() {
return this.masterPasswordScore == null ? 0 : (this.masterPasswordScore + 1) * 20;
}
get masterPasswordScoreColor() {
switch (this.masterPasswordScore) {
case 4:
return 'success';
case 3:
return 'primary';
case 2:
return 'warning';
default:
return 'danger';
}
}
}

View File

@ -1129,6 +1129,18 @@
"whoOwnsThisItem": {
"message": "Who owns this item?"
},
"strong": {
"message": "Strong",
"description": "ex. A strong password. Scale: Weak -> Good -> Strong"
},
"good": {
"message": "Good",
"description": "ex. A good password. Scale: Weak -> Good -> Strong"
},
"weak": {
"message": "Weak",
"description": "ex. A weak password. Scale: Weak -> Good -> Strong"
},
"weakMasterPassword": {
"message": "Weak Master Password"
},

View File

@ -96,6 +96,10 @@
@include themify($themes) {
color: themed('mutedColor');
}
.sub-label {
margin-left: 10px;
}
}
.text, .detail {

View File

@ -46,6 +46,12 @@ small {
}
}
.text-danger {
@include themify($themes) {
color: themed('dangerColor') !important;
}
}
.text-muted {
@include themify($themes) {
color: themed('mutedColor') !important;