bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-23 19:53:43 +00:00
Code Issues Releases Wiki Activity

add master password strength text

Browse Source
This commit is contained in:
Kyle Spearrin
2018-11-15 15:40:56 -05:00
parent fceabbb4bf
commit 8502ff8fa4
5 changed files with 34 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/popup/accounts/register.component.html
View File

@@ -24,10 +24,16 @@
<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}}
<strong class="sub-label text-{{masterPasswordScoreColor}}"
*ngIf="masterPasswordScoreText">
{{masterPasswordScoreText}}
</strong>
</label>
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}"
name="MasterPassword" class="monospaced" [(ngModel)]="masterPassword" required
[appAutofocus]="email !== ''" appInputVerbatim (input)="updatePasswordStrength()">
[appAutofocus]="email !== ''" appInputVerbatim (input)="updatePasswordStrength()">
</div>
<div class="action-buttons">
<a class="row-btn" href="#" appStopClick appBlurClick
@@ -38,7 +44,7 @@
</div>
</div>
<div class="progress">
<div class="progress-bar {{masterPasswordScoreColor}}" role="progressbar" aria-valuenow="0"
<div class="progress-bar bg-{{masterPasswordScoreColor}}" role="progressbar" aria-valuenow="0"
aria-valuemin="0" aria-valuemax="100" [ngStyle]="{width: (masterPasswordScoreWidth + '%')}"
attr.aria-valuenow="{{masterPasswordScoreWidth}}"></div>
</div>

17
src/popup/accounts/register.component.ts
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 'bg-success';
case 3:
return 'bg-primary';
case 2:
return 'bg-warning';
default:
return 'bg-danger';
}
}
}