diff --git a/jslib b/jslib index 17e7ee4838..be080f4f17 160000 --- a/jslib +++ b/jslib @@ -1 +1 @@ -Subproject commit 17e7ee4838071ea836867b06863a71ab047ed443 +Subproject commit be080f4f17b782fdb22c77560bd235e81346fb21 diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json index 8b50f3965b..dcc8aa7dee 100644 --- a/src/_locales/en/messages.json +++ b/src/_locales/en/messages.json @@ -1112,5 +1112,11 @@ }, "whoOwnsThisItem": { "message": "Who owns this item?" + }, + "weakMasterPassword": { + "message": "Weak Master Password" + }, + "weakMasterPasswordDesc": { + "message": "The master password you have chosen is weak. You should use a strong master password (or a passphrase) to properly protect your Bitwarden account. Are you sure you want to use this master password?" } } diff --git a/src/popup/accounts/register.component.html b/src/popup/accounts/register.component.html index db6f2ecfa3..84d13adf47 100644 --- a/src/popup/accounts/register.component.html +++ b/src/popup/accounts/register.component.html @@ -21,19 +21,26 @@ -
-
- - +
+
+
+ + +
+
+ + + +
-
- - - +
+
diff --git a/src/popup/accounts/register.component.ts b/src/popup/accounts/register.component.ts index 19fa0c1962..e738a9ac06 100644 --- a/src/popup/accounts/register.component.ts +++ b/src/popup/accounts/register.component.ts @@ -23,4 +23,21 @@ 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'; + } + } } diff --git a/src/popup/scss/box.scss b/src/popup/scss/box.scss index e0d44a7e5a..858ca764fb 100644 --- a/src/popup/scss/box.scss +++ b/src/popup/scss/box.scss @@ -111,8 +111,8 @@ flex-grow: 1; } - &.box-content-row-flex, &.box-content-row-checkbox, &.box-content-row-input, - &.box-content-row-slider, &.box-content-row-multi { + &.box-content-row-flex, .box-content-row-flex, &.box-content-row-checkbox, + &.box-content-row-input, &.box-content-row-slider, &.box-content-row-multi { display: flex; align-items: center; word-break: break-all; @@ -312,7 +312,6 @@ } } - &.totp { .totp-code { font-family: $font-family-monospace; @@ -373,6 +372,27 @@ } } } + + .progress { + display: flex; + height: 5px; + overflow: hidden; // force rounded corners by cropping it + font-size: $font-size-small; + margin: 10px -15px -10px; + + @include themify($themes) { + background-color: themed('borderColor'); + } + } + + .progress-bar { + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + white-space: nowrap; + background-color: $brand-primary; + } } &.condensed .box-content-row, .box-content-row.condensed { diff --git a/src/popup/scss/misc.scss b/src/popup/scss/misc.scss index 94112f5c38..acc6690c77 100644 --- a/src/popup/scss/misc.scss +++ b/src/popup/scss/misc.scss @@ -4,6 +4,36 @@ small, .small { font-size: $font-size-small; } +.bg-primary { + @include themify($themes) { + background-color: themed('primaryColor') !important; + } +} + +.bg-success { + @include themify($themes) { + background-color: themed('successColor') !important; + } +} + +.bg-danger { + @include themify($themes) { + background-color: themed('dangerColor') !important; + } +} + +.bg-info { + @include themify($themes) { + background-color: themed('infoColor') !important; + } +} + +.bg-warning { + @include themify($themes) { + background-color: themed('warningColor') !important; + } +} + .text-primary { @include themify($themes) { color: themed('primaryColor') !important;