Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-10-29 07:59:42 +01:00
Code Issues Projects Releases Wiki Activity

format html files

Browse Source
This commit is contained in:
Kyle Spearrin 2019-02-21 16:50:37 -05:00
parent cdfd828a8b
commit 33b539858f
78 changed files with 863 additions and 500 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/accounts/accept-organization.component.html
View File

@ -22,7 +22,8 @@
<a routerLink="/" [queryParams]="{email: email}" class="btn btn-primary btn-block">
{{'logIn' | i18n}}
</a>
<a routerLink="/register" [queryParams]="{email: email}" class="btn btn-primary btn-block ml-2 mt-0">
<a routerLink="/register" [queryParams]="{email: email}"
class="btn btn-primary btn-block ml-2 mt-0">
{{'createAccount' | i18n}}
</a>
</div>

4
src/app/accounts/hint.component.html
View File

@ -6,8 +6,8 @@
<div class="card-body">
<div class="form-group">
<label for="email">{{'emailAddress' | i18n}}</label>
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required appAutofocus inputmode="email"
appInputVerbatim="false">
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required
appAutofocus inputmode="email" appInputVerbatim="false">
<small class="form-text text-muted">{{'enterEmailToGetHint' | i18n}}</small>
</div>
<hr>

11
src/app/accounts/lock.component.html
View File

@ -10,10 +10,13 @@
<div class="form-group">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<div class="d-flex">
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}" name="MasterPassword" class="text-monospace form-control"
[(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}"
name="MasterPassword" class="text-monospace form-control" [(ngModel)]="masterPassword"
required appAutofocus appInputVerbatim>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}"
(click)="togglePassword()">
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
</button>
</div>
<small class="text-muted form-text">{{'loggedInAsEmail' | i18n : email}}</small>

20
src/app/accounts/login.component.html
View File

@ -7,15 +7,19 @@
<div class="card-body">
<div class="form-group">
<label for="email">{{'emailAddress' | i18n}}</label>
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required inputmode="email" appInputVerbatim="false">
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required
inputmode="email" appInputVerbatim="false">
</div>
<div class="form-group">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<div class="d-flex">
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}" name="MasterPassword" class="text-monospace form-control"
[(ngModel)]="masterPassword" required appInputVerbatim>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}"
name="MasterPassword" class="text-monospace form-control" [(ngModel)]="masterPassword"
required appInputVerbatim>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}"
(click)="togglePassword()">
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
</button>
</div>
<small class="form-text">
@ -23,7 +27,8 @@
</small>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" id="rememberEmail" name="RememberEmail" [(ngModel)]="rememberEmail">
<input type="checkbox" class="form-check-input" id="rememberEmail" name="RememberEmail"
[(ngModel)]="rememberEmail">
<label class="form-check-label" for="rememberEmail">{{'rememberEmail' | i18n}}</label>
</div>
<hr>
@ -34,7 +39,8 @@
</span>
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
</button>
<a routerLink="/register" [queryParams]="{email: email}" class="btn btn-outline-secondary btn-block ml-2 mt-0">
<a routerLink="/register" [queryParams]="{email: email}"
class="btn btn-outline-secondary btn-block ml-2 mt-0">
<i class="fa fa-pencil-square-o"></i> {{'createAccount' | i18n}}
</a>
</div>

4
src/app/accounts/recover-delete.component.html
View File

@ -7,8 +7,8 @@
<p>{{'deleteRecoverDesc' | i18n}}</p>
<div class="form-group">
<label for="email">{{'emailAddress' | i18n}}</label>
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required appAutofocus inputmode="email"
appInputVerbatim="false">
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required
appAutofocus inputmode="email" appInputVerbatim="false">
</div>
<hr>
<div class="d-flex">

15
src/app/accounts/recover-two-factor.component.html
View File

@ -5,22 +5,23 @@
<div class="card">
<div class="card-body">
<p>{{'recoverAccountTwoStepDesc' | i18n}}
<a href="https://help.bitwarden.com/article/lost-two-step-device/" target="_blank" rel="noopener">{{'learnMore' | i18n}}</a>
<a href="https://help.bitwarden.com/article/lost-two-step-device/" target="_blank"
rel="noopener">{{'learnMore' | i18n}}</a>
</p>
<div class="form-group">
<label for="email">{{'emailAddress' | i18n}}</label>
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required appAutofocus inputmode="email"
appInputVerbatim="false">
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required
appAutofocus inputmode="email" appInputVerbatim="false">
</div>
<div class="form-group">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPassword" class="form-control" [(ngModel)]="masterPassword" required
appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPassword" class="form-control"
[(ngModel)]="masterPassword" required appInputVerbatim>
</div>
<div class="form-group">
<label for="recoveryCode">{{'recoveryCodeTitle' | i18n}}</label>
<input id="recoveryCode" class="text-monospace form-control" type="text" name="RecoveryCode" [(ngModel)]="recoveryCode" required
appInputVerbatim>
<input id="recoveryCode" class="text-monospace form-control" type="text" name="RecoveryCode"
[(ngModel)]="recoveryCode" required appInputVerbatim>
</div>
<hr>
<div class="d-flex">

40
src/app/accounts/register.component.html
View File

@ -4,31 +4,38 @@
<p class="lead text-center mb-4">{{'createAccount' | i18n}}</p>
<div class="card d-block">
<div class="card-body">
<app-callout title="{{'createOrganizationStep1' | i18n}}" type="info" icon="fa-thumb-tack" *ngIf="showCreateOrgMessage">
<app-callout title="{{'createOrganizationStep1' | i18n}}" type="info" icon="fa-thumb-tack"
*ngIf="showCreateOrgMessage">
{{'createOrganizationCreatePersonalAccount' | i18n}}
</app-callout>
<div class="form-group">
<label for="email">{{'emailAddress' | i18n}}</label>
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required [appAutofocus]="email === ''"
inputmode="email" appInputVerbatim="false">
<input id="email" class="form-control" type="text" name="Email" [(ngModel)]="email" required
[appAutofocus]="email === ''" inputmode="email" appInputVerbatim="false">
<small class="form-text text-muted">{{'emailAddressDesc' | i18n}}</small>
</div>
<div class="form-group">
<label for="name">{{'yourName' | i18n}}</label>
<input id="name" class="form-control" type="text" name="Name" [(ngModel)]="name" [appAutofocus]="email !== ''">
<input id="name" class="form-control" type="text" name="Name" [(ngModel)]="name"
[appAutofocus]="email !== ''">
<small class="form-text text-muted">{{'yourNameDesc' | i18n}}</small>
</div>
<div class="form-group">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<div class="d-flex">
<div class="w-100">
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}" name="MasterPassword" class="text-monospace form-control mb-1"
[(ngModel)]="masterPassword" (input)="updatePasswordStrength()" required appInputVerbatim>
<app-password-strength [score]="masterPasswordScore" [showText]="true"></app-password-strength>
<input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}"
name="MasterPassword" class="text-monospace form-control mb-1"
[(ngModel)]="masterPassword" (input)="updatePasswordStrength()" required
appInputVerbatim>
<app-password-strength [score]="masterPasswordScore" [showText]="true">
</app-password-strength>
</div>
<div>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}" (click)="togglePassword(false)">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}"
(click)="togglePassword(false)">
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
</button>
<div class="progress-bar invisible"></div>
</div>
@ -38,10 +45,13 @@
<div class="form-group">
<label for="masterPasswordRetype">{{'reTypeMasterPass' | i18n}}</label>
<div class="d-flex">
<input id="masterPasswordRetype" type="{{showPassword ? 'text' : 'password'}}" name="MasterPasswordRetype" class="text-monospace form-control"
<input id="masterPasswordRetype" type="{{showPassword ? 'text' : 'password'}}"
name="MasterPasswordRetype" class="text-monospace form-control"
[(ngModel)]="confirmMasterPassword" required appInputVerbatim>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}" (click)="togglePassword(true)">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
<button type="button" class="ml-1 btn btn-link" title="{{'toggleVisibility' | i18n}}"
(click)="togglePassword(true)">
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
</button>
</div>
</div>
@ -62,8 +72,10 @@
</div>
<small class="text-muted" *ngIf="showTerms">
{{'submitAgreePolicies' | i18n}}
<a href="https://bitwarden.com/terms/" target="_blank" rel="noopener">{{'termsOfService' | i18n}}</a>,
<a href="https://bitwarden.com/privacy/" target="_blank" rel="noopener">{{'privacyPolicy' | i18n}}</a>
<a href="https://bitwarden.com/terms/" target="_blank"
rel="noopener">{{'termsOfService' | i18n}}</a>,
<a href="https://bitwarden.com/privacy/" target="_blank"
rel="noopener">{{'privacyPolicy' | i18n}}</a>
</small>
</div>
</div>

3
src/app/accounts/two-factor-options.component.html
View File

@ -8,7 +8,8 @@
</button>
</div>
<div class="list-group list-group-flush">
<a href="#" appStopClick *ngFor="let p of providers" (click)="choose(p)" class="list-group-item list-group-item-action">
<a href="#" appStopClick *ngFor="let p of providers" (click)="choose(p)"
class="list-group-item list-group-item-action">
<img [src]="'images/two-factor/' + p.type + '.png'" alt="" class="pull-right">
<h3>{{p.name}}</h3>
{{p.description}}

28
src/app/accounts/two-factor.component.html
View File

@ -1,19 +1,24 @@
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container" ngNativeValidate autocomplete="off">
<div class="row justify-content-md-center mt-5">
<div class="col-5" [ngClass]="{'col-9': selectedProviderType === providerType.Duo || selectedProviderType === providerType.OrganizationDuo}">
<div class="col-5"
[ngClass]="{'col-9': selectedProviderType === providerType.Duo || selectedProviderType === providerType.OrganizationDuo}">
<p class="lead text-center mb-4">{{title}}</p>
<div class="card d-block">
<div class="card-body">
<ng-container *ngIf="selectedProviderType === providerType.Email || selectedProviderType === providerType.Authenticator">
<p *ngIf="selectedProviderType === providerType.Authenticator">{{'enterVerificationCodeApp' | i18n}}</p>
<ng-container
*ngIf="selectedProviderType === providerType.Email || selectedProviderType === providerType.Authenticator">
<p *ngIf="selectedProviderType === providerType.Authenticator">
{{'enterVerificationCodeApp' | i18n}}</p>
<p *ngIf="selectedProviderType === providerType.Email">
{{'enterVerificationCodeEmail' | i18n : twoFactorEmail}}
</p>
<div class="form-group">
<label for="code" class="sr-only">{{'verificationCode' | i18n}}</label>
<input id="code" type="text" name="Code" class="form-control" [(ngModel)]="token" required appAutofocus inputmode="tel" appInputVerbatim>
<input id="code" type="text" name="Code" class="form-control" [(ngModel)]="token" required
appAutofocus inputmode="tel" appInputVerbatim>
<small class="form-text" *ngIf="selectedProviderType === providerType.Email">
<a href="#" appStopClick (click)="sendEmail(true)" [appApiAction]="emailPromise" *ngIf="selectedProviderType === providerType.Email">
<a href="#" appStopClick (click)="sendEmail(true)" [appApiAction]="emailPromise"
*ngIf="selectedProviderType === providerType.Email">
{{'sendVerificationCodeEmailAgain' | i18n}}
</a>
</small>
@ -24,8 +29,8 @@
<img src="../../images/yubikey.jpg" class="rounded img-fluid mb-3" alt="">
<div class="form-group">
<label for="code" class="sr-only">{{'verificationCode' | i18n}}</label>
<input id="code" type="password" name="Code" class="form-control" [(ngModel)]="token" required appAutofocus appInputVerbatim
autocomplete="new-password">
<input id="code" type="password" name="Code" class="form-control" [(ngModel)]="token"
required appAutofocus appInputVerbatim autocomplete="new-password">
</div>
</ng-container>
<ng-container *ngIf="selectedProviderType === providerType.U2f">
@ -43,9 +48,11 @@
<iframe id="duo_iframe"></iframe>
</div>
</ng-container>
<i class="fa fa-spinner text-muted fa-spin pull-right" title="{{'loading' | i18n}}" *ngIf="form.loading && selectedProviderType === providerType.U2f"></i>
<i class="fa fa-spinner text-muted fa-spin pull-right" title="{{'loading' | i18n}}"
*ngIf="form.loading && selectedProviderType === providerType.U2f"></i>
<div class="form-check" *ngIf="selectedProviderType != null">
<input id="remember" type="checkbox" name="Remember" class="form-check-input" [(ngModel)]="remember">
<input id="remember" type="checkbox" name="Remember" class="form-check-input"
[(ngModel)]="remember">
<label for="remember" class="form-check-label">{{'rememberMe' | i18n}}</label>
</div>
<ng-container *ngIf="selectedProviderType == null">
@ -54,7 +61,8 @@
</ng-container>
<hr>
<div class="d-flex mb-3">
<button type="submit" class="btn btn-primary btn-block btn-submit" [disabled]="form.loading" *ngIf="selectedProviderType != null && selectedProviderType !== providerType.Duo &&
<button type="submit" class="btn btn-primary btn-block btn-submit" [disabled]="form.loading"
*ngIf="selectedProviderType != null && selectedProviderType !== providerType.Duo &&
selectedProviderType !== providerType.OrganizationDuo && selectedProviderType !== providerType.U2f">
<span>
<i class="fa fa-sign-in"></i> {{'continue' | i18n}}

4
src/app/components/password-strength.component.html
View File

@ -1,6 +1,6 @@
<div class="progress">
<div class="progress-bar {{color}}" role="progressbar" [ngStyle]="{width: (scoreWidth + '%')}" attr.aria-valuenow="{{scoreWidth}}"
aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar {{color}}" role="progressbar" [ngStyle]="{width: (scoreWidth + '%')}"
attr.aria-valuenow="{{scoreWidth}}" aria-valuemin="0" aria-valuemax="100">
<ng-container *ngIf="showText && text">
{{text}}
</ng-container>

3
src/app/layouts/navbar.component.html
View File

@ -18,7 +18,8 @@
</div>
<ul class="navbar-nav flex-row ml-md-auto d-none d-md-flex">
<li class="nav-item dropdown">
<a class="nav-item nav-link dropdown-toggle" href="#" id="nav-profile" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<a class="nav-item nav-link dropdown-toggle" href="#" id="nav-profile" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fa fa-user-circle fa-lg"></i>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="nav-profile">

20
src/app/organizations/manage/collection-add-edit.component.html
View File

@ -41,14 +41,17 @@
<tbody>
<tr *ngFor="let g of groups; let i = index">
<td class="table-list-checkbox" (click)="check(g)">
<input type="checkbox" [(ngModel)]="g.checked" name="Groups[{{i}}].Checked" [disabled]="g.accessAll" appStopProp>
<input type="checkbox" [(ngModel)]="g.checked" name="Groups[{{i}}].Checked"
[disabled]="g.accessAll" appStopProp>
</td>
<td (click)="check(g)">
{{g.name}}
<i class="fa fa-th text-muted fa-fw" *ngIf="g.accessAll" title="This group can access all items"></i>
<i class="fa fa-th text-muted fa-fw" *ngIf="g.accessAll"
title="This group can access all items"></i>
</td>
<td class="text-center">
<input type="checkbox" [(ngModel)]="g.readOnly" name="Groups[{{i}}].ReadOnly" [disabled]="!g.checked || g.accessAll">
<input type="checkbox" [(ngModel)]="g.readOnly" name="Groups[{{i}}].ReadOnly"
[disabled]="!g.checked || g.accessAll">
</td>
</tr>
</tbody>
@ -60,12 +63,15 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'cancel' | i18n}}</button>
<div class="ml-auto">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger" title="{{'delete' | i18n}}"
*ngIf="editMode" [disabled]="deleteBtn.loading" [appApiAction]="deletePromise">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger"
title="{{'delete' | i18n}}" *ngIf="editMode" [disabled]="deleteBtn.loading"
[appApiAction]="deletePromise">
<i class="fa fa-trash-o fa-lg fa-fw" [hidden]="deleteBtn.loading"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading" title="{{'loading' | i18n}}"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading"
title="{{'loading' | i18n}}"></i>
</button>
</div>
</div>

6
src/app/organizations/manage/collections.component.html
View File

@ -3,7 +3,8 @@
<div class="ml-auto d-flex">
<div>
<label class="sr-only" for="search">{{'search' | i18n}}</label>
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}" [(ngModel)]="searchText">
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}"
[(ngModel)]="searchText">
</div>
<button type="button" class="btn btn-sm btn-outline-primary ml-3" (click)="add()">
<i class="fa fa-plus fa-fw"></i>
@ -22,7 +23,8 @@
</td>
<td class="table-list-options">
<div class="dropdown" appListDropdown>
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog fa-lg"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">

15
src/app/organizations/manage/entity-events.component.html
View File

@ -17,14 +17,15 @@
<div class="d-flex">
<div class="form-inline">
<label class="sr-only" for="start">{{'startDate' | i18n}}</label>
<input type="datetime-local" class="form-control form-control-sm" id="start" placeholder="{{'startDate' | i18n}}" [(ngModel)]="start"
placeholder="YYYY-MM-DDTHH:MM">
<input type="datetime-local" class="form-control form-control-sm" id="start"
placeholder="{{'startDate' | i18n}}" [(ngModel)]="start" placeholder="YYYY-MM-DDTHH:MM">
<span class="mx-2">-</span>
<label class="sr-only" for="end">{{'endDate' | i18n}}</label>
<input type="datetime-local" class="form-control form-control-sm" id="end" placeholder="{{'endDate' | i18n}}" [(ngModel)]="end"
placeholder="YYYY-MM-DDTHH:MM">
<input type="datetime-local" class="form-control form-control-sm" id="end"
placeholder="{{'endDate' | i18n}}" [(ngModel)]="end" placeholder="YYYY-MM-DDTHH:MM">
</div>
<button #refreshBtn [appApiAction]="refreshPromise" type="button" class="btn btn-sm btn-outline-primary ml-3" (click)="loadEvents(true)"
<button #refreshBtn [appApiAction]="refreshPromise" type="button"
class="btn btn-sm btn-outline-primary ml-3" (click)="loadEvents(true)"
[disabled]="loaded && refreshBtn.loading">
<i class="fa fa-refresh fa-fw" [ngClass]="{'fa-spin': loaded && refreshBtn.loading}"></i>
{{'refresh' | i18n}}
@ -58,8 +59,8 @@
</tr>
</tbody>
</table>
<button #moreBtn [appApiAction]="morePromise" type="button" class="btn btn-block btn-link btn-submit" (click)="loadEvents(false)"
[disabled]="loaded && moreBtn.loading" *ngIf="continuationToken">
<button #moreBtn [appApiAction]="morePromise" type="button" class="btn btn-block btn-link btn-submit"
(click)="loadEvents(false)" [disabled]="loaded && moreBtn.loading" *ngIf="continuationToken">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'loadMore' | i18n}}</span>
</button>

16
src/app/organizations/manage/entity-users.component.html
View File

@ -13,12 +13,13 @@
<div class="modal-body" *ngIf="loading || !users">
<i class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
</div>
<div class="modal-body" *ngIf="!loading && users && (users | search:searchText:'name':'email':'id') as searchedUsers">
<div class="modal-body"
*ngIf="!loading && users && (users | search:searchText:'name':'email':'id') as searchedUsers">
<div class="d-flex">
<div class="mr-3">
<label class="sr-only" for="search">{{'search' | i18n}}</label>
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}"
name="SearchText" [(ngModel)]="searchText">
<input type="search" class="form-control form-control-sm" id="search"
placeholder="{{'search' | i18n}}" name="SearchText" [(ngModel)]="searchText">
</div>
<div class="btn-group btn-group-sm" role="group">
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: !showSelected}"
@ -53,7 +54,8 @@
<tr *ngFor="let u of searchedUsers">
<td class="table-list-checkbox" (click)="check(u)">
<input type="checkbox" [(ngModel)]="u.checked" name="{{u.id.substr(0,8)}}_Checked"
[disabled]="entity === 'collection' && u.accessAll" (change)="selectedChanged(u)" appStopProp>
[disabled]="entity === 'collection' && u.accessAll"
(change)="selectedChanged(u)" appStopProp>
</td>
<td width="30" (click)="check(u)">
<app-avatar [data]="u.name || u.email" [email]="u.email" size="25" [circle]="true"
@ -61,9 +63,11 @@
</td>
<td>
{{u.email}}
<span class="badge badge-secondary" *ngIf="u.status === organizationUserStatusType.Invited">{{'invited'
<span class="badge badge-secondary"
*ngIf="u.status === organizationUserStatusType.Invited">{{'invited'
| i18n}}</span>
<span class="badge badge-warning" *ngIf="u.status === organizationUserStatusType.Accepted">{{'accepted'
<span class="badge badge-warning"
*ngIf="u.status === organizationUserStatusType.Accepted">{{'accepted'
| i18n}}</span>
<small class="text-muted d-block" *ngIf="u.name">{{u.name}}</small>
</td>

16
src/app/organizations/manage/events.component.html
View File

@ -3,15 +3,15 @@
<div class="ml-auto d-flex">
<div class="form-inline">
<label class="sr-only" for="start">{{'startDate' | i18n}}</label>
<input type="datetime-local" class="form-control form-control-sm" id="start" placeholder="{{'startDate' | i18n}}" [(ngModel)]="start"
placeholder="YYYY-MM-DDTHH:MM">
<input type="datetime-local" class="form-control form-control-sm" id="start"
placeholder="{{'startDate' | i18n}}" [(ngModel)]="start" placeholder="YYYY-MM-DDTHH:MM">
<span class="mx-2">-</span>
<label class="sr-only" for="end">{{'endDate' | i18n}}</label>
<input type="datetime-local" class="form-control form-control-sm" id="end" placeholder="{{'endDate' | i18n}}" [(ngModel)]="end"
placeholder="YYYY-MM-DDTHH:MM">
<input type="datetime-local" class="form-control form-control-sm" id="end"
placeholder="{{'endDate' | i18n}}" [(ngModel)]="end" placeholder="YYYY-MM-DDTHH:MM">
</div>
<button #refreshBtn [appApiAction]="refreshPromise" type="button" class="btn btn-sm btn-outline-primary ml-3" (click)="loadEvents(true)"
[disabled]="loaded && refreshBtn.loading">
<button #refreshBtn [appApiAction]="refreshPromise" type="button" class="btn btn-sm btn-outline-primary ml-3"
(click)="loadEvents(true)" [disabled]="loaded && refreshBtn.loading">
<i class="fa fa-refresh fa-fw" [ngClass]="{'fa-spin': loaded && refreshBtn.loading}"></i>
{{'refresh' | i18n}}
</button>
@ -44,8 +44,8 @@
</tr>
</tbody>
</table>
<button #moreBtn [appApiAction]="morePromise" type="button" class="btn btn-block btn-link btn-submit" (click)="loadEvents(false)"
[disabled]="loaded && moreBtn.loading" *ngIf="continuationToken">
<button #moreBtn [appApiAction]="morePromise" type="button" class="btn btn-block btn-link btn-submit"
(click)="loadEvents(false)" [disabled]="loaded && moreBtn.loading" *ngIf="continuationToken">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'loadMore' | i18n}}</span>
</button>

23
src/app/organizations/manage/group-add-edit.component.html
View File

@ -35,13 +35,15 @@
</h3>
<div class="form-group" [ngClass]="{'mb-0': access !== 'selected'}">
<div class="form-check">
<input class="form-check-input" type="radio" name="access" id="accessAll" value="all" [(ngModel)]="access">
<input class="form-check-input" type="radio" name="access" id="accessAll" value="all"
[(ngModel)]="access">
<label class="form-check-label" for="accessAll">
{{'groupAccessAllItems' | i18n}}
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="access" id="accessSelected" value="selected" [(ngModel)]="access">
<input class="form-check-input" type="radio" name="access" id="accessSelected" value="selected"
[(ngModel)]="access">
<label class="form-check-label" for="accessSelected">
{{'groupAccessSelectedCollections' | i18n}}
</label>
@ -62,13 +64,15 @@
<tbody>
<tr *ngFor="let c of collections; let i = index">
<td class="table-list-checkbox" (click)="check(c)">
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked" appStopProp>
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked"
appStopProp>
</td>
<td (click)="check(c)">
{{c.name}}
</td>
<td class="text-center">
<input type="checkbox" [(ngModel)]="c.readOnly" name="Collection[{{i}}].ReadOnly" [disabled]="!c.checked">
<input type="checkbox" [(ngModel)]="c.readOnly" name="Collection[{{i}}].ReadOnly"
[disabled]="!c.checked">
</td>
</tr>
</tbody>
@ -80,12 +84,15 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'cancel' | i18n}}</button>
<div class="ml-auto">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger" title="{{'delete' | i18n}}" *ngIf="editMode"
[disabled]="deleteBtn.loading" [appApiAction]="deletePromise">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger"
title="{{'delete' | i18n}}" *ngIf="editMode" [disabled]="deleteBtn.loading"
[appApiAction]="deletePromise">
<i class="fa fa-trash-o fa-lg fa-fw" [hidden]="deleteBtn.loading"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading" title="{{'loading' | i18n}}"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading"
title="{{'loading' | i18n}}"></i>
</button>
</div>
</div>

6
src/app/organizations/manage/groups.component.html
View File

@ -3,7 +3,8 @@
<div class="ml-auto d-flex">
<div>
<label class="sr-only" for="search">{{'search' | i18n}}</label>
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}" [(ngModel)]="searchText">
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}"
[(ngModel)]="searchText">
</div>
<button type="button" class="btn btn-sm btn-outline-primary ml-3" (click)="add()">
<i class="fa fa-plus fa-fw"></i>
@ -22,7 +23,8 @@
</td>
<td class="table-list-options">
<div class="dropdown" appListDropdown>
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog fa-lg"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">

9
src/app/organizations/manage/manage.component.html
View File

@ -4,16 +4,19 @@
<div class="card" *ngIf="organization">
<div class="card-header">{{'manage' | i18n}}</div>
<div class="list-group list-group-flush">
<a routerLink="people" class="list-group-item" routerLinkActive="active" *ngIf="organization.isAdmin">
<a routerLink="people" class="list-group-item" routerLinkActive="active"
*ngIf="organization.isAdmin">
{{'people' | i18n}}
</a>
<a routerLink="collections" class="list-group-item" routerLinkActive="active">
{{'collections' | i18n}}
</a>
<a routerLink="groups" class="list-group-item" routerLinkActive="active" *ngIf="organization.isAdmin && accessGroups">
<a routerLink="groups" class="list-group-item" routerLinkActive="active"
*ngIf="organization.isAdmin && accessGroups">
{{'groups' | i18n}}
</a>
<a routerLink="events" class="list-group-item" routerLinkActive="active" *ngIf="organization.isAdmin && accessEvents">
<a routerLink="events" class="list-group-item" routerLinkActive="active"
*ngIf="organization.isAdmin && accessEvents">
{{'eventLogs' | i18n}}
</a>
</div>

33
src/app/organizations/manage/people.component.html
View File

@ -2,15 +2,18 @@
<h1>{{'people' | i18n}}</h1>
<div class="ml-auto d-flex">
<div class="btn-group btn-group-sm" role="group">
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == null}" (click)="filter(null)">
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == null}"
(click)="filter(null)">
{{'all' | i18n}}
</button>
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == organizationUserStatusType.Invited}"
<button type="button" class="btn btn-outline-secondary"
[ngClass]="{active: status == organizationUserStatusType.Invited}"
(click)="filter(organizationUserStatusType.Invited)">
{{'invited' | i18n}}
<span class="badge badge-pill badge-info" *ngIf="invitedCount">{{invitedCount}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == organizationUserStatusType.Accepted}"
<button type="button" class="btn btn-outline-secondary"
[ngClass]="{active: status == organizationUserStatusType.Accepted}"
(click)="filter(organizationUserStatusType.Accepted)">
{{'accepted' | i18n}}
<span class="badge badge-pill badge-warning" *ngIf="acceptedCount">{{acceptedCount}}</span>
@ -18,7 +21,8 @@
</div>
<div class="ml-3">
<label class="sr-only" for="search">{{'search' | i18n}}</label>
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}" [(ngModel)]="searchText">
<input type="search" class="form-control form-control-sm" id="search" placeholder="{{'search' | i18n}}"
[(ngModel)]="searchText">
</div>
<button type="button" class="btn btn-sm btn-outline-primary ml-3" (click)="invite()">
<i class="fa fa-plus fa-fw"></i>
@ -37,12 +41,15 @@
<tbody>
<tr *ngFor="let u of searchedUsers">
<td width="30">
<app-avatar [data]="u.name || u.email" [email]="u.email" size="25" [circle]="true" [fontSize]="14"></app-avatar>
<app-avatar [data]="u.name || u.email" [email]="u.email" size="25" [circle]="true"
[fontSize]="14"></app-avatar>
</td>
<td>
<a href="#" appStopClick (click)="edit(u)">{{u.email}}</a>
<span class="badge badge-secondary" *ngIf="u.status === organizationUserStatusType.Invited">{{'invited' | i18n}}</span>
<span class="badge badge-warning" *ngIf="u.status === organizationUserStatusType.Accepted">{{'accepted' | i18n}}</span>
<span class="badge badge-secondary"
*ngIf="u.status === organizationUserStatusType.Invited">{{'invited' | i18n}}</span>
<span class="badge badge-warning"
*ngIf="u.status === organizationUserStatusType.Accepted">{{'accepted' | i18n}}</span>
<small class="text-muted d-block" *ngIf="u.name">{{u.name}}</small>
</td>
<td>
@ -56,15 +63,18 @@
</td>
<td class="table-list-options">
<div class="dropdown" appListDropdown>
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button class="btn btn-outline-secondary dropdown-toggle" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog fa-lg"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="#" appStopClick (click)="reinvite(u)" *ngIf="u.status === organizationUserStatusType.Invited">
<a class="dropdown-item" href="#" appStopClick (click)="reinvite(u)"
*ngIf="u.status === organizationUserStatusType.Invited">
<i class="fa fa-fw fa-envelope-o"></i>
{{'resendInvitation' | i18n}}
</a>
<a class="dropdown-item text-success" href="#" appStopClick (click)="confirm(u)" *ngIf="u.status === organizationUserStatusType.Accepted">
<a class="dropdown-item text-success" href="#" appStopClick (click)="confirm(u)"
*ngIf="u.status === organizationUserStatusType.Accepted">
<i class="fa fa-fw fa-check"></i>
{{'confirm' | i18n}}
</a>
@ -72,7 +82,8 @@
<i class="fa fa-fw fa-sitemap"></i>
{{'groups' | i18n}}
</a>
<a class="dropdown-item" href="#" appStopClick (click)="events(u)" *ngIf="accessEvents && u.status === organizationUserStatusType.Confirmed">
<a class="dropdown-item" href="#" appStopClick (click)="events(u)"
*ngIf="accessEvents && u.status === organizationUserStatusType.Confirmed">
<i class="fa fa-fw fa-file-text-o"></i>
{{'eventLogs' | i18n}}
</a>

35
src/app/organizations/manage/user-add-edit.component.html
View File

@ -24,28 +24,32 @@
</ng-container>
<h3>{{'userType' | i18n}}</h3>
<div class="form-check mt-2 form-check-block">
<input class="form-check-input" type="radio" name="userType" id="userTypeUser" [value]="organizationUserType.User" [(ngModel)]="type">
<input class="form-check-input" type="radio" name="userType" id="userTypeUser"
[value]="organizationUserType.User" [(ngModel)]="type">
<label class="form-check-label" for="userTypeUser">
{{'user' | i18n}}
<small>{{'userDesc' | i18n}}</small>
</label>
</div>
<div class="form-check mt-2 form-check-block">
<input class="form-check-input" type="radio" name="userType" id="userTypeManager" [value]="organizationUserType.Manager" [(ngModel)]="type">
<input class="form-check-input" type="radio" name="userType" id="userTypeManager"
[value]="organizationUserType.Manager" [(ngModel)]="type">
<label class="form-check-label" for="userTypeManager">
{{'manager' | i18n}}
<small>{{'managerDesc' | i18n}}</small>
</label>
</div>
<div class="form-check mt-2 form-check-block">
<input class="form-check-input" type="radio" name="userType" id="userTypeAdmin" [value]="organizationUserType.Admin" [(ngModel)]="type">
<input class="form-check-input" type="radio" name="userType" id="userTypeAdmin"
[value]="organizationUserType.Admin" [(ngModel)]="type">
<label class="form-check-label" for="userTypeAdmin">
{{'admin' | i18n}}
<small>{{'adminDesc' | i18n}}</small>
</label>
</div>
<div class="form-check mt-2 form-check-block">
<input class="form-check-input" type="radio" name="userType" id="userTypeOwner" [value]="organizationUserType.Owner" [(ngModel)]="type">
<input class="form-check-input" type="radio" name="userType" id="userTypeOwner"
[value]="organizationUserType.Owner" [(ngModel)]="type">
<label class="form-check-label" for="userTypeOwner">
{{'owner' | i18n}}
<small>{{'ownerDesc' | i18n}}</small>
@ -66,13 +70,15 @@
</h3>
<div class="form-group" [ngClass]="{'mb-0': access !== 'selected'}">
<div class="form-check">
<input class="form-check-input" type="radio" name="access" id="accessAll" value="all" [(ngModel)]="access">
<input class="form-check-input" type="radio" name="access" id="accessAll" value="all"
[(ngModel)]="access">
<label class="form-check-label" for="accessAll">
{{'userAccessAllItems' | i18n}}
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="access" id="accessSelected" value="selected" [(ngModel)]="access">
<input class="form-check-input" type="radio" name="access" id="accessSelected" value="selected"
[(ngModel)]="access">
<label class="form-check-label" for="accessSelected">
{{'userAccessSelectedCollections' | i18n}}
</label>
@ -93,13 +99,15 @@
<tbody>
<tr *ngFor="let c of collections; let i = index">
<td class="table-list-checkbox" (click)="check(c)">
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked" appStopProp>
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked"
appStopProp>
</td>
<td (click)="check(c)">
{{c.name}}
</td>
<td class="text-center">
<input type="checkbox" [(ngModel)]="c.readOnly" name="Collection[{{i}}].ReadOnly" [disabled]="!c.checked">
<input type="checkbox" [(ngModel)]="c.readOnly" name="Collection[{{i}}].ReadOnly"
[disabled]="!c.checked">
</td>
</tr>
</tbody>
@ -111,12 +119,15 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'cancel' | i18n}}</button>
<div class="ml-auto">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger" title="{{'delete' | i18n}}" *ngIf="editMode"
[disabled]="deleteBtn.loading" [appApiAction]="deletePromise">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger"
title="{{'delete' | i18n}}" *ngIf="editMode" [disabled]="deleteBtn.loading"
[appApiAction]="deletePromise">
<i class="fa fa-trash-o fa-lg fa-fw" [hidden]="deleteBtn.loading"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading" title="{{'loading' | i18n}}"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading"
title="{{'loading' | i18n}}"></i>
</button>
</div>
</div>

6
src/app/organizations/manage/user-confirm.component.html
View File

@ -18,7 +18,8 @@
</p>
<p><code>{{fingerprint}}</code></p>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="dontAskAgain" name="DontAskAgain" [(ngModel)]="dontAskAgain">
<input class="form-check-input" type="checkbox" id="dontAskAgain" name="DontAskAgain"
[(ngModel)]="dontAskAgain">
<label class="form-check-label" for="dontAskAgain">
{{'dontAskFingerprintAgain' | i18n}}
</label>
@ -29,7 +30,8 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'confirm' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

3
src/app/organizations/manage/user-groups.component.html
View File

@ -36,7 +36,8 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

9
src/app/organizations/settings/account.component.html
View File

@ -13,11 +13,13 @@
</div>
<div class="form-group">
<label for="billingEmail">{{'billingEmail' | i18n}}</label>
<input id="billingEmail" class="form-control" type="text" name="BillingEmail" [(ngModel)]="org.billingEmail">
<input id="billingEmail" class="form-control" type="text" name="BillingEmail"
[(ngModel)]="org.billingEmail">
</div>
<div class="form-group">
<label for="businessName">{{'businessName' | i18n}}</label>
<input id="businessName" class="form-control" type="text" name="BusinessName" [(ngModel)]="org.businessName">
<input id="businessName" class="form-control" type="text" name="BusinessName"
[(ngModel)]="org.businessName">
</div>
</div>
<div class="col-6">
@ -42,7 +44,8 @@
<div class="card border-danger">
<div class="card-body">
<p>{{'dangerZoneDesc' | i18n}}</p>
<button type="button" class="btn btn-outline-danger" (click)="deleteOrganization()">{{'deleteOrganization' | i18n}}</button>
<button type="button" class="btn btn-outline-danger"
(click)="deleteOrganization()">{{'deleteOrganization' | i18n}}</button>
<button type="button" class="btn btn-outline-danger" (click)="purgeVault()">{{'purgeVault' | i18n}}</button>
</div>
</div>

4
src/app/organizations/settings/adjust-seats.component.html
View File

@ -4,8 +4,8 @@
<div class="row">
<div class="form-group col-6">
<label for="seatAdjustment">{{(add ? 'seatsToAdd' : 'seatsToRemove') | i18n}}</label>
<input id="seatAdjustment" class="form-control" type="number" name="SeatAdjustment" [(ngModel)]="seatAdjustment" min="0"
step="1" required>
<input id="seatAdjustment" class="form-control" type="number" name="SeatAdjustment"
[(ngModel)]="seatAdjustment" min="0" step="1" required>
</div>
</div>
<div *ngIf="add" class="mb-3">

4
src/app/organizations/settings/delete-organization.component.html
View File

@ -11,8 +11,8 @@
<p>{{'deleteOrganizationDesc' | i18n}}</p>
<app-callout type="warning">{{'deleteOrganizationWarning' | i18n}}</app-callout>
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
appAutofocus appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

38
src/app/organizations/settings/organization-subscription.component.html
View File

@ -8,11 +8,12 @@
</div>
<i class="fa fa-spinner fa-spin text-muted" *ngIf="!firstLoaded && loading" title="{{'loading' | i18n}}"></i>
<ng-container *ngIf="sub">
<app-callout type="warning" title="{{'canceled' | i18n}}" *ngIf="subscription && subscription.cancelled">{{'subscriptionCanceled' | i18n}}</app-callout>
<app-callout type="warning" title="{{'canceled' | i18n}}" *ngIf="subscription && subscription.cancelled">
{{'subscriptionCanceled' | i18n}}</app-callout>
<app-callout type="warning" title="{{'pendingCancellation' | i18n}}" *ngIf="subscriptionMarkedForCancel">
<p>{{'subscriptionPendingCanceled' | i18n}}</p>
<button #reinstateBtn type="button" class="btn btn-outline-secondary btn-submit" (click)="reinstate()" [appApiAction]="reinstatePromise"
[disabled]="reinstateBtn.loading">
<button #reinstateBtn type="button" class="btn btn-outline-secondary btn-submit" (click)="reinstate()"
[appApiAction]="reinstatePromise" [disabled]="reinstateBtn.loading">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'reinstateSubscription' | i18n}}</span>
</button>
@ -39,7 +40,8 @@
<dt>{{'status' | i18n}}</dt>
<dd>
<span class="text-capitalize">{{subscription.status || '-'}}</span>
<span class="badge badge-warning" *ngIf="subscriptionMarkedForCancel">{{'pendingCancellation' | i18n}}</span>
<span class="badge badge-warning"
*ngIf="subscriptionMarkedForCancel">{{'pendingCancellation' | i18n}}</span>
</dd>
<dt>{{'nextCharge' | i18n}}</dt>
<dd>{{nextInvoice ? ((nextInvoice.date | date: 'mediumDate') + ', ' + (nextInvoice.amount | currency:'$'))
@ -76,7 +78,8 @@
<div class="card mt-3" *ngIf="showUpdateLicense">
<div class="card-body">
<h3 class="card-body-header">{{'updateLicense' | i18n}}</h3>
<app-update-license [organizationId]="organizationId" (onUpdated)="closeUpdateLicense(true)" (onCanceled)="closeUpdateLicense(false)"></app-update-license>
<app-update-license [organizationId]="organizationId" (onUpdated)="closeUpdateLicense(true)"
(onCanceled)="closeUpdateLicense(false)"></app-update-license>
</div>
</div>
</ng-container>
@ -85,13 +88,15 @@
<button type="button" class="btn btn-outline-secondary" (click)="changePlan()">
{{'changeBillingPlan' | i18n}}
</button>
<button type="button" class="btn btn-outline-secondary btn-submit ml-1" #licenseBtn [appApiAction]="licensePromise" [disabled]="licenseBtn.loading"
(click)="downloadLicense()" *ngIf="canDownloadLicense">
<button type="button" class="btn btn-outline-secondary btn-submit ml-1" #licenseBtn
[appApiAction]="licensePromise" [disabled]="licenseBtn.loading" (click)="downloadLicense()"
*ngIf="canDownloadLicense">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'downloadLicense' | i18n}}</span>
</button>
<button #cancelBtn type="button" class="btn btn-outline-danger btn-submit ml-auto" (click)="cancel()" [appApiAction]="cancelPromise"
[disabled]="cancelBtn.loading" *ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
<button #cancelBtn type="button" class="btn btn-outline-danger btn-submit ml-auto" (click)="cancel()"
[appApiAction]="cancelPromise" [disabled]="cancelBtn.loading"
*ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'cancelSubscription' | i18n}}</span>
</button>
@ -108,15 +113,17 @@
{{'removeSeats' | i18n}}
</button>
</div>
<app-adjust-seats [seatPrice]="seatPrice" [add]="adjustSeatsAdd" [organizationId]="organizationId" [interval]="billingInterval"
(onAdjusted)="closeSeats(true)" (onCanceled)="closeSeats(false)" *ngIf="showAdjustSeats"></app-adjust-seats>
<app-adjust-seats [seatPrice]="seatPrice" [add]="adjustSeatsAdd" [organizationId]="organizationId"
[interval]="billingInterval" (onAdjusted)="closeSeats(true)" (onCanceled)="closeSeats(false)"
*ngIf="showAdjustSeats"></app-adjust-seats>
</div>
</ng-container>
<h2 class="spaced-header">{{'storage' | i18n}}</h2>
<p>{{'subscriptionStorage' | i18n : sub.maxStorageGb || 0 : sub.storageName || '0 MB'}}</p>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar" [ngStyle]="{width: storageProgressWidth + '%' }" [attr.aria-valuenow]="storagePercentage"
aria-valuemin="0" aria-valuemax="100">{{(storagePercentage / 100) | percent}}</div>
<div class="progress-bar bg-success" role="progressbar" [ngStyle]="{width: storageProgressWidth + '%' }"
[attr.aria-valuenow]="storagePercentage" aria-valuemin="0" aria-valuemax="100">
{{(storagePercentage / 100) | percent}}</div>
</div>
<ng-container *ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
<div class="mt-3">
@ -128,8 +135,9 @@
{{'removeStorage' | i18n}}
</button>
</div>
<app-adjust-storage [storageGbPrice]="storageGbPrice" [add]="adjustStorageAdd" [organizationId]="organizationId" [interval]="billingInterval"
(onAdjusted)="closeStorage(true)" (onCanceled)="closeStorage(false)" *ngIf="showAdjustStorage"></app-adjust-storage>
<app-adjust-storage [storageGbPrice]="storageGbPrice" [add]="adjustStorageAdd"
[organizationId]="organizationId" [interval]="billingInterval" (onAdjusted)="closeStorage(true)"
(onCanceled)="closeStorage(false)" *ngIf="showAdjustStorage"></app-adjust-storage>
</div>
</ng-container>
</ng-container>

3
src/app/organizations/tools/tools.component.html
View File

@ -16,7 +16,8 @@
<div class="card-header d-flex">
{{'reports' | i18n}}
<div class="ml-auto">
<a href="#" appStopClick class="badge badge-primary" *ngIf="!accessReports" (click)="upgradeOrganization()">
<a href="#" appStopClick class="badge badge-primary" *ngIf="!accessReports"
(click)="upgradeOrganization()">
{{'upgrade' | i18n}}
</a>
</div>

9
src/app/organizations/vault/vault.component.html
View File

@ -1,7 +1,8 @@
<div class="container page-content">
<div class="row">
<div class="col-3">
<app-org-vault-groupings [showFolders]="false" [showFavorites]="false" (onAllClicked)="clearGroupingFilters()" (onCipherTypeClicked)="filterCipherType($event)"
<app-org-vault-groupings [showFolders]="false" [showFavorites]="false"
(onAllClicked)="clearGroupingFilters()" (onCipherTypeClicked)="filterCipherType($event)"
(onCollectionClicked)="filterCollection($event.id)" (onSearchTextChanged)="filterSearchText($event)">
</app-org-vault-groupings>
</div>
@ -10,14 +11,16 @@
<h1>
{{'vault' | i18n}}
<small #actionSpinner [appApiAction]="ciphersComponent.actionPromise">
<i *ngIf="actionSpinner.loading" class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
<i *ngIf="actionSpinner.loading" class="fa fa-spinner fa-spin text-muted"
title="{{'loading' | i18n}}"></i>
</small>
</h1>
<button type="button" class="btn btn-outline-primary btn-sm ml-auto" (click)="addCipher()">
<i class="fa fa-plus fa-fw"></i>{{'addItem' | i18n}}
</button>
</div>
<app-org-vault-ciphers (onCipherClicked)="editCipher($event)" (onAttachmentsClicked)="editCipherAttachments($event)" (onAddCipher)="addCipher()"
<app-org-vault-ciphers (onCipherClicked)="editCipher($event)"
(onAttachmentsClicked)="editCipherAttachments($event)" (onAddCipher)="addCipher()"
(onCollectionsClicked)="editCipherCollections($event)" (onEventsClicked)="viewEvents($event)">
</app-org-vault-ciphers>
</div>

6
src/app/settings/account.component.html
View File

@ -20,9 +20,11 @@
<div class="card border-danger">
<div class="card-body">
<p>{{'dangerZoneDesc' | i18n}}</p>
<button type="button" class="btn btn-outline-danger" (click)="deauthorizeSessions()">{{'deauthorizeSessions' | i18n}}</button>
<button type="button" class="btn btn-outline-danger"
(click)="deauthorizeSessions()">{{'deauthorizeSessions' | i18n}}</button>
<button type="button" class="btn btn-outline-danger" (click)="purgeVault()">{{'purgeVault' | i18n}}</button>
<button type="button" class="btn btn-outline-danger" (click)="deleteAccount()">{{'deleteAccount' | i18n}}</button>
<button type="button" class="btn btn-outline-danger"
(click)="deleteAccount()">{{'deleteAccount' | i18n}}</button>
</div>
</div>
<ng-template #deauthorizeSessionsTemplate></ng-template>

7
src/app/settings/add-credit.component.html
View File

@ -3,7 +3,8 @@
<h3 class="card-body-header">{{'addCredit' | i18n}}</h3>
<div class="mb-4 text-lg" *ngIf="showOptions">
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="Method" id="credit-method-paypal" [value]="paymentMethodType.PayPal" [(ngModel)]="method" (change)="changeMethod()">
<input class="form-check-input" type="radio" name="Method" id="credit-method-paypal"
[value]="paymentMethodType.PayPal" [(ngModel)]="method" (change)="changeMethod()">
<label class="form-check-label" for="credit-method-paypal">
<i class="fa fa-fw fa-paypal"></i> PayPal</label>
</div>
@ -21,8 +22,8 @@
<label for="creditAmount">{{'amount' | i18n}}</label>
<div class="input-group">
<div class="input-group-prepend"><span class="input-group-text">$USD</span></div>
<input id="creditAmount" class="form-control" type="text" name="CreditAmount" [(ngModel)]="creditAmount"
(blur)="formatAmount()" required>
<input id="creditAmount" class="form-control" type="text" name="CreditAmount"
[(ngModel)]="creditAmount" (blur)="formatAmount()" required>
</div>
</div>
</div>

7
src/app/settings/adjust-storage.component.html
View File

@ -4,12 +4,13 @@
<div class="row">
<div class="form-group col-6">
<label for="storageAdjustment">{{(add ? 'gbStorageAdd' : 'gbStorageRemove') | i18n}}</label>
<input id="storageAdjustment" class="form-control" type="number" name="StroageGbAdjustment" [(ngModel)]="storageAdjustment"
min="0" max="99" step="1" required>
<input id="storageAdjustment" class="form-control" type="number" name="StroageGbAdjustment"
[(ngModel)]="storageAdjustment" min="0" max="99" step="1" required>
</div>
</div>
<div *ngIf="add" class="mb-3">
<strong>{{'total' | i18n}}:</strong> {{storageAdjustment || 0}} GB &times; {{storageGbPrice | currency:'$'}} = {{adjustedStorageTotal
<strong>{{'total' | i18n}}:</strong> {{storageAdjustment || 0}} GB &times; {{storageGbPrice | currency:'$'}}
= {{adjustedStorageTotal
| currency:'$'}} /{{interval | i18n}}
</div>
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">

11
src/app/settings/change-email.component.html
View File

@ -3,13 +3,13 @@
<div class="col-6">
<div class="form-group">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
[readonly]="tokenSent" appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required [readonly]="tokenSent" appInputVerbatim>
</div>
<div class="form-group">
<label for="newEmail">{{'newEmail' | i18n}}</label>
<input id="newEmail" class="form-control" type="text" name="NewEmail" [(ngModel)]="newEmail" required [readonly]="tokenSent"
inputmode="email" appInputVerbatim="false">
<input id="newEmail" class="form-control" type="text" name="NewEmail" [(ngModel)]="newEmail" required
[readonly]="tokenSent" inputmode="email" appInputVerbatim="false">
</div>
</div>
</div>
@ -21,7 +21,8 @@
<div class="col-6">
<div class="form-group">
<label for="token">{{'code' | i18n}}</label>
<input id="token" class="form-control" type="text" name="Token" [(ngModel)]="token" required appInputVerbatim>
<input id="token" class="form-control" type="text" name="Token" [(ngModel)]="token" required
appInputVerbatim>
</div>
</div>
</div>

14
src/app/settings/change-kdf.component.html
View File

@ -4,8 +4,8 @@
<div class="col-6">
<div class="form-group">
<label for="kdfMasterPassword">{{'masterPass' | i18n}}</label>
<input id="kdfMasterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword"
required appInputVerbatim>
<input id="kdfMasterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appInputVerbatim>
</div>
</div>
</div>
@ -13,7 +13,8 @@
<div class="col-6">
<div class="form-group mb-0">
<label for="kdf">{{'kdfAlgorithm' | i18n}}</label>
<a class="ml-auto" href="https://en.wikipedia.org/wiki/Key_derivation_function" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://en.wikipedia.org/wiki/Key_derivation_function" target="_blank"
rel="noopener" title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
<select id="kdf" name="Kdf" [(ngModel)]="kdf" class="form-control" required>
@ -24,11 +25,12 @@
<div class="col-6">
<div class="form-group mb-0">
<label for="kdfIterations">{{'kdfIterations' | i18n}}</label>
<a class="ml-auto" href="https://en.wikipedia.org/wiki/PBKDF2" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://en.wikipedia.org/wiki/PBKDF2" target="_blank" rel="noopener"
title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
<input id="kdfIterations" type="number" min="5000" max="1000000" name="KdfIterations" class="form-control" [(ngModel)]="kdfIterations"
required>
<input id="kdfIterations" type="number" min="5000" max="1000000" name="KdfIterations"
class="form-control" [(ngModel)]="kdfIterations" required>
</div>
</div>
<div class="col-12">

9
src/app/settings/change-password.component.html
View File

@ -22,15 +22,16 @@
<div class="col-6">
<div class="form-group">
<label for="confirmNewMasterPassword">{{'confirmNewMasterPass' | i18n}}</label>
<input id="confirmNewMasterPassword" type="password" name="ConfirmNewMasterPasswordHash" class="form-control"
[(ngModel)]="confirmNewMasterPassword" required appInputVerbatim autocomplete="new-password">
<input id="confirmNewMasterPassword" type="password" name="ConfirmNewMasterPasswordHash"
class="form-control" [(ngModel)]="confirmNewMasterPassword" required appInputVerbatim
autocomplete="new-password">
</div>
</div>
</div>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="rotateEncKey" name="RotateEncKey" [(ngModel)]="rotateEncKey"
(change)="rotateEncKeyClicked()">
<input class="form-check-input" type="checkbox" id="rotateEncKey" name="RotateEncKey"
[(ngModel)]="rotateEncKey" (change)="rotateEncKeyClicked()">
<label class="form-check-label" for="rotateEncKey">
{{'rotateAccountEncKey' | i18n}}
</label>

71
src/app/settings/create-organization.component.html
View File

@ -8,7 +8,8 @@
<div class="form-group">
<label for="file">{{'licenseFile' | i18n}}</label>
<input type="file" id="file" class="form-control-file" name="file" required>
<small class="form-text text-muted">{{'licenseFileDesc' | i18n : 'bitwarden_organization_license.json'}}</small>
<small
class="form-text text-muted">{{'licenseFileDesc' | i18n : 'bitwarden_organization_license.json'}}</small>
</div>
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
@ -25,11 +26,13 @@
</div>
<div class="form-group col-6">
<label for="billingEmail">{{'billingEmail' | i18n}}</label>
<input id="billingEmail" class="form-control" type="text" name="BillingEmail" [(ngModel)]="billingEmail" required>
<input id="billingEmail" class="form-control" type="text" name="BillingEmail" [(ngModel)]="billingEmail"
required>
</div>
</div>
<div class="form-group form-check">
<input id="ownedBusiness" class="form-check-input" type="checkbox" name="OwnedBusiness" [(ngModel)]="ownedBusiness" (change)="changedOwnedBusiness()">
<input id="ownedBusiness" class="form-check-input" type="checkbox" name="OwnedBusiness"
[(ngModel)]="ownedBusiness" (change)="changedOwnedBusiness()">
<label for="ownedBusiness" class="form-check-label">{{'accountOwnedBusiness' | i18n}}</label>
</div>
<div class="row" *ngIf="ownedBusiness">
@ -40,7 +43,8 @@
</div>
<h2 class="mt-5">{{'chooseYourPlan' | i18n}}</h2>
<div class="form-check form-check-block" *ngIf="!ownedBusiness">
<input class="form-check-input" type="radio" name="PlanType" id="planFree" value="free" [(ngModel)]="plan" (change)="changedPlan()">
<input class="form-check-input" type="radio" name="PlanType" id="planFree" value="free" [(ngModel)]="plan"
(change)="changedPlan()">
<label class="form-check-label" for="planFree">
{{'planNameFree' | i18n}}
<small class="mb-1">{{'planDescFree' | i18n : '1'}}</small>
@ -50,7 +54,8 @@
</label>
</div>
<div class="form-check form-check-block" *ngIf="!ownedBusiness">
<input class="form-check-input" type="radio" name="PlanType" id="planFamilies" value="families" [(ngModel)]="plan" (change)="changedPlan()">
<input class="form-check-input" type="radio" name="PlanType" id="planFamilies" value="families"
[(ngModel)]="plan" (change)="changedPlan()">
<label class="form-check-label" for="planFamilies">
{{'planNameFamilies' | i18n}}
<small class="mb-1">{{'planDescFamilies' | i18n}}</small>
@ -64,7 +69,8 @@
</label>
</div>
<div class="form-check form-check-block">
<input class="form-check-input" type="radio" name="PlanType" id="planTeams" value="teams" [(ngModel)]="plan" (change)="changedPlan()">
<input class="form-check-input" type="radio" name="PlanType" id="planTeams" value="teams" [(ngModel)]="plan"
(change)="changedPlan()">
<label class="form-check-label" for="planTeams">
{{'planNameTeams' | i18n}}
<small class="mb-1">{{'planDescTeams' | i18n}}</small>
@ -73,12 +79,14 @@
<small>• {{'gbEncryptedFileStorage' | i18n : '1 GB'}}</small>
<small>• {{'priorityCustomerSupport' | i18n}}</small>
<small>• {{'xDayFreeTrial' | i18n : '7'}}</small>
<span>{{5 | currency:'$'}} /{{'month' | i18n}}, {{'includesXUsers' | i18n : 5}}, {{('additionalUsers' | i18n).toLowerCase()}}
<span>{{5 | currency:'$'}} /{{'month' | i18n}}, {{'includesXUsers' | i18n : 5}},
{{('additionalUsers' | i18n).toLowerCase()}}
{{2 | currency:'$'}} /{{'month' | i18n}}</span>
</label>
</div>
<div class="form-check form-check-block">
<input class="form-check-input" type="radio" name="PlanType" id="planEnterprise" value="enterprise" [(ngModel)]="plan" (change)="changedPlan()">
<input class="form-check-input" type="radio" name="PlanType" id="planEnterprise" value="enterprise"
[(ngModel)]="plan" (change)="changedPlan()">
<label class="form-check-label" for="planEnterprise">
{{'planNameEnterprise' | i18n}}
<small class="mb-1">{{'planDescEnterprise' | i18n}}</small>
@ -101,8 +109,9 @@
<div class="row">
<div class="col-6">
<label for="additionalSeats">{{'userSeats' | i18n}}</label>
<input id="additionalSeats" class="form-control" type="number" name="AdditionalSeats" [(ngModel)]="additionalSeats" min="1"
max="100000" placeholder="{{'userSeatsDesc' | i18n}}" required>
<input id="additionalSeats" class="form-control" type="number" name="AdditionalSeats"
[(ngModel)]="additionalSeats" min="1" max="100000" placeholder="{{'userSeatsDesc' | i18n}}"
required>
<small class="text-muted form-text">{{'userSeatsHowManyDesc' | i18n}}</small>
</div>
</div>
@ -111,45 +120,54 @@
<div class="row" *ngIf="!plans[plan].noAdditionalSeats && plans[plan].baseSeats">
<div class="form-group col-6">
<label for="additionalSeats">{{'additionalUserSeats' | i18n}}</label>
<input id="additionalSeats" class="form-control" type="number" name="AdditionalSeats" [(ngModel)]="additionalSeats" min="0"
max="100000" placeholder="{{'userSeatsDesc' | i18n}}">
<small class="text-muted form-text">{{'userSeatsAdditionalDesc' | i18n : plans[plan].baseSeats : (plans[plan].seatPrice | currency:'$')}}</small>
<input id="additionalSeats" class="form-control" type="number" name="AdditionalSeats"
[(ngModel)]="additionalSeats" min="0" max="100000" placeholder="{{'userSeatsDesc' | i18n}}">
<small
class="text-muted form-text">{{'userSeatsAdditionalDesc' | i18n : plans[plan].baseSeats : (plans[plan].seatPrice | currency:'$')}}</small>
</div>
</div>
<div class="row">
<div class="form-group col-6">
<label for="additionalStorage">{{'additionalStorageGb' | i18n}}</label>
<input id="additionalStorage" class="form-control" type="number" name="AdditionalStorageGb" [(ngModel)]="additionalStorage"
min="0" max="99" step="1" placeholder="{{'additionalStorageGbDesc' | i18n}}">
<small class="text-muted form-text">{{'additionalStorageIntervalDesc' | i18n : '1 GB' : (storageGb.price | currency:'$') : ('month' | i18n)}}</small>
<input id="additionalStorage" class="form-control" type="number" name="AdditionalStorageGb"
[(ngModel)]="additionalStorage" min="0" max="99" step="1"
placeholder="{{'additionalStorageGbDesc' | i18n}}">
<small
class="text-muted form-text">{{'additionalStorageIntervalDesc' | i18n : '1 GB' : (storageGb.price | currency:'$') : ('month' | i18n)}}</small>
</div>
</div>
<div class="row">
<div class="form-group col-6" *ngIf="plans[plan].canBuyPremiumAccessAddon">
<div class="form-check">
<input id="premiumAccess" class="form-check-input" type="checkbox" name="PremiumAccessAddon" [(ngModel)]="premiumAccessAddon">
<input id="premiumAccess" class="form-check-input" type="checkbox" name="PremiumAccessAddon"
[(ngModel)]="premiumAccessAddon">
<label for="premiumAccess" class="form-check-label bold">{{'premiumAccess' | i18n}}</label>
</div>
<small class="text-muted form-text">{{'premiumAccessDesc' | i18n : (3.33 | currency:'$') : ('month' | i18n)}}</small>
<small
class="text-muted form-text">{{'premiumAccessDesc' | i18n : (3.33 | currency:'$') : ('month' | i18n)}}</small>
</div>
</div>
<h2 class="spaced-header">{{'summary' | i18n}}</h2>
<div class="form-check form-check-block">
<input class="form-check-input" type="radio" name="BillingInterval" id="intervalAnnually" value="year" [(ngModel)]="interval">
<input class="form-check-input" type="radio" name="BillingInterval" id="intervalAnnually" value="year"
[(ngModel)]="interval">
<label class="form-check-label" for="intervalAnnually">
{{'annually' | i18n}}
<small *ngIf="plans[plan].annualBasePrice">
{{'basePrice' | i18n}}: {{plans[plan].basePrice | currency:'$'}} &times;12 {{'monthAbbr' | i18n}} = {{baseTotal(true) | currency:'$'}}
{{'basePrice' | i18n}}: {{plans[plan].basePrice | currency:'$'}} &times;12 {{'monthAbbr' | i18n}} =
{{baseTotal(true) | currency:'$'}}
/{{'year' | i18n}}
</small>
<small *ngIf="!plans[plan].noAdditionalSeats">
<span *ngIf="plans[plan].baseSeats">{{'additionalUsers' | i18n}}:</span>
<span *ngIf="!plans[plan].baseSeats">{{'users' | i18n}}:</span>
{{additionalSeats || 0}} &times; {{plans[plan].seatPrice | currency:'$'}} &times;12 {{'monthAbbr' | i18n}} = {{seatTotal(true)
{{additionalSeats || 0}} &times; {{plans[plan].seatPrice | currency:'$'}} &times;12
{{'monthAbbr' | i18n}} = {{seatTotal(true)
| currency:'$'}} /{{'year' | i18n}}
</small>
<small>
{{'additionalStorageGb' | i18n}}: {{additionalStorage || 0}} &times; {{storageGb.price | currency:'$'}} &times;12 {{'monthAbbr'
{{'additionalStorageGb' | i18n}}: {{additionalStorage || 0}} &times;
{{storageGb.price | currency:'$'}} &times;12 {{'monthAbbr'
| i18n}} = {{additionalStorageTotal(true) | currency:'$'}} /{{'year' | i18n}}
</small>
<small *ngIf="plans[plan].canBuyPremiumAccessAddon && premiumAccessAddon">
@ -159,7 +177,8 @@
</label>
</div>
<div class="form-check form-check-block" *ngIf="plans[plan].monthlySeatPrice">
<input class="form-check-input" type="radio" name="BillingInterval" id="intervalMonthly" value="month" [(ngModel)]="interval">
<input class="form-check-input" type="radio" name="BillingInterval" id="intervalMonthly" value="month"
[(ngModel)]="interval">
<label class="form-check-label" for="intervalMonthly">
{{'monthly' | i18n}}
<small *ngIf="plans[plan].monthlyBasePrice">
@ -168,11 +187,13 @@
<small *ngIf="!plans[plan].noAdditionalSeats">
<span *ngIf="plans[plan].baseSeats">{{'additionalUsers' | i18n}}:</span>
<span *ngIf="!plans[plan].baseSeats">{{'users' | i18n}}:</span>
{{additionalSeats || 0}} &times; {{plans[plan].monthlySeatPrice | currency:'$'}} = {{seatTotal(false) | currency:'$'}} /{{'month'
{{additionalSeats || 0}} &times; {{plans[plan].monthlySeatPrice | currency:'$'}} =
{{seatTotal(false) | currency:'$'}} /{{'month'
| i18n}}
</small>
<small>
{{'additionalStorageGb' | i18n}}: {{additionalStorage || 0}} &times; {{storageGb.monthlyPrice | currency:'$'}} = {{additionalStorageTotal(false)
{{'additionalStorageGb' | i18n}}: {{additionalStorage || 0}} &times;
{{storageGb.monthlyPrice | currency:'$'}} = {{additionalStorageTotal(false)
| currency:'$'}} /{{'month' | i18n}}
</small>
</label>

4
src/app/settings/deauthorize-sessions.component.html
View File

@ -11,8 +11,8 @@
<p>{{'deauthorizeSessionsDesc' | i18n}}</p>
<app-callout type="warning">{{'deauthorizeSessionsWarning' | i18n}}</app-callout>
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
appAutoFocus appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appAutoFocus appInputVerbatim>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

4
src/app/settings/delete-account.component.html
View File

@ -11,8 +11,8 @@
<p>{{'deleteAccountDesc' | i18n}}</p>
<app-callout type="warning">{{'deleteAccountWarning' | i18n}}</app-callout>
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
appAutofocus appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

13
src/app/settings/domain-rules.component.html
View File

@ -11,8 +11,8 @@
<div class="form-group d-flex" *ngFor="let d of custom; let i = index; trackBy: indexTrackBy">
<div class="flex-fill">
<label for="customDomain_{{i}}" class="sr-only">{{'customDomainX' | i18n : (i + 1)}}</label>
<textarea class="form-control" name="CustomDomain[{{i}}]" id="customDomain_{{i}}" [(ngModel)]="custom[i]" placeholder="{{'ex' | i18n}} google.com, gmail.com"
required></textarea>
<textarea class="form-control" name="CustomDomain[{{i}}]" id="customDomain_{{i}}"
[(ngModel)]="custom[i]" placeholder="{{'ex' | i18n}} google.com, gmail.com" required></textarea>
</div>
<button type="button" class="btn btn-link text-danger ml-2" (click)="remove(i)" title="{{'remove' | i18n}}">
<i class="fa fa-minus-circle fa-lg"></i>
@ -37,15 +37,18 @@
<td [ngClass]="{'table-list-strike': d.excluded}">{{d.domains}}</td>
<td class="table-list-options">
<div class="dropdown" appListDropdown>
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog fa-lg"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="#" appStopClick (click)="toggleExcluded(d)" *ngIf="!d.excluded">
<a class="dropdown-item" href="#" appStopClick (click)="toggleExcluded(d)"
*ngIf="!d.excluded">
<i class="fa fa-fw fa-close"></i>
{{'exclude' | i18n}}
</a>
<a class="dropdown-item" href="#" appStopClick (click)="toggleExcluded(d)" *ngIf="d.excluded">
<a class="dropdown-item" href="#" appStopClick (click)="toggleExcluded(d)"
*ngIf="d.excluded">
<i class="fa fa-fw fa-plus"></i>
{{'include' | i18n}}
</a>

12
src/app/settings/options.component.html
View File

@ -19,7 +19,8 @@
<div class="form-group">
<div class="d-flex">
<label for="locale">{{'language' | i18n}}</label>
<a class="ml-auto" href="https://help.bitwarden.com/article/localization/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://help.bitwarden.com/article/localization/" target="_blank"
rel="noopener" title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</div>
@ -32,11 +33,13 @@
</div>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="disableIcons" name="DisableIcons" [(ngModel)]="disableIcons">
<input class="form-check-input" type="checkbox" id="disableIcons" name="DisableIcons"
[(ngModel)]="disableIcons">
<label class="form-check-label" for="disableIcons">
{{'disableIcons' | i18n}}
</label>
<a href="https://help.bitwarden.com/article/website-icons/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a href="https://help.bitwarden.com/article/website-icons/" target="_blank" rel="noopener"
title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</div>
@ -44,7 +47,8 @@
</div>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="enableGravatars" name="enableGravatars" [(ngModel)]="enableGravatars">
<input class="form-check-input" type="checkbox" id="enableGravatars" name="enableGravatars"
[(ngModel)]="enableGravatars">
<label class="form-check-label" for="enableGravatars">
{{'enableGravatars' | i18n}}
</label>

12
src/app/settings/organizations.component.html
View File

@ -7,7 +7,8 @@
<li *ngFor="let o of organizations">
<a [routerLink]="['/organizations', o.id]" class="text-body">
<i class="fa-li fa fa-caret-right"></i> {{o.name}}
<i *ngIf="!o.enabled" class="fa fa-exclamation-triangle text-danger" title="{{'organizationIsDisabled' | i18n}}"></i>
<i *ngIf="!o.enabled" class="fa fa-exclamation-triangle text-danger"
title="{{'organizationIsDisabled' | i18n}}"></i>
</a>
</li>
</ul>
@ -26,7 +27,8 @@
<i class="fa fa-spinner fa-spin text-muted" *ngIf="action.loading" title="{{'loading' | i18n}}"></i>
</small>
</h1>
<a href="#" routerLink="/settings/create-organization" class="btn btn-sm btn-outline-primary ml-auto" *ngIf="!loaded || (organizations && organizations.length)">
<a href="#" routerLink="/settings/create-organization" class="btn btn-sm btn-outline-primary ml-auto"
*ngIf="!loaded || (organizations && organizations.length)">
<i class="fa fa-plus fa-fw"></i>
{{'newOrganization' | i18n}}
</a>
@ -48,11 +50,13 @@
</td>
<td>
<a href="#" [routerLink]="['/organizations', o.id]">{{o.name}}</a>
<i *ngIf="!o.enabled" class="fa fa-exclamation-triangle text-danger" title="{{'organizationIsDisabled' | i18n}}"></i>
<i *ngIf="!o.enabled" class="fa fa-exclamation-triangle text-danger"
title="{{'organizationIsDisabled' | i18n}}"></i>
</td>
<td class="table-list-options">
<div class="dropdown" appListDropdown>
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button class="btn btn-outline-secondary dropdown-toggle" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog fa-lg"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">

33
src/app/settings/payment.component.html
View File

@ -1,21 +1,25 @@
<div class="mb-4 text-lg" *ngIf="showOptions">
<div class="form-check form-check-inline mr-4">
<input class="form-check-input" type="radio" name="Method" id="method-card" [value]="paymentMethodType.Card" [(ngModel)]="method" (change)="changeMethod()">
<input class="form-check-input" type="radio" name="Method" id="method-card" [value]="paymentMethodType.Card"
[(ngModel)]="method" (change)="changeMethod()">
<label class="form-check-label" for="method-card">
<i class="fa fa-fw fa-credit-card"></i> {{'creditCard' | i18n}}</label>
</div>
<div class="form-check form-check-inline mr-4" *ngIf="!hideBank">
<input class="form-check-input" type="radio" name="Method" id="method-bank" [value]="paymentMethodType.BankAccount" [(ngModel)]="method" (change)="changeMethod()">
<input class="form-check-input" type="radio" name="Method" id="method-bank"
[value]="paymentMethodType.BankAccount" [(ngModel)]="method" (change)="changeMethod()">
<label class="form-check-label" for="method-bank">
<i class="fa fa-fw fa-university"></i> {{'bankAccount' | i18n}}</label>
</div>
<div class="form-check form-check-inline" *ngIf="!hidePaypal">
<input class="form-check-input" type="radio" name="Method" id="method-paypal" [value]="paymentMethodType.PayPal" [(ngModel)]="method" (change)="changeMethod()">
<input class="form-check-input" type="radio" name="Method" id="method-paypal" [value]="paymentMethodType.PayPal"
[(ngModel)]="method" (change)="changeMethod()">
<label class="form-check-label" for="method-paypal">
<i class="fa fa-fw fa-paypal"></i> PayPal</label>
</div>
<div class="form-check form-check-inline" *ngIf="!hideCredit">
<input class="form-check-input" type="radio" name="Method" id="method-credit" [value]="paymentMethodType.Credit" [(ngModel)]="method" (change)="changeMethod()">
<input class="form-check-input" type="radio" name="Method" id="method-credit" [value]="paymentMethodType.Credit"
[(ngModel)]="method" (change)="changeMethod()">
<label class="form-check-label" for="method-credit">
<i class="fa fa-fw fa-dollar"></i> {{'accountCredit' | i18n}}</label>
</div>
@ -27,7 +31,8 @@
<div id="stripe-card-number-element" class="form-control stripe-form-control"></div>
</div>
<div class="form-group col-8 d-flex align-items-end">
<img src="../../images/cards.png" alt="Visa, MasterCard, Discover, AmEx, JCB, Diners Club, UnionPay" width="323" height="32">
<img src="../../images/cards.png" alt="Visa, MasterCard, Discover, AmEx, JCB, Diners Club, UnionPay"
width="323" height="32">
</div>
<div class="form-group col-4">
<label for="stripe-card-expiry-element">{{'expiration' | i18n}}</label>
@ -36,7 +41,8 @@
<div class="form-group col-4">
<label for="stripe-card-cvc-element" class="d-flex">
{{'securityCode' | i18n}}
<a href="https://www.cvvnumber.com/cvv.html" tabindex="-1" target="_blank" rel="noopener noreferrer" class="ml-auto" title="{{'learnMore' | i18n}}">
<a href="https://www.cvvnumber.com/cvv.html" tabindex="-1" target="_blank" rel="noopener noreferrer"
class="ml-auto" title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</label>
@ -51,22 +57,23 @@
<div class="row">
<div class="form-group col-6">
<label for="routing_number">{{'routingNumber' | i18n}}</label>
<input id="routing_number" class="form-control" type="text" name="routing_number" [(ngModel)]="bank.routing_number" required
appInputVerbatim>
<input id="routing_number" class="form-control" type="text" name="routing_number"
[(ngModel)]="bank.routing_number" required appInputVerbatim>
</div>
<div class="form-group col-6">
<label for="account_number">{{'accountNumber' | i18n}}</label>
<input id="account_number" class="form-control" type="text" name="account_number" [(ngModel)]="bank.account_number" required
appInputVerbatim>
<input id="account_number" class="form-control" type="text" name="account_number"
[(ngModel)]="bank.account_number" required appInputVerbatim>
</div>
<div class="form-group col-6">
<label for="account_holder_name">{{'accountHolderName' | i18n}}</label>
<input id="account_holder_name" class="form-control" type="text" name="account_holder_name" [(ngModel)]="bank.account_holder_name"
required>
<input id="account_holder_name" class="form-control" type="text" name="account_holder_name"
[(ngModel)]="bank.account_holder_name" required>
</div>
<div class="form-group col-6">
<label for="account_holder_type">{{'bankAccountType' | i18n}}</label>
<select id="account_holder_type" class="form-control" name="account_holder_type" [(ngModel)]="bank.account_holder_type" required>
<select id="account_holder_type" class="form-control" name="account_holder_type"
[(ngModel)]="bank.account_holder_type" required>
<option value="">-- {{'select' | i18n}} --</option>
<option value="company">{{'bankAccountTypeCompany' | i18n}}</option>
<option value="individual">{{'bankAccountTypeIndividual' | i18n}}</option>

12
src/app/settings/premium.component.html
View File

@ -33,8 +33,8 @@
</li>
</ul>
<p class="text-lg" [ngClass]="{'mb-0':!selfHosted}">{{'premiumPrice' | i18n : (premiumPrice | currency:'$')}}</p>
<a href="https://vault.bitwarden.com/#/settings/premium" target="_blank" rel="noopener" class="btn btn-outline-secondary"
*ngIf="selfHosted">
<a href="https://vault.bitwarden.com/#/settings/premium" target="_blank" rel="noopener"
class="btn btn-outline-secondary" *ngIf="selfHosted">
{{'purchasePremium' | i18n}}
</a>
</app-callout>
@ -57,9 +57,11 @@
<div class="row">
<div class="form-group col-6">
<label for="additionalStorage">{{'additionalStorageGb' | i18n}}</label>
<input id="additionalStorage" class="form-control" type="number" name="AdditionalStorageGb" [(ngModel)]="additionalStorage"
min="0" max="99" step="1" placeholder="{{'additionalStorageGbDesc' | i18n}}">
<small class="text-muted form-text">{{'additionalStorageIntervalDesc' | i18n : '1 GB' : (storageGbPrice | currency:'$') : ('year' | i18n)}}</small>
<input id="additionalStorage" class="form-control" type="number" name="AdditionalStorageGb"
[(ngModel)]="additionalStorage" min="0" max="99" step="1"
placeholder="{{'additionalStorageGbDesc' | i18n}}">
<small
class="text-muted form-text">{{'additionalStorageIntervalDesc' | i18n : '1 GB' : (storageGbPrice | currency:'$') : ('year' | i18n)}}</small>
</div>
</div>
<h2 class="spaced-header">{{'summary' | i18n}}</h2>

6
src/app/settings/profile.component.html
View File

@ -14,7 +14,8 @@
</div>
<div class="form-group">
<label for="masterPasswordHint">{{'masterPassHintLabel' | i18n}}</label>
<input id="masterPasswordHint" class="form-control" type="text" name="MasterPasswordHint" [(ngModel)]="profile.masterPasswordHint">
<input id="masterPasswordHint" class="form-control" type="text" name="MasterPasswordHint"
[(ngModel)]="profile.masterPasswordHint">
</div>
</div>
<div class="col-6">
@ -25,7 +26,8 @@
<hr>
<p *ngIf="fingerprint">
{{'yourAccountsFingerprint' | i18n}}:
<a href="https://help.bitwarden.com/article/fingerprint-phrase/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a href="https://help.bitwarden.com/article/fingerprint-phrase/" target="_blank" rel="noopener"
title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i></a><br>
<code>{{fingerprint}}</code>
</p>

4
src/app/settings/purge-vault.component.html
View File

@ -11,8 +11,8 @@
<p>{{(organizationId ? 'purgeOrgVaultDesc' : 'purgeVaultDesc') | i18n}}</p>
<app-callout type="warning">{{'purgeVaultWarning' | i18n}}</app-callout>
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
appAutofocus appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger btn-submit" [disabled]="form.loading">

18
src/app/settings/two-factor-authenticator.component.html
View File

@ -10,7 +10,8 @@
<span aria-hidden="true">&times;</span>
</button>
</div>
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)" *ngIf="!authed">
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
*ngIf="!authed">
</app-two-factor-verify>
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed">
<div class="modal-body">
@ -32,15 +33,18 @@
<ul class="fa-ul">
<li>
<i class="fa-li fa fa-apple"></i>{{'iosDevices' | i18n}}:
<a href="https://itunes.apple.com/us/app/authy/id494168017?mt=8" target="_blank" rel="noopener">Authy</a>
<a href="https://itunes.apple.com/us/app/authy/id494168017?mt=8" target="_blank"
rel="noopener">Authy</a>
</li>
<li>
<i class="fa-li fa fa-android"></i>{{'androidDevices' | i18n}}:
<a href="https://play.google.com/store/apps/details?id=com.authy.authy" target="_blank" rel="noopener">Authy</a>
<a href="https://play.google.com/store/apps/details?id=com.authy.authy" target="_blank"
rel="noopener">Authy</a>
</li>
<li>
<i class="fa-li fa fa-windows"></i>{{'windowsDevices' | i18n}}:
<a href="https://www.microsoft.com/p/authenticator/9wzdncrfj3rj" target="_blank" rel="noopener">Microsoft Authenticator</a>
<a href="https://www.microsoft.com/p/authenticator/9wzdncrfj3rj" target="_blank"
rel="noopener">Microsoft Authenticator</a>
</li>
</ul>
<p>{{'twoStepAuthenticatorAppsRecommended' | i18n}}</p>
@ -54,7 +58,8 @@
</p>
<ng-container *ngIf="!enabled">
<label for="token">3. {{'twoStepAuthenticatorEnterCode' | i18n}}</label>
<input id="token" type="text" name="Token" class="form-control" [(ngModel)]="token" required appInputVerbatim>
<input id="token" type="text" name="Token" class="form-control" [(ngModel)]="token" required
appInputVerbatim>
</ng-container>
</div>
<div class="modal-footer">
@ -63,7 +68,8 @@
<span *ngIf="!enabled">{{'enable' | i18n}}</span>
<span *ngIf="enabled">{{'disable' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'close' | i18n}}</button>
</div>
</form>
</div>

19
src/app/settings/two-factor-duo.component.html
View File

@ -10,9 +10,11 @@
<span aria-hidden="true">&times;</span>
</button>
</div>
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)" *ngIf="!authed">
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
*ngIf="!authed">
</app-two-factor-verify>
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed" autocomplete="off">
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed"
autocomplete="off">
<div class="modal-body">
<ng-container *ngIf="enabled">
<app-callout type="success" title="{{'enabled' | i18n}}" icon="fa-check-circle">
@ -30,16 +32,18 @@
<p>{{'twoFactorDuoDesc' | i18n}}</p>
<div class="form-group">
<label for="ikey">{{'twoFactorDuoIntegrationKey' | i18n}}</label>
<input id="ikey" type="text" name="IntegrationKey" class="form-control" [(ngModel)]="ikey" required appInputVerbatim>
<input id="ikey" type="text" name="IntegrationKey" class="form-control" [(ngModel)]="ikey"
required appInputVerbatim>
</div>
<div class="form-group">
<label for="skey">{{'twoFactorDuoSecretKey' | i18n}}</label>
<input id="skey" type="password" name="SecretKey" class="form-control" [(ngModel)]="skey" required appInputVerbatim autocomplete="new-password">
<input id="skey" type="password" name="SecretKey" class="form-control" [(ngModel)]="skey"
required appInputVerbatim autocomplete="new-password">
</div>
<div class="form-group">
<label for="host">{{'twoFactorDuoApiHostname' | i18n}}</label>
<input id="host" type="text" name="Host" class="form-control" [(ngModel)]="host" placeholder="{{'ex' | i18n}} api-xxxxxxxx.duosecurity.com"
required appInputVerbatim>
<input id="host" type="text" name="Host" class="form-control" [(ngModel)]="host"
placeholder="{{'ex' | i18n}} api-xxxxxxxx.duosecurity.com" required appInputVerbatim>
</div>
</ng-container>
</div>
@ -49,7 +53,8 @@
<span *ngIf="!enabled">{{'enable' | i18n}}</span>
<span *ngIf="enabled">{{'disable' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'close' | i18n}}</button>
</div>
</form>
</div>

17
src/app/settings/two-factor-email.component.html
View File

@ -10,7 +10,8 @@
<span aria-hidden="true">&times;</span>
</button>
</div>
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)" *ngIf="!authed">
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
*ngIf="!authed">
</app-two-factor-verify>
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed">
<div class="modal-body">
@ -27,11 +28,13 @@
</p>
<div class="form-group">
<label for="email">1. {{'twoFactorEmailEnterEmail' | i18n}}</label>
<input id="email" type="text" name="Email" class="form-control" [(ngModel)]="email" required inputmode="email" appInputVerbatim="false">
<input id="email" type="text" name="Email" class="form-control" [(ngModel)]="email" required
inputmode="email" appInputVerbatim="false">
</div>
<div class="mb-3 d-flex">
<button #sendBtn type="button" class="btn btn-outline-primary btn-sm btn-submit align-self-start" (click)="sendEmail()" [appApiAction]="emailPromise"
[disabled]="sendBtn.loading">
<button #sendBtn type="button"
class="btn btn-outline-primary btn-sm btn-submit align-self-start" (click)="sendEmail()"
[appApiAction]="emailPromise" [disabled]="sendBtn.loading">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'sendEmail' | i18n}}</span>
</button>
@ -41,7 +44,8 @@
</div>
<div class="form-group">
<label for="token">2. {{'twoFactorEmailEnterCode' | i18n}}</label>
<input id="token" type="text" name="Token" class="form-control" [(ngModel)]="token" required appInputVerbatim>
<input id="token" type="text" name="Token" class="form-control" [(ngModel)]="token" required
appInputVerbatim>
</div>
</ng-container>
</div>
@ -51,7 +55,8 @@
<span *ngIf="!enabled">{{'enable' | i18n}}</span>
<span *ngIf="enabled">{{'disable' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'close' | i18n}}</button>
</div>
</form>
</div>

9
src/app/settings/two-factor-recovery.component.html
View File

@ -10,7 +10,8 @@
<span aria-hidden="true">&times;</span>
</button>
</div>
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)" *ngIf="!authed">
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
*ngIf="!authed">
</app-two-factor-verify>
<ng-container *ngIf="authed">
<div class="modal-body text-center">
@ -23,8 +24,10 @@
</ng-container>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" (click)="print()" *ngIf="code">{{'printCode' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
<button type="button" class="btn btn-primary" (click)="print()"
*ngIf="code">{{'printCode' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'close' | i18n}}</button>
</div>
</ng-container>
</div>

12
src/app/settings/two-factor-setup.component.html
View File

@ -5,7 +5,8 @@
<p *ngIf="organizationId">{{'twoStepLoginOrganizationDesc' | i18n}}</p>
<app-callout type="warning" *ngIf="!organizationId">
<p>{{'twoStepLoginRecoveryWarning' | i18n}}</p>
<button type="button" class="btn btn-outline-secondary" (click)="recoveryCode()">{{'viewRecoveryCode' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
(click)="recoveryCode()">{{'viewRecoveryCode' | i18n}}</button>
</app-callout>
<h2 [ngClass]="{'mt-5':!organizationId}">
{{'providers' | i18n}}
@ -21,15 +22,18 @@
<div class="mx-4">
<h3 class="mb-0">
{{p.name}}
<i class="fa fa-check text-success fa-fw" *ngIf="p.enabled && canAccessPremium" title="{{'enabled' | i18n}}"></i>
<a href="#" appStopClick class="badge badge-primary" *ngIf="!canAccessPremium && p.premium" (click)="premiumRequired()">
<i class="fa fa-check text-success fa-fw" *ngIf="p.enabled && canAccessPremium"
title="{{'enabled' | i18n}}"></i>
<a href="#" appStopClick class="badge badge-primary" *ngIf="!canAccessPremium && p.premium"
(click)="premiumRequired()">
{{'premium' | i18n}}
</a>
</h3>
{{p.description}}
</div>
<div class="ml-auto">
<button type="button" class="btn btn-outline-secondary btn-sm" [disabled]="!canAccessPremium && p.premium" (click)="manage(p.type)">
<button type="button" class="btn btn-outline-secondary btn-sm" [disabled]="!canAccessPremium && p.premium"
(click)="manage(p.type)">
{{'manage' | i18n}}
</button>
</div>

28
src/app/settings/two-factor-u2f.component.html
View File

@ -10,7 +10,8 @@
<span aria-hidden="true">&times;</span>
</button>
</div>
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)" *ngIf="!authed">
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
*ngIf="!authed">
</app-two-factor-verify>
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed">
<div class="modal-body">
@ -29,10 +30,13 @@
<i class="fa-li fa fa-key"></i>
<strong *ngIf="!k.configured || !k.name">{{'u2fkeyX' | i18n : i + 1}}</strong>
<strong *ngIf="k.configured && k.name">{{k.name}}</strong>
<i class="fa fa-fw" [ngClass]="{'fa-check text-success': !k.compromised, 'fa-exclamation-triangle text-warning': k.compromised}"
*ngIf="k.configured && !removeKeyBtn.loading" title="{{(k.compromised ? 'keyCompromised' : 'enabled') | i18n}}"></i>
<i class="fa fa-fw"
[ngClass]="{'fa-check text-success': !k.compromised, 'fa-exclamation-triangle text-warning': k.compromised}"
*ngIf="k.configured && !removeKeyBtn.loading"
title="{{(k.compromised ? 'keyCompromised' : 'enabled') | i18n}}"></i>
<ng-container *ngIf="keysConfiguredCount > 1 && k.configured">
<i class="fa fa-spin fa-spinner text-muted fa-fw" title="{{'loading' | i18n}}" *ngIf="removeKeyBtn.loading"></i>
<i class="fa fa-spin fa-spinner text-muted fa-fw" title="{{'loading' | i18n}}"
*ngIf="removeKeyBtn.loading"></i>
-
<a href="#" appStopClick (click)="remove(k)">{{'remove' | i18n}}</a>
</ng-container>
@ -49,11 +53,13 @@
<div class="row">
<div class="form-group col-6">
<label for="name">{{'name' | i18n}}</label>
<input id="name" type="text" name="Name" class="form-control" [(ngModel)]="name" [disabled]="!keyIdAvailable">
<input id="name" type="text" name="Name" class="form-control" [(ngModel)]="name"
[disabled]="!keyIdAvailable">
</div>
</div>
<button type="button" (click)="readKey()" class="btn btn-outline-secondary mr-2" [disabled]="readKeyBtn.loading || u2fListening || !keyIdAvailable"
#readKeyBtn [appApiAction]="challengePromise">
<button type="button" (click)="readKey()" class="btn btn-outline-secondary mr-2"
[disabled]="readKeyBtn.loading || u2fListening || !keyIdAvailable" #readKeyBtn
[appApiAction]="challengePromise">
{{'readKey' | i18n}}
</button>
<ng-container *ngIf="readKeyBtn.loading">
@ -79,12 +85,14 @@
<i class="fa fa-spinner fa-spin" *ngIf="form.loading" title="{{'loading' | i18n}}"></i>
<span *ngIf="!form.loading">{{'save' | i18n}}</span>
</button>
<button #disableBtn type="button" class="btn btn-outline-secondary btn-submit" [appApiAction]="disablePromise"
[disabled]="disableBtn.loading" (click)="disable()" *ngIf="enabled">
<button #disableBtn type="button" class="btn btn-outline-secondary btn-submit"
[appApiAction]="disablePromise" [disabled]="disableBtn.loading" (click)="disable()"
*ngIf="enabled">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'disableAllKeys' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'close' | i18n}}</button>
</div>
</form>
</div>

4
src/app/settings/two-factor-verify.component.html
View File

@ -2,8 +2,8 @@
<div class="modal-body">
<p>{{'twoStepLoginAuthDesc' | i18n}}</p>
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
appAutoFocus appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appAutoFocus appInputVerbatim>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">

21
src/app/settings/two-factor-yubikey.component.html
View File

@ -10,9 +10,11 @@
<span aria-hidden="true">&times;</span>
</button>
</div>
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)" *ngIf="!authed">
<app-two-factor-verify [organizationId]="organizationId" [type]="type" (onAuthed)="auth($event)"
*ngIf="!authed">
</app-two-factor-verify>
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed" autocomplete="off">
<form #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate *ngIf="authed"
autocomplete="off">
<div class="modal-body">
<app-callout type="success" title="{{'enabled' | i18n}}" icon="fa-check-circle" *ngIf="enabled">
{{'twoStepLoginProviderEnabled' | i18n}}
@ -36,11 +38,12 @@
<div class="row">
<div class="form-group col-6" *ngFor="let k of keys; let i = index">
<label for="key{{i + 1}}">{{'yubikeyX' | i18n : i + 1}}</label>
<input id="key{{i + 1}}" type="password" name="Key{{i + 1}}" class="form-control" [(ngModel)]="k.key" *ngIf="!k.existingKey"
appInputVerbatim autocomplete="new-password">
<input id="key{{i + 1}}" type="password" name="Key{{i + 1}}" class="form-control"
[(ngModel)]="k.key" *ngIf="!k.existingKey" appInputVerbatim autocomplete="new-password">
<div class="d-flex" *ngIf="k.existingKey">
<span class="mr-2">{{k.existingKey}}</span>
<button type="button" class="btn btn-link text-danger ml-auto" (click)="remove(k)" title="{{'remove' | i18n}}">
<button type="button" class="btn btn-link text-danger ml-auto" (click)="remove(k)"
title="{{'remove' | i18n}}">
<i class="fa fa-minus-circle fa-lg"></i>
</button>
</div>
@ -58,12 +61,14 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button #disableBtn type="button" class="btn btn-outline-secondary btn-submit" [appApiAction]="disablePromise" [disabled]="disableBtn.loading"
(click)="disable()" *ngIf="enabled">
<button #disableBtn type="button" class="btn btn-outline-secondary btn-submit"
[appApiAction]="disablePromise" [disabled]="disableBtn.loading" (click)="disable()"
*ngIf="enabled">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'disableAllKeys' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'close' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'close' | i18n}}</button>
</div>
</form>
</div>

7
src/app/settings/update-key.component.html
View File

@ -9,12 +9,13 @@
</div>
<div class="modal-body">
<p>{{'updateEncryptionKeyShortDesc' | i18n}} {{'updateEncryptionKeyDesc' | i18n}}
<a href="https://help.bitwarden.com/article/update-encryption-key/" target="_blank" rel="noopener">{{'learnMore' | i18n}}</a>
<a href="https://help.bitwarden.com/article/update-encryption-key/" target="_blank"
rel="noopener">{{'learnMore' | i18n}}</a>
</p>
<app-callout type="warning">{{'updateEncryptionKeyWarning' | i18n}}</app-callout>
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control" [(ngModel)]="masterPassword" required
appAutofocus appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPasswordHash" class="form-control"
[(ngModel)]="masterPassword" required appAutofocus appInputVerbatim>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">

3
src/app/settings/update-license.component.html
View File

@ -2,7 +2,8 @@
<div class="form-group">
<label for="file" class="sr-only">{{'licenseFile' | i18n}}</label>
<input type="file" id="file" class="form-control-file" name="file" required>
<small class="form-text text-muted">{{'licenseFileDesc' | i18n : (!organizationId ? 'bitwarden_premium_license.json' : 'bitwarden_organization_license.json')}}</small>
<small
class="form-text text-muted">{{'licenseFileDesc' | i18n : (!organizationId ? 'bitwarden_premium_license.json' : 'bitwarden_organization_license.json')}}</small>
</div>
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>

12
src/app/settings/user-billing.component.html
View File

@ -14,8 +14,8 @@
<button type="button" class="btn btn-outline-secondary" (click)="addCredit()" *ngIf="!showAddCredit">
{{'addCredit' | i18n}}
</button>
<app-add-credit [organizationId]="organizationId"
(onAdded)="closeAddCredit(true)" (onCanceled)="closeAddCredit(false)" *ngIf="showAddCredit">
<app-add-credit [organizationId]="organizationId" (onAdded)="closeAddCredit(true)"
(onCanceled)="closeAddCredit(false)" *ngIf="showAddCredit">
</app-add-credit>
<h2 class="spaced-header">{{'paymentMethod' | i18n}}</h2>
<p *ngIf="!paymentSource">{{'noPaymentMethod' | i18n}}</p>
@ -57,8 +57,9 @@
<button type="button" class="btn btn-outline-secondary" (click)="changePayment()" *ngIf="!showAdjustPayment">
{{(paymentSource ? 'changePaymentMethod' : 'addPaymentMethod') | i18n}}
</button>
<app-adjust-payment [currentType]="paymentSource != null ? paymentSource.type : null" [organizationId]="organizationId"
(onAdjusted)="closePayment(true)" (onCanceled)="closePayment(false)" *ngIf="showAdjustPayment">
<app-adjust-payment [currentType]="paymentSource != null ? paymentSource.type : null"
[organizationId]="organizationId" (onAdjusted)="closePayment(true)" (onCanceled)="closePayment(false)"
*ngIf="showAdjustPayment">
</app-adjust-payment>
<h2 class="spaced-header">{{'invoices' | i18n}}</h2>
<p *ngIf="!invoices || !invoices.length">{{'noInvoices' | i18n}}</p>
@ -67,7 +68,8 @@
<tr *ngFor="let i of invoices">
<td>{{i.date | date:'mediumDate'}}</td>
<td>
<a href="{{i.pdfUrl}}" target="_blank" rel="noopener" class="mr-2" title="{{'downloadInvoice' | i18n}}">
<a href="{{i.pdfUrl}}" target="_blank" rel="noopener" class="mr-2"
title="{{'downloadInvoice' | i18n}}">
<i class="fa fa-file-pdf-o"></i></a>
<a href="{{i.url}}" target="_blank" rel="noopener" title="{{'viewInvoice' | i18n}}">
{{'invoiceNumber' | i18n : i.number}}</a>

33
src/app/settings/user-subscription.component.html
View File

@ -8,11 +8,12 @@
</div>
<i class="fa fa-spinner fa-spin text-muted" *ngIf="!firstLoaded && loading" title="{{'loading' | i18n}}"></i>
<ng-container *ngIf="sub">
<app-callout type="warning" title="{{'canceled' | i18n}}" *ngIf="subscription && subscription.cancelled">{{'subscriptionCanceled' | i18n}}</app-callout>
<app-callout type="warning" title="{{'canceled' | i18n}}" *ngIf="subscription && subscription.cancelled">
{{'subscriptionCanceled' | i18n}}</app-callout>
<app-callout type="warning" title="{{'pendingCancellation' | i18n}}" *ngIf="subscriptionMarkedForCancel">
<p>{{'subscriptionPendingCanceled' | i18n}}</p>
<button #reinstateBtn type="button" class="btn btn-outline-secondary btn-submit" (click)="reinstate()" [appApiAction]="reinstatePromise"
[disabled]="reinstateBtn.loading">
<button #reinstateBtn type="button" class="btn btn-outline-secondary btn-submit" (click)="reinstate()"
[appApiAction]="reinstatePromise" [disabled]="reinstateBtn.loading">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'reinstateSubscription' | i18n}}</span>
</button>
@ -28,7 +29,8 @@
<dt>{{'status' | i18n}}</dt>
<dd>
<span class="text-capitalize">{{(subscription && subscription.status) || '-'}}</span>
<span class="badge badge-warning" *ngIf="subscriptionMarkedForCancel">{{'pendingCancellation' | i18n}}</span>
<span class="badge badge-warning"
*ngIf="subscriptionMarkedForCancel">{{'pendingCancellation' | i18n}}</span>
</dd>
<dt>{{'nextCharge' | i18n}}</dt>
<dd>{{nextInvoice ? ((nextInvoice.date | date: 'mediumDate') + ', ' + (nextInvoice.amount | currency:'$')) :
@ -57,24 +59,28 @@
<button type="button" class="btn btn-outline-secondary" (click)="updateLicense()">
{{'updateLicense' | i18n}}
</button>
<a href="https://vault.bitwarden.com/#/settings/subscription" target="_blank" rel="noopener" class="btn btn-outline-secondary">
<a href="https://vault.bitwarden.com/#/settings/subscription" target="_blank" rel="noopener"
class="btn btn-outline-secondary">
{{'manageSubscription' | i18n}}
</a>
</div>
<div class="card mt-3" *ngIf="showUpdateLicense">
<div class="card-body">
<h3 class="card-body-header">{{'updateLicense' | i18n}}</h3>
<app-update-license (onUpdated)="closeUpdateLicense(true)" (onCanceled)="closeUpdateLicense(false)"></app-update-license>
<app-update-license (onUpdated)="closeUpdateLicense(true)" (onCanceled)="closeUpdateLicense(false)">
</app-update-license>
</div>
</div>
</ng-container>
<ng-container *ngIf="!selfHosted">
<div class="d-flex">
<button type="button" class="btn btn-outline-secondary" (click)="downloadLicense()" *ngIf="!subscription || !subscription.cancelled">
<button type="button" class="btn btn-outline-secondary" (click)="downloadLicense()"
*ngIf="!subscription || !subscription.cancelled">
{{'downloadLicense' | i18n}}
</button>
<button #cancelBtn type="button" class="btn btn-outline-danger btn-submit ml-auto" (click)="cancel()" [appApiAction]="cancelPromise"
[disabled]="cancelBtn.loading" *ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
<button #cancelBtn type="button" class="btn btn-outline-danger btn-submit ml-auto" (click)="cancel()"
[appApiAction]="cancelPromise" [disabled]="cancelBtn.loading"
*ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'cancelSubscription' | i18n}}</span>
</button>
@ -82,8 +88,9 @@
<h2 class="spaced-header">{{'storage' | i18n}}</h2>
<p>{{'subscriptionStorage' | i18n : sub.maxStorageGb || 0 : sub.storageName || '0 MB'}}</p>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar" [ngStyle]="{width: storageProgressWidth + '%' }" [attr.aria-valuenow]="storagePercentage"
aria-valuemin="0" aria-valuemax="100">{{(storagePercentage / 100) | percent}}</div>
<div class="progress-bar bg-success" role="progressbar" [ngStyle]="{width: storageProgressWidth + '%' }"
[attr.aria-valuenow]="storagePercentage" aria-valuemin="0" aria-valuemax="100">
{{(storagePercentage / 100) | percent}}</div>
</div>
<ng-container *ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
<div class="mt-3">
@ -95,8 +102,8 @@
{{'removeStorage' | i18n}}
</button>
</div>
<app-adjust-storage [storageGbPrice]="4" [add]="adjustStorageAdd" (onAdjusted)="closeStorage(true)" (onCanceled)="closeStorage(false)"
*ngIf="showAdjustStorage"></app-adjust-storage>
<app-adjust-storage [storageGbPrice]="4" [add]="adjustStorageAdd" (onAdjusted)="closeStorage(true)"
(onCanceled)="closeStorage(false)" *ngIf="showAdjustStorage"></app-adjust-storage>
</div>
</ng-container>
</ng-container>

4
src/app/settings/verify-email.component.html
View File

@ -4,8 +4,8 @@
</div>
<div class="card-body">
<p>{{'verifyEmailDesc' | i18n}}</p>
<button type="button" class="btn btn-block btn-outline-secondary btn-submit" #sendBtn [appApiAction]="actionPromise" [disabled]="sendBtn.loading"
(click)="send()">
<button type="button" class="btn btn-block btn-outline-secondary btn-submit" #sendBtn
[appApiAction]="actionPromise" [disabled]="sendBtn.loading" (click)="send()">
<i class="fa fa-spin fa-spinner" title="{{'loading' | i18n}}"></i>
<span>
{{'sendEmail' | i18n}}

4
src/app/tools/export.component.html
View File

@ -16,8 +16,8 @@
<div class="row">
<div class="form-group col-6">
<label for="masterPassword">{{'masterPass' | i18n}}</label>
<input id="masterPassword" type="password" name="MasterPassword" class="form-control" [(ngModel)]="masterPassword" required
appInputVerbatim>
<input id="masterPassword" type="password" name="MasterPassword" class="form-control"
[(ngModel)]="masterPassword" required appInputVerbatim>
</div>
</div>
<button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">

3
src/app/tools/exposed-passwords-report.component.html
View File

@ -22,7 +22,8 @@
</td>
<td class="reduced-lh wrap">
<a href="#" appStopClick (click)="selectCipher(c)" title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId" title="{{'shared' | i18n}}"></i>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId"
title="{{'shared' | i18n}}"></i>
<i class="fa fa-paperclip" title="{{'attachments' | i18n}}" *ngIf="c.hasAttachments"></i>
<br>
<small>{{c.subTitle}}</small>

121
src/app/tools/import.component.html
View File

@ -19,45 +19,56 @@
<app-callout type="info" title="{{getFormatInstructionTitle()}}" *ngIf="format">
<ng-container *ngIf="format === 'bitwardencsv' || format === 'bitwardenjson'">
See detailed instructions on our help site at
<a target="_blank" rel="noopener" href="https://help.bitwarden.com/article/export-your-data/">https://help.bitwarden.com/article/export-your-data/</a>
<a target="_blank" rel="noopener"
href="https://help.bitwarden.com/article/export-your-data/">https://help.bitwarden.com/article/export-your-data/</a>
</ng-container>
<ng-container *ngIf="format === 'lastpasscsv'">
See detailed instructions on our help site at
<a target="_blank" rel="noopener" href="https://help.bitwarden.com/article/import-from-lastpass/">https://help.bitwarden.com/article/import-from-lastpass/</a>
<a target="_blank" rel="noopener"
href="https://help.bitwarden.com/article/import-from-lastpass/">https://help.bitwarden.com/article/import-from-lastpass/</a>
</ng-container>
<ng-container *ngIf="format === 'keepassxcsv'">
Using the KeePassX desktop application, navigate to "Database" &rarr; "Export to CSV file" and save the CSV file.
Using the KeePassX desktop application, navigate to "Database" &rarr; "Export to CSV file" and save the CSV
file.
</ng-container>
<ng-container *ngIf="format === 'aviracsv'">
In the Avira web vault, go to "Settings" &rarr; "My Data" &rarr; "Export data" and save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'blurcsv'">
In the Blur web vault, click your username at the top and go to "Settings" &rarr; "Export Data", then click "Export CSV"
In the Blur web vault, click your username at the top and go to "Settings" &rarr; "Export Data", then click
"Export CSV"
for your "Accounts".
</ng-container>
<ng-container *ngIf="format === 'safeincloudxml'">
Using the SaveInCloud desktop application, navigate to "File" &rarr; "Export" &rarr; "As XML" and save the XML file.
Using the SaveInCloud desktop application, navigate to "File" &rarr; "Export" &rarr; "As XML" and save the
XML file.
</ng-container>
<ng-container *ngIf="format === 'padlockcsv'">
Using the Padlock desktop application, click the hamburger icon in the top left corner and navigate to "Settings" &rarr;
Using the Padlock desktop application, click the hamburger icon in the top left corner and navigate to
"Settings" &rarr;
"Export" button and save the file "As CSV".
</ng-container>
<ng-container *ngIf="format === 'keepass2xml'">
Using the KeePass 2 desktop application, navigate to "File" &rarr; "Export" and select the "KeePass XML (2.x)" option.
Using the KeePass 2 desktop application, navigate to "File" &rarr; "Export" and select the "KeePass XML
(2.x)" option.
</ng-container>
<ng-container *ngIf="format === 'upmcsv'">
Using the Universal Password Manager desktop application, navigate to "Database" &rarr; "Export" and save the CSV file.
Using the Universal Password Manager desktop application, navigate to "Database" &rarr; "Export" and save
the CSV file.
</ng-container>
<ng-container *ngIf="format === 'saferpasscsv'">
Using the SaferPass browser extension, click the hamburger icon in the top left corner and navigate to "Settings". Click
Using the SaferPass browser extension, click the hamburger icon in the top left corner and navigate to
"Settings". Click
the "Export accounts" button to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'meldiumcsv'">
Using the Meldium web vault, navigate to "Settings". Locate the "Export data" function and click "Show me my data" to save
Using the Meldium web vault, navigate to "Settings". Locate the "Export data" function and click "Show me my
data" to save
the CSV file.
</ng-container>
<ng-container *ngIf="format === 'keepercsv'">
Log into the Keeper web vault (keepersecurity.com/vault). Navigate to "Backup" (top right) and find the "Export to .csv File"
Log into the Keeper web vault (keepersecurity.com/vault). Navigate to "Backup" (top right) and find the
"Export to .csv File"
option. Click "Export Now" to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'chromecsv' || format === 'operacsv' || format === 'vivaldicsv'">
@ -65,23 +76,30 @@
The process is exactly the same as importing from Google Chrome.
</span>
See detailed instructions on our help site at
<a target="_blank" rel="noopener" href="https://help.bitwarden.com/article/import-from-chrome/">https://help.bitwarden.com/article/import-from-chrome/</a>
<a target="_blank" rel="noopener"
href="https://help.bitwarden.com/article/import-from-chrome/">https://help.bitwarden.com/article/import-from-chrome/</a>
</ng-container>
<ng-container *ngIf="format === 'firefoxcsv'">
Use the
<a target="_blank" rel="noopener" href="https://github.com/kspearrin/ff-password-exporter/blob/master/README.md#ff-password-exporter">FF Password Exporter</a> application to export your passwords to a CSV file.
<a target="_blank" rel="noopener"
href="https://github.com/kspearrin/ff-password-exporter/blob/master/README.md#ff-password-exporter">FF
Password Exporter</a> application to export your passwords to a CSV file.
</ng-container>
<ng-container *ngIf="format === '1password1pif' || format === '1passwordwincsv'">
See detailed instructions on our help site at
<a target="_blank" rel="noopener" href="https://help.bitwarden.com/article/import-from-1password/">https://help.bitwarden.com/article/import-from-1password/</a>.
<a target="_blank" rel="noopener"
href="https://help.bitwarden.com/article/import-from-1password/">https://help.bitwarden.com/article/import-from-1password/</a>.
</ng-container>
<ng-container *ngIf="format === 'passworddragonxml'">
Using the Password Dragon desktop application, navigate to "File" &rarr; "Export" &rarr; "To XML". In the dialog that pops
Using the Password Dragon desktop application, navigate to "File" &rarr; "Export" &rarr; "To XML". In the
dialog that pops
up select "All Rows" and check all fields. Click the "Export" button and save the XML file.
</ng-container>
<ng-container *ngIf="format === 'enpasscsv'">
Using the Enpass desktop application, navigate to "File" &rarr; "Export" &rarr; "As CSV". Select "OK" to the warning alert
and save the CSV file. Note that the importer only supports files exported while Enpass is set to the English
Using the Enpass desktop application, navigate to "File" &rarr; "Export" &rarr; "As CSV". Select "OK" to the
warning alert
and save the CSV file. Note that the importer only supports files exported while Enpass is set to the
English
language, so adjust your settings accordingly.
</ng-container>
<ng-container *ngIf="format === 'enpassjson'">
@ -89,85 +107,107 @@
Select the ".json" file format option and save the JSON file.
</ng-container>
<ng-container *ngIf="format === 'pwsafexml'">
Using the Password Safe desktop application, navigate to "File" &rarr; "Export To" &rarr; "XML format..." and save the XML
Using the Password Safe desktop application, navigate to "File" &rarr; "Export To" &rarr; "XML format..."
and save the XML
file.
</ng-container>
<ng-container *ngIf="format === 'dashlanejson'">
Using the Dashlane desktop application, navigate to "File" &rarr; "Export" &rarr; "Unsecured archive (readable) in JSON format"
Using the Dashlane desktop application, navigate to "File" &rarr; "Export" &rarr; "Unsecured archive
(readable) in JSON format"
and save the JSON file.
</ng-container>
<ng-container *ngIf="format === 'msecurecsv'">
Using the mSecure desktop application, navigate to "File" &rarr; "Export" &rarr; "CSV File..." and save the CSV file.
Using the mSecure desktop application, navigate to "File" &rarr; "Export" &rarr; "CSV File..." and save the
CSV file.
</ng-container>
<ng-container *ngIf="format === 'stickypasswordxml'">
Using the Sticky Password desktop application, navigate to "Menu" (top right) &rarr; "Export" &rarr; "Export all". Select
Using the Sticky Password desktop application, navigate to "Menu" (top right) &rarr; "Export" &rarr; "Export
all". Select
the unencrypted format XML option and save the XML file.
</ng-container>
<ng-container *ngIf="format === 'truekeycsv'">
Using the True Key desktop application, click the gear icon (top right) and then navigate to "App Settings". Click the "Export"
Using the True Key desktop application, click the gear icon (top right) and then navigate to "App Settings".
Click the "Export"
button, enter your password and save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'clipperzhtml'">
Log into the Clipperz web application (clipperz.is/app). Click the hamburger menu icon in the top right to expand the navigation
Log into the Clipperz web application (clipperz.is/app). Click the hamburger menu icon in the top right to
expand the navigation
bar. Navigate to "Data" &rarr; "Export". Click the "download HTML+JSON" button to save the HTML file.
</ng-container>
<ng-container *ngIf="format === 'roboformcsv'">
Using the RoboForm Editor desktop application, navigate to "RoboForm" (top left) &rarr; "Options" &rarr; "Account &amp; Data"
Using the RoboForm Editor desktop application, navigate to "RoboForm" (top left) &rarr; "Options" &rarr;
"Account &amp; Data"
and click the "Export" button. Select all of your data, change the "Format" to "CSV file" and then click the
"Export" button to save the CSV file. Note: RoboForm only allows you to export Logins. Other items will not be
"Export" button to save the CSV file. Note: RoboForm only allows you to export Logins. Other items will not
be
exported.
</ng-container>
<ng-container *ngIf="format === 'passboltcsv'">
Log into the Passbolt web vault and navigate to the "Passwords" listing. Select all of the passwords you would like to export
Log into the Passbolt web vault and navigate to the "Passwords" listing. Select all of the passwords you
would like to export
and click the "Export" button at the top of the listing. Choose the "csv (lastpass)" export format and click
the "Export" button.
</ng-container>
<ng-container *ngIf="format === 'ascendocsv'">
Using the Ascendo DataVault desktop application, navigate to "Tools" &rarr; "Export". In the dialog that pops up, select
Using the Ascendo DataVault desktop application, navigate to "Tools" &rarr; "Export". In the dialog that
pops up, select
the "All Items (DVX, CSV)" option. Click the "Ok" button to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'passwordbossjson'">
Using the Password Boss desktop application, navigate to "File" &rarr; "Export data" &rarr; "Password Boss JSON - not encrypted"
Using the Password Boss desktop application, navigate to "File" &rarr; "Export data" &rarr; "Password Boss
JSON - not encrypted"
and save the JSON file.
</ng-container>
<ng-container *ngIf="format === 'zohovaultcsv'">
Log into the Zoho web vault (vault.zoho.com). Navigate to "Tools" &rarr; "Export Secrets". Select "All Secrets" and click
the "Zoho Vault Format CSV" button. Highlight and copy the data from the textarea. Open a text editor like Notepad
Log into the Zoho web vault (vault.zoho.com). Navigate to "Tools" &rarr; "Export Secrets". Select "All
Secrets" and click
the "Zoho Vault Format CSV" button. Highlight and copy the data from the textarea. Open a text editor like
Notepad
and paste the data. Save the data from the text editor as
<code>zoho_export.csv</code>.
</ng-container>
<ng-container *ngIf="format === 'splashidcsv'">
Using the SplashID Safe desktop application, click on the SplashID blue lock logo in the top right corner. Navigate to "Export"
Using the SplashID Safe desktop application, click on the SplashID blue lock logo in the top right corner.
Navigate to "Export"
&rarr; "Export as CSV" and save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'passkeepcsv'">
Using the PassKeep mobile app, navigate to "Backup/Restore". Locate the "CSV Backup/Restore" section and click "Backup to
Using the PassKeep mobile app, navigate to "Backup/Restore". Locate the "CSV Backup/Restore" section and
click "Backup to
CSV" to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'gnomejson'">
Make sure you have python-keyring and python-gnomekeyring installed. Save the
<a target="_blank" rel="noopener" href="https://bit.ly/2GpOMTg">GNOME Keyring Import/Export</a> python script to your desktop as
<a target="_blank" rel="noopener" href="https://bit.ly/2GpOMTg">GNOME Keyring Import/Export</a> python
script to your desktop as
<code>pw_helper.py</code>. Open terminal and run
<code>chmod +rx Desktop/pw_helper.py</code> and then
<code>python Desktop/pw_helper.py export Desktop/my_passwords.json</code>. Then upload the resulting
<code>my_passwords.json</code> file here to Bitwarden.
</ng-container>
<ng-container *ngIf="format === 'passwordagentcsv'">
Using the Password Agent desktop application navigate to "File" &rarr; "Export", select the "Fields to export" button and
check all of the fields, change the "Output format" to "CSV", and then click the "Start" button to save the CSV
Using the Password Agent desktop application navigate to "File" &rarr; "Export", select the "Fields to
export" button and
check all of the fields, change the "Output format" to "CSV", and then click the "Start" button to save the
CSV
file.
</ng-container>
<ng-container *ngIf="format === 'passpackcsv'">
Log into the Passpack website vault and navigate to "Settings" &rarr; "Export", then click the "Download" button to save
Log into the Passpack website vault and navigate to "Settings" &rarr; "Export", then click the "Download"
button to save
the CSV file.
</ng-container>
<ng-container *ngIf="format === 'passmanjson'">
Open your Passman vault and click on "Settings" in the bottom left corner. In the "Settings" window switch to the
"Export credentials" tab and choose "JSON" as the export type. Enter your vault's passphrase and click the "Export"
Open your Passman vault and click on "Settings" in the bottom left corner. In the "Settings" window switch
to the
"Export credentials" tab and choose "JSON" as the export type. Enter your vault's passphrase and click the
"Export"
button to save the JSON file.
</ng-container>
<ng-container *ngIf="format === 'avastcsv'">
Open the Avast Passwords desktop application and navigate to "Settings" &rarr; "Import/export data". Select the
Open the Avast Passwords desktop application and navigate to "Settings" &rarr; "Import/export data". Select
the
"Export" button for the "Export to CSV file" option to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'fsecurefsk'">
@ -175,7 +215,8 @@
"Export" button, enter your master password, and save the FSK file.
</ng-container>
<ng-container *ngIf="format === 'kasperskytxt'">
Open the Kaspersky Password Manager desktop application and navigate to "Settings" &rarr; "Import/Export". Locate
Open the Kaspersky Password Manager desktop application and navigate to "Settings" &rarr; "Import/Export".
Locate
the "Export to text file" section and select the "Export" button to save the TXT file.
</ng-container>
<ng-container *ngIf="format === 'remembearcsv'">

3
src/app/tools/inactive-two-factor-report.component.html
View File

@ -26,7 +26,8 @@
</td>
<td class="reduced-lh wrap">
<a href="#" appStopClick (click)="selectCipher(c)" title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId" title="{{'shared' | i18n}}"></i>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId"
title="{{'shared' | i18n}}"></i>
<i class="fa fa-paperclip" title="{{'attachments' | i18n}}" *ngIf="c.hasAttachments"></i>
<br>
<small>{{c.subTitle}}</small>

32
src/app/tools/password-generator.component.html
View File

@ -6,20 +6,21 @@
</div>
<div class="form-group">
<div class="form-check form-check-inline">
<input id="generate-password" name="type" value="password" class="form-check-input" type="radio" (change)="saveOptions()"
[(ngModel)]="options.type">
<input id="generate-password" name="type" value="password" class="form-check-input" type="radio"
(change)="saveOptions()" [(ngModel)]="options.type">
<label for="generate-password" class="form-check-label">{{'password' | i18n}}</label>
</div>
<div class="form-check form-check-inline">
<input id="generate-passphrase" name="type" value="passphrase" class="form-check-input" type="radio" (change)="saveOptions()"
[(ngModel)]="options.type">
<input id="generate-passphrase" name="type" value="passphrase" class="form-check-input" type="radio"
(change)="saveOptions()" [(ngModel)]="options.type">
<label for="generate-passphrase" class="form-check-label">{{'passphrase' | i18n}}</label>
</div>
</div>
<div class="row" *ngIf="options.type === 'passphrase'">
<div class="form-group col-4">
<label for="num-words">{{'numWords' | i18n}}</label>
<input id="num-words" class="form-control" type="number" min="3" max="20" [(ngModel)]="options.numWords" (blur)="saveOptions()">
<input id="num-words" class="form-control" type="number" min="3" max="20" [(ngModel)]="options.numWords"
(blur)="saveOptions()">
</div>
<div class="form-group col-4">
<label for="word-separator">{{'wordSeparator' | i18n}}</label>
@ -31,7 +32,8 @@
<div class="row">
<div class="form-group col-4">
<label for="length">{{'length' | i18n}}</label>
<input id="length" class="form-control" type="number" min="5" max="128" [(ngModel)]="options.length" (blur)="saveOptions()">
<input id="length" class="form-control" type="number" min="5" max="128" [(ngModel)]="options.length"
(blur)="saveOptions()">
</div>
<div class="form-group col-4">
<label for="min-number">{{'minNumbers' | i18n}}</label>
@ -46,23 +48,28 @@
</div>
<div class="form-group">
<div class="form-check">
<input id="uppercase" class="form-check-input" type="checkbox" (change)="saveOptions()" [(ngModel)]="options.uppercase">
<input id="uppercase" class="form-check-input" type="checkbox" (change)="saveOptions()"
[(ngModel)]="options.uppercase">
<label for="uppercase" class="form-check-label">A-Z</label>
</div>
<div class="form-check">
<input id="lowercase" class="form-check-input" type="checkbox" (change)="saveOptions()" [(ngModel)]="options.lowercase">
<input id="lowercase" class="form-check-input" type="checkbox" (change)="saveOptions()"
[(ngModel)]="options.lowercase">
<label for="lowercase" class="form-check-label">a-z</label>
</div>
<div class="form-check">
<input id="numbers" class="form-check-input" type="checkbox" (change)="saveOptions()" [(ngModel)]="options.number">
<input id="numbers" class="form-check-input" type="checkbox" (change)="saveOptions()"
[(ngModel)]="options.number">
<label for="numbers" class="form-check-label">0-9</label>
</div>
<div class="form-check">
<input id="special" class="form-check-input" type="checkbox" (change)="saveOptions()" [(ngModel)]="options.special">
<input id="special" class="form-check-input" type="checkbox" (change)="saveOptions()"
[(ngModel)]="options.special">
<label for="special" class="form-check-label">!@#$%^&amp;*</label>
</div>
<div class="form-check">
<input id="ambiguous" class="form-check-input" type="checkbox" (change)="saveOptions()" [(ngModel)]="avoidAmbiguous">
<input id="ambiguous" class="form-check-input" type="checkbox" (change)="saveOptions()"
[(ngModel)]="avoidAmbiguous">
<label for="ambiguous" class="form-check-label">{{'ambiguous' | i18n}}</label>
</div>
</div>
@ -77,7 +84,8 @@
</button>
</div>
<div class="ml-auto">
<button type="button" class="btn btn-outline-secondary" (click)="history()" title="{{'passwordHistory' | i18n}}">
<button type="button" class="btn btn-outline-secondary" (click)="history()"
title="{{'passwordHistory' | i18n}}">
<i class="fa fa-clock-o fa-lg"></i>
</button>
</div>

3
src/app/tools/reused-passwords-report.component.html
View File

@ -26,7 +26,8 @@
</td>
<td class="reduced-lh wrap">
<a href="#" appStopClick (click)="selectCipher(c)" title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId" title="{{'shared' | i18n}}"></i>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId"
title="{{'shared' | i18n}}"></i>
<i class="fa fa-paperclip" title="{{'attachments' | i18n}}" *ngIf="c.hasAttachments"></i>
<br>
<small>{{c.subTitle}}</small>

3
src/app/tools/tools.component.html
View File

@ -19,7 +19,8 @@
<div class="card-header d-flex">
{{'reports' | i18n}}
<div class="ml-auto">
<a href="#" appStopClick class="badge badge-primary" *ngIf="!canAccessPremium" (click)="premiumRequired()">
<a href="#" appStopClick class="badge badge-primary" *ngIf="!canAccessPremium"
(click)="premiumRequired()">
{{'premium' | i18n}}
</a>
</div>

3
src/app/tools/unsecured-websites-report.component.html
View File

@ -26,7 +26,8 @@
</td>
<td class="reduced-lh wrap">
<a href="#" appStopClick (click)="selectCipher(c)" title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId" title="{{'shared' | i18n}}"></i>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId"
title="{{'shared' | i18n}}"></i>
<i class="fa fa-paperclip" title="{{'attachments' | i18n}}" *ngIf="c.hasAttachments"></i>
<br>
<small>{{c.subTitle}}</small>

3
src/app/tools/weak-passwords-report.component.html
View File

@ -26,7 +26,8 @@
</td>
<td class="reduced-lh wrap">
<a href="#" appStopClick (click)="selectCipher(c)" title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId" title="{{'shared' | i18n}}"></i>
<i class="fa fa-share-alt" *ngIf="!organization && c.organizationId"
title="{{'shared' | i18n}}"></i>
<i class="fa fa-paperclip" title="{{'attachments' | i18n}}" *ngIf="c.hasAttachments"></i>
<br>
<small>{{c.subTitle}}</small>

239
src/app/vault/add-edit.component.html
View File

@ -1,6 +1,7 @@
<div class="modal fade">
<div class="modal-dialog modal-lg">
<form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate autocomplete="off">
<form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate
autocomplete="off">
<div class="modal-header">
<h2 class="modal-title">{{title}}</h2>
<button type="button" class="close" data-dismiss="modal" attr.aria-label="{{'close' | i18n}}">
@ -19,7 +20,8 @@
<div class="row">
<div class="col-6 form-group">
<label for="name">{{'name' | i18n}}</label>
<input id="name" class="form-control" type="text" name="Name" [(ngModel)]="cipher.name" required>
<input id="name" class="form-control" type="text" name="Name" [(ngModel)]="cipher.name"
required>
</div>
<div class="col-6 form-group" *ngIf="!organization">
<label for="folder">{{'folder' | i18n}}</label>
@ -34,10 +36,12 @@
<div class="col-6 form-group">
<label for="loginUsername">{{'username' | i18n}}</label>
<div class="input-group">
<input id="loginUsername" class="form-control" type="text" name="Login.Username" [(ngModel)]="cipher.login.username" appInputVerbatim>
<input id="loginUsername" class="form-control" type="text" name="Login.Username"
[(ngModel)]="cipher.login.username" appInputVerbatim>
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'copyUsername' | i18n}}" (click)="copy(cipher.login.username, 'username', 'Username')"
tabindex="-1">
<button type="button" class="btn btn-outline-secondary"
title="{{'copyUsername' | i18n}}"
(click)="copy(cipher.login.username, 'username', 'Username')" tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
</div>
@ -47,25 +51,33 @@
<div class="d-flex">
<label for="loginPassword">{{'password' | i18n}}</label>
<div class="ml-auto d-flex">
<a href="#" class="d-block mr-2" appStopClick title="{{'generatePassword' | i18n}}" (click)="generatePassword()">
<a href="#" class="d-block mr-2" appStopClick title="{{'generatePassword' | i18n}}"
(click)="generatePassword()">
<i class="fa fa-lg fa-fw fa-refresh"></i>
</a>
<a href="#" class="d-block" #checkPasswordBtn appStopClick title="{{'checkPassword' | i18n}}" (click)="checkPassword()" [appApiAction]="checkPasswordPromise">
<i class="fa fa-lg fa-fw fa-check-circle" [hidden]="checkPasswordBtn.loading"></i>
<i class="fa fa-lg fa-fw fa-spinner fa-spin" [hidden]="!checkPasswordBtn.loading" title="{{'loading' | i18n}}"></i>
<a href="#" class="d-block" #checkPasswordBtn appStopClick
title="{{'checkPassword' | i18n}}" (click)="checkPassword()"
[appApiAction]="checkPasswordPromise">
<i class="fa fa-lg fa-fw fa-check-circle"
[hidden]="checkPasswordBtn.loading"></i>
<i class="fa fa-lg fa-fw fa-spinner fa-spin"
[hidden]="!checkPasswordBtn.loading" title="{{'loading' | i18n}}"></i>
</a>
</div>
</div>
<div class="input-group">
<input id="loginPassword" class="form-control text-monospace" type="{{showPassword ? 'text' : 'password'}}" name="Login.Password"
<input id="loginPassword" class="form-control text-monospace"
type="{{showPassword ? 'text' : 'password'}}" name="Login.Password"
[(ngModel)]="cipher.login.password" appInputVerbatim autocomplete="new-password">
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()"
tabindex="-1">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
<button type="button" class="btn btn-outline-secondary"
title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()" tabindex="-1">
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
</button>
<button type="button" class="btn btn-outline-secondary" title="{{'copyPassword' | i18n}}" (click)="copy(cipher.login.password, 'password', 'Password')"
tabindex="-1">
<button type="button" class="btn btn-outline-secondary"
title="{{'copyPassword' | i18n}}"
(click)="copy(cipher.login.password, 'password', 'Password')" tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
</div>
@ -75,15 +87,20 @@
<div class="row">
<div class="col-6 form-group">
<label for="loginTotp">{{'authenticatorKeyTotp' | i18n}}</label>
<input id="loginTotp" type="text" name="Login.Totp" class="form-control text-monospace" [(ngModel)]="cipher.login.totp" appInputVerbatim>
<input id="loginTotp" type="text" name="Login.Totp" class="form-control text-monospace"
[(ngModel)]="cipher.login.totp" appInputVerbatim>
</div>
<div class="col-6 form-group totp d-flex align-items-end" [ngClass]="{'low': totpLow}">
<div *ngIf="!cipher.login.totp || !totpCode">
<img src="../../images/totp-countdown.png" title="{{'verificationCodeTotp' | i18n}}" class="ml-2">
<a href="#" appStopClick class="badge badge-primary ml-3" (click)="premiumRequired()" *ngIf="!organization && !cipher.organizationId && !canAccessPremium">
<img src="../../images/totp-countdown.png" title="{{'verificationCodeTotp' | i18n}}"
class="ml-2">
<a href="#" appStopClick class="badge badge-primary ml-3" (click)="premiumRequired()"
*ngIf="!organization && !cipher.organizationId && !canAccessPremium">
{{'premium' | i18n}}
</a>
<a href="#" appStopClick class="badge badge-primary ml-3" (click)="upgradeOrganization()" *ngIf="(organization && !organization.useTotp) || (!organization && !canAccessPremium && cipher.organizationId && !cipher.organizationUseTotp)">
<a href="#" appStopClick class="badge badge-primary ml-3"
(click)="upgradeOrganization()"
*ngIf="(organization && !organization.useTotp) || (!organization && !canAccessPremium && cipher.organizationId && !cipher.organizationUseTotp)">
{{'upgrade' | i18n}}
</a>
</div>
@ -92,31 +109,38 @@
<span class="totp-sec">{{totpSec}}</span>
<svg>
<g>
<circle class="totp-circle inner" r="12.6" cy="16" cx="16" [ngStyle]="{'stroke-dashoffset.px': totpDash}"></circle>
<circle class="totp-circle inner" r="12.6" cy="16" cx="16"
[ngStyle]="{'stroke-dashoffset.px': totpDash}"></circle>
<circle class="totp-circle outer" r="14" cy="16" cx="16"></circle>
</g>
</svg>
</span>
<span class="totp-code mr-2" title="{{'verificationCodeTotp' | i18n}}">{{totpCodeFormatted}}</span>
<button type="button" class="btn btn-link" title="{{'copyVerificationCode' | i18n}}" (click)="copy(totpCode, 'verificationCodeTotp', 'TOTP')">
<span class="totp-code mr-2"
title="{{'verificationCodeTotp' | i18n}}">{{totpCodeFormatted}}</span>
<button type="button" class="btn btn-link" title="{{'copyVerificationCode' | i18n}}"
(click)="copy(totpCode, 'verificationCodeTotp', 'TOTP')">
<i class="fa fa-clipboard"></i>
</button>
</div>
</div>
</div>
<ng-container *ngIf="cipher.login.hasUris">
<div class="row" appBoxRow *ngFor="let u of cipher.login.uris; let i = index; trackBy:trackByFunction">
<div class="row" appBoxRow
*ngFor="let u of cipher.login.uris; let i = index; trackBy:trackByFunction">
<div class="col-7 form-group">
<label for="loginUri{{i}}">{{'uriPosition' | i18n : (i + 1)}}</label>
<div class="input-group">
<input class="form-control" id="loginUri{{i}}" type="text" name="Login.Uris[{{i}}].Uri" [(ngModel)]="u.uri" placeholder="{{'ex' | i18n}} https://google.com"
appInputVerbatim>
<input class="form-control" id="loginUri{{i}}" type="text"
name="Login.Uris[{{i}}].Uri" [(ngModel)]="u.uri"
placeholder="{{'ex' | i18n}} https://google.com" appInputVerbatim>
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'launch' | i18n}}" (click)="launch(u)" [disabled]="!u.canLaunch"
<button type="button" class="btn btn-outline-secondary"
title="{{'launch' | i18n}}" (click)="launch(u)" [disabled]="!u.canLaunch"
tabindex="-1">
<i class="fa fa-lg fa-share"></i>
</button>
<button type="button" class="btn btn-outline-secondary" title="{{'copyUri' | i18n}}" (click)="copy(u.uri, 'uri', 'URI')"
<button type="button" class="btn btn-outline-secondary"
title="{{'copyUri' | i18n}}" (click)="copy(u.uri, 'uri', 'URI')"
tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
@ -128,15 +152,19 @@
<label for="loginUriMatch{{i}}">
{{'matchDetection' | i18n}}
</label>
<a class="ml-auto" href="https://help.bitwarden.com/article/uri-match-detection/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://help.bitwarden.com/article/uri-match-detection/"
target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</div>
<div class="d-flex">
<select class="form-control" id="loginUriMatch{{i}}" name="Login.Uris[{{i}}].Match" [(ngModel)]="u.match" (change)="loginUriMatchChanged(u)">
<option *ngFor="let o of uriMatchOptions" [ngValue]="o.value">{{o.name}}</option>
<select class="form-control" id="loginUriMatch{{i}}" name="Login.Uris[{{i}}].Match"
[(ngModel)]="u.match" (change)="loginUriMatchChanged(u)">
<option *ngFor="let o of uriMatchOptions" [ngValue]="o.value">{{o.name}}
</option>
</select>
<button type="button" class="btn btn-link text-danger ml-2" (click)="removeUri(u)" title="{{'remove' | i18n}}">
<button type="button" class="btn btn-link text-danger ml-2" (click)="removeUri(u)"
title="{{'remove' | i18n}}">
<i class="fa fa-minus-circle fa-lg"></i>
</button>
</div>
@ -152,11 +180,13 @@
<div class="row">
<div class="col-6 form-group">
<label for="cardCardholderName">{{'cardholderName' | i18n}}</label>
<input id="cardCardholderName" class="form-control" type="text" name="Card.CardCardholderName" [(ngModel)]="cipher.card.cardholderName">
<input id="cardCardholderName" class="form-control" type="text"
name="Card.CardCardholderName" [(ngModel)]="cipher.card.cardholderName">
</div>
<div class="col-6 form-group">
<label for="cardBrand">{{'brand' | i18n}}</label>
<select id="cardBrand" class="form-control" name="Card.Brand" [(ngModel)]="cipher.card.brand">
<select id="cardBrand" class="form-control" name="Card.Brand"
[(ngModel)]="cipher.card.brand">
<option *ngFor="let o of cardBrandOptions" [ngValue]="o.value">{{o.name}}</option>
</select>
</div>
@ -165,10 +195,12 @@
<div class="col-6 form-group">
<label for="cardNumber">{{'number' | i18n}}</label>
<div class="input-group">
<input id="cardNumber" class="form-control" type="text" name="Card.Number" [(ngModel)]="cipher.card.number" appInputVerbatim>
<input id="cardNumber" class="form-control" type="text" name="Card.Number"
[(ngModel)]="cipher.card.number" appInputVerbatim>
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'copyNumber' | i18n}}" (click)="copy(cipher.card.number, 'number', 'Number')"
tabindex="-1">
<button type="button" class="btn btn-outline-secondary"
title="{{'copyNumber' | i18n}}"
(click)="copy(cipher.card.number, 'number', 'Number')" tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
</div>
@ -176,28 +208,33 @@
</div>
<div class="col form-group">
<label for="cardExpMonth">{{'expirationMonth' | i18n}}</label>
<select id="cardExpMonth" class="form-control" name="Card.ExpMonth" [(ngModel)]="cipher.card.expMonth">
<select id="cardExpMonth" class="form-control" name="Card.ExpMonth"
[(ngModel)]="cipher.card.expMonth">
<option *ngFor="let o of cardExpMonthOptions" [ngValue]="o.value">{{o.name}}</option>
</select>
</div>
<div class="col form-group">
<label for="cardExpYear">{{'expirationYear' | i18n}}</label>
<input id="cardExpYear" class="form-control" type="text" name="Card.ExpYear" [(ngModel)]="cipher.card.expYear" placeholder="{{'ex' | i18n}} 2019">
<input id="cardExpYear" class="form-control" type="text" name="Card.ExpYear"
[(ngModel)]="cipher.card.expYear" placeholder="{{'ex' | i18n}} 2019">
</div>
</div>
<div class="row">
<div class="col-6 form-group">
<label for="cardCode">{{'securityCode' | i18n}}</label>
<div class="input-group">
<input id="cardCode" class="form-control text-monospace" type="{{showCardCode ? 'text' : 'password'}}" name="Card.Code" [(ngModel)]="cipher.card.code"
appInputVerbatim autocomplete="new-password">
<input id="cardCode" class="form-control text-monospace"
type="{{showCardCode ? 'text' : 'password'}}" name="Card.Code"
[(ngModel)]="cipher.card.code" appInputVerbatim autocomplete="new-password">
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'toggleVisibility' | i18n}}" (click)="toggleCardCode()"
tabindex="-1">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !showCardCode, 'fa-eye-slash': showCardCode}"></i>
<button type="button" class="btn btn-outline-secondary"
title="{{'toggleVisibility' | i18n}}" (click)="toggleCardCode()" tabindex="-1">
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !showCardCode, 'fa-eye-slash': showCardCode}"></i>
</button>
<button type="button" class="btn btn-outline-secondary" title="{{'securityCode' | i18n}}" (click)="copy(cipher.card.code, 'securityCode', 'Security Code')"
tabindex="-1">
<button type="button" class="btn btn-outline-secondary"
title="{{'securityCode' | i18n}}"
(click)="copy(cipher.card.code, 'securityCode', 'Security Code')" tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
</div>
@ -210,7 +247,8 @@
<div class="row">
<div class="col-4 form-group">
<label for="idTitle">{{'title' | i18n}}</label>
<select id="idTitle" class="form-control" name="Identity.Title" [(ngModel)]="cipher.identity.title">
<select id="idTitle" class="form-control" name="Identity.Title"
[(ngModel)]="cipher.identity.title">
<option *ngFor="let o of identityTitleOptions" [ngValue]="o.value">{{o.name}}</option>
</select>
</div>
@ -218,93 +256,109 @@
<div class="row">
<div class="col-4 form-group">
<label for="idFirstName">{{'firstName' | i18n}}</label>
<input id="idFirstName" class="form-control" type="text" name="Identity.FirstName" [(ngModel)]="cipher.identity.firstName">
<input id="idFirstName" class="form-control" type="text" name="Identity.FirstName"
[(ngModel)]="cipher.identity.firstName">
</div>
<div class="col-4 form-group">
<label for="idMiddleName">{{'middleName' | i18n}}</label>
<input id="idMiddleName" class="form-control" type="text" name="Identity.MiddleName" [(ngModel)]="cipher.identity.middleName">
<input id="idMiddleName" class="form-control" type="text" name="Identity.MiddleName"
[(ngModel)]="cipher.identity.middleName">
</div>
<div class="col-4 form-group">
<label for="idLastName">{{'lastName' | i18n}}</label>
<input id="idLastName" class="form-control" type="text" name="Identity.LastName" [(ngModel)]="cipher.identity.lastName">
<input id="idLastName" class="form-control" type="text" name="Identity.LastName"
[(ngModel)]="cipher.identity.lastName">
</div>
</div>
<div class="row">
<div class="col-4 form-group">
<label for="idUsername">{{'username' | i18n}}</label>
<input id="idUsername" class="form-control" type="text" name="Identity.Username" [(ngModel)]="cipher.identity.username" appInputVerbatim>
<input id="idUsername" class="form-control" type="text" name="Identity.Username"
[(ngModel)]="cipher.identity.username" appInputVerbatim>
</div>
<div class="col-4 form-group">
<label for="idCompany">{{'company' | i18n}}</label>
<input id="idCompany" class="form-control" type="text" name="Identity.Company" [(ngModel)]="cipher.identity.company">
<input id="idCompany" class="form-control" type="text" name="Identity.Company"
[(ngModel)]="cipher.identity.company">
</div>
</div>
<div class="row">
<div class="col-4 form-group">
<label for="idSsn">{{'ssn' | i18n}}</label>
<input id="idSsn" class="form-control" type="text" name="Identity.SSN" [(ngModel)]="cipher.identity.ssn" appInputVerbatim>
<input id="idSsn" class="form-control" type="text" name="Identity.SSN"
[(ngModel)]="cipher.identity.ssn" appInputVerbatim>
</div>
<div class="col-4 form-group">
<label for="idPassportNumber">{{'passportNumber' | i18n}}</label>
<input id="idPassportNumber" class="form-control" type="text" name="Identity.PassportNumber" [(ngModel)]="cipher.identity.passportNumber"
appInputVerbatim>
<input id="idPassportNumber" class="form-control" type="text" name="Identity.PassportNumber"
[(ngModel)]="cipher.identity.passportNumber" appInputVerbatim>
</div>
<div class="col-4 form-group">
<label for="idLicenseNumber">{{'licenseNumber' | i18n}}</label>
<input id="idLicenseNumber" class="form-control" type="text" name="Identity.LicenseNumber" [(ngModel)]="cipher.identity.licenseNumber"
appInputVerbatim>
<input id="idLicenseNumber" class="form-control" type="text" name="Identity.LicenseNumber"
[(ngModel)]="cipher.identity.licenseNumber" appInputVerbatim>
</div>
</div>
<div class="row">
<div class="col-6 form-group">
<label for="idEmail">{{'email' | i18n}}</label>
<input id="idEmail" class="form-control" type="text" name="Identity.Email" [(ngModel)]="cipher.identity.email" appInputVerbatim>
<input id="idEmail" class="form-control" type="text" name="Identity.Email"
[(ngModel)]="cipher.identity.email" appInputVerbatim>
</div>
<div class="col-6 form-group">
<label for="idPhone">{{'phone' | i18n}}</label>
<input id="idPhone" class="form-control" type="text" name="Identity.Phone" [(ngModel)]="cipher.identity.phone">
<input id="idPhone" class="form-control" type="text" name="Identity.Phone"
[(ngModel)]="cipher.identity.phone">
</div>
</div>
<div class="row">
<div class="col-6 form-group">
<label for="idAddress1">{{'address1' | i18n}}</label>
<input id="idAddress1" class="form-control" type="text" name="Identity.Address1" [(ngModel)]="cipher.identity.address1">
<input id="idAddress1" class="form-control" type="text" name="Identity.Address1"
[(ngModel)]="cipher.identity.address1">
</div>
<div class="col-6 form-group">
<label for="idAddress2">{{'address2' | i18n}}</label>
<input id="idAddress2" class="form-control" type="text" name="Identity.Address2" [(ngModel)]="cipher.identity.address2">
<input id="idAddress2" class="form-control" type="text" name="Identity.Address2"
[(ngModel)]="cipher.identity.address2">
</div>
</div>
<div class="row">
<div class="col-6 form-group">
<label for="idAddress3">{{'address3' | i18n}}</label>
<input id="idAddress3" class="form-control" type="text" name="Identity.Address3" [(ngModel)]="cipher.identity.address3">
<input id="idAddress3" class="form-control" type="text" name="Identity.Address3"
[(ngModel)]="cipher.identity.address3">
</div>
<div class="col-6 form-group">
<label for="idCity">{{'cityTown' | i18n}}</label>
<input id="idCity" class="form-control" type="text" name="Identity.City" [(ngModel)]="cipher.identity.city">
<input id="idCity" class="form-control" type="text" name="Identity.City"
[(ngModel)]="cipher.identity.city">
</div>
</div>
<div class="row">
<div class="col-6 form-group">
<label for="idState">{{'stateProvince' | i18n}}</label>
<input id="idState" class="form-control" type="text" name="Identity.State" [(ngModel)]="cipher.identity.state">
<input id="idState" class="form-control" type="text" name="Identity.State"
[(ngModel)]="cipher.identity.state">
</div>
<div class="col-6 form-group">
<label for="idPostalCode">{{'zipPostalCode' | i18n}}</label>
<input id="idPostalCode" class="form-control" type="text" name="Identity.PostalCode" [(ngModel)]="cipher.identity.postalCode">
<input id="idPostalCode" class="form-control" type="text" name="Identity.PostalCode"
[(ngModel)]="cipher.identity.postalCode">
</div>
</div>
<div class="row">
<div class="col-6 form-group">
<label for="idCountry">{{'country' | i18n}}</label>
<input id="idCountry" class="form-control" type="text" name="Identity.Country" [(ngModel)]="cipher.identity.country">
<input id="idCountry" class="form-control" type="text" name="Identity.Country"
[(ngModel)]="cipher.identity.country">
</div>
</div>
</ng-container>
<div class="form-group">
<label for="notes">{{'notes' | i18n}}</label>
<textarea id="notes" name="Notes" rows="6" [(ngModel)]="cipher.notes" class="form-control"></textarea>
<textarea id="notes" name="Notes" rows="6" [(ngModel)]="cipher.notes"
class="form-control"></textarea>
</div>
<h3 class="mt-4">{{'customFields' | i18n}}</h3>
<ng-container *ngIf="cipher.hasFields">
@ -312,43 +366,54 @@
<div class="col-5 form-group">
<div class="d-flex">
<label for="fieldName{{i}}">{{'name' | i18n}}</label>
<a class="ml-auto" href="https://help.bitwarden.com/article/custom-fields/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://help.bitwarden.com/article/custom-fields/"
target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</div>
<input id="fieldName{{i}}" type="text" name="Field.Name{{i}}" [(ngModel)]="f.name" class="form-control" appInputVerbatim>
<input id="fieldName{{i}}" type="text" name="Field.Name{{i}}" [(ngModel)]="f.name"
class="form-control" appInputVerbatim>
</div>
<div class="col-7 form-group">
<label for="fieldValue{{i}}">{{'value' | i18n}}</label>
<div class="d-flex align-items-center">
<div class="input-group" *ngIf="f.type === fieldType.Text">
<input id="fieldValue{{i}}" class="form-control" type="text" name="Field.Value{{i}}" [(ngModel)]="f.value" appInputVerbatim>
<input id="fieldValue{{i}}" class="form-control" type="text" name="Field.Value{{i}}"
[(ngModel)]="f.value" appInputVerbatim>
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'copyValue' | i18n}}" (click)="copy(f.value, 'value', 'Field')"
<button type="button" class="btn btn-outline-secondary"
title="{{'copyValue' | i18n}}" (click)="copy(f.value, 'value', 'Field')"
tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
</div>
</div>
<div class="input-group" *ngIf="f.type === fieldType.Hidden">
<input id="fieldValue{{i}}" type="{{f.showValue ? 'text' : 'password'}}" name="Field.Value{{i}}" [(ngModel)]="f.value" class="form-control text-monospace"
appInputVerbatim autocomplete="new-password">
<input id="fieldValue{{i}}" type="{{f.showValue ? 'text' : 'password'}}"
name="Field.Value{{i}}" [(ngModel)]="f.value"
class="form-control text-monospace" appInputVerbatim
autocomplete="new-password">
<div class="input-group-append">
<button type="button" class="btn btn-outline-secondary" title="{{'toggleVisibility' | i18n}}" (click)="toggleFieldValue(f)"
<button type="button" class="btn btn-outline-secondary"
title="{{'toggleVisibility' | i18n}}" (click)="toggleFieldValue(f)"
tabindex="-1">
<i class="fa fa-lg" [ngClass]="{'fa-eye': !f.showValue, 'fa-eye-slash': f.showValue}"></i>
<i class="fa fa-lg"
[ngClass]="{'fa-eye': !f.showValue, 'fa-eye-slash': f.showValue}"></i>
</button>
<button type="button" class="btn btn-outline-secondary" title="{{'copyValue' | i18n}}" (click)="copy(f.value, 'value', 'Field')"
<button type="button" class="btn btn-outline-secondary"
title="{{'copyValue' | i18n}}" (click)="copy(f.value, 'value', 'Field')"
tabindex="-1">
<i class="fa fa-lg fa-clipboard"></i>
</button>
</div>
</div>
<div class="flex-fill">
<input id="fieldValue{{i}}" name="Field.Value{{i}}" type="checkbox" [(ngModel)]="f.value" *ngIf="f.type === fieldType.Boolean"
appTrueFalseValue trueValue="true" falseValue="false">
<input id="fieldValue{{i}}" name="Field.Value{{i}}" type="checkbox"
[(ngModel)]="f.value" *ngIf="f.type === fieldType.Boolean" appTrueFalseValue
trueValue="true" falseValue="false">
</div>
<button type="button" class="btn btn-link text-danger ml-2" (click)="removeField(f)" title="{{'remove' | i18n}}">
<button type="button" class="btn btn-link text-danger ml-2" (click)="removeField(f)"
title="{{'remove' | i18n}}">
<i class="fa fa-minus-circle fa-lg"></i>
</button>
</div>
@ -371,8 +436,8 @@
<div class="row">
<div class="col-5">
<label for="organizationId">{{'whoOwnsThisItem' | i18n}}</label>
<select id="organizationId" class="form-control" name="OrganizationId" [(ngModel)]="cipher.organizationId"
(change)="organizationChanged()">
<select id="organizationId" class="form-control" name="OrganizationId"
[(ngModel)]="cipher.organizationId" (change)="organizationChanged()">
<option *ngFor="let o of ownershipOptions" [ngValue]="o.value">{{o.name}}</option>
</select>
</div>
@ -385,7 +450,8 @@
</div>
<ng-container *ngIf="collections && collections.length">
<div class="form-check" *ngFor="let c of collections; let i = index">
<input class="form-check-input" type="checkbox" [(ngModel)]="c.checked" id="collection-{{i}}" name="Collection[{{i}}].Checked">
<input class="form-check-input" type="checkbox" [(ngModel)]="c.checked"
id="collection-{{i}}" name="Collection[{{i}}].Checked">
<label class="form-check-label" for="collection-{{i}}">{{c.name}}</label>
</div>
</ng-container>
@ -424,13 +490,16 @@
{{'cancel' | i18n}}
</button>
<div class="ml-auto" *ngIf="cipher">
<button *ngIf="!organization" type="button" (click)="toggleFavorite()" class="btn btn-link" title="{{(cipher.favorite ? 'unfavorite' : 'favorite') | i18n}}">
<button *ngIf="!organization" type="button" (click)="toggleFavorite()" class="btn btn-link"
title="{{(cipher.favorite ? 'unfavorite' : 'favorite') | i18n}}">
<i class="fa fa-lg" [ngClass]="{'fa-star': cipher.favorite, 'fa-star-o': !cipher.favorite}"></i>
</button>
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger" title="{{'delete' | i18n}}" *ngIf="editMode"
[disabled]="deleteBtn.loading" [appApiAction]="deletePromise">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger"
title="{{'delete' | i18n}}" *ngIf="editMode" [disabled]="deleteBtn.loading"
[appApiAction]="deletePromise">
<i class="fa fa-trash-o fa-lg fa-fw" [hidden]="deleteBtn.loading"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading" title="{{'loading' | i18n}}"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading"
title="{{'loading' | i18n}}"></i>
</button>
</div>
</div>

11
src/app/vault/attachments.component.html
View File

@ -24,7 +24,8 @@
<div *ngIf="showFixOldAttachments(a)" class="ml-2">
<a href="https://help.bitwarden.com/article/attachments/#fixing-old-attachments"
target="_blank" rel="noopener">
<i class="fa fa-exclamation-triangle text-warning" title="{{'attachmentFixDesc' | i18n}}"></i></a>
<i class="fa fa-exclamation-triangle text-warning"
title="{{'attachmentFixDesc' | i18n}}"></i></a>
<button type="button" class="btn btn-outline-primary btn-sm m-0 py-0 px-2"
(click)="reupload(a)" #reuploadBtn [appApiAction]="reuploadPromises[a.id]"
[disabled]="reuploadBtn.loading">{{'fix' | i18n}}</button>
@ -33,10 +34,12 @@
<small>{{a.sizeName}}</small>
</td>
<td class="table-list-options">
<button class="btn btn-outline-danger" type="button" appStopClick title="{{'delete' | i18n}}"
(click)="delete(a)" #deleteBtn [appApiAction]="deletePromises[a.id]" [disabled]="deleteBtn.loading">
<button class="btn btn-outline-danger" type="button" appStopClick
title="{{'delete' | i18n}}" (click)="delete(a)" #deleteBtn
[appApiAction]="deletePromises[a.id]" [disabled]="deleteBtn.loading">
<i class="fa fa-trash-o fa-lg fa-fw" [hidden]="deleteBtn.loading"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading" title="{{'loading' | i18n}}"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading"
title="{{'loading' | i18n}}"></i>
</button>
</td>
</tr>

3
src/app/vault/bulk-delete.component.html
View File

@ -17,7 +17,8 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'delete' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal" title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal"
title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

3
src/app/vault/bulk-move.component.html
View File

@ -23,7 +23,8 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal" title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal"
title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

15
src/app/vault/bulk-share.component.html
View File

@ -11,10 +11,12 @@
</div>
<div class="modal-body">
<p>{{'shareManyDesc' | i18n}}</p>
<p>{{'shareSelectedItemsCountDesc' | i18n: this.ciphers.length : shareableCiphers.length : nonShareableCount}}</p>
<p>{{'shareSelectedItemsCountDesc' | i18n: this.ciphers.length : shareableCiphers.length : nonShareableCount}}
</p>
<div class="form-group">
<label for="organization">{{'organization' | i18n}}</label>
<select id="organization" name="OrganizationId" [(ngModel)]="organizationId" class="form-control" (change)="filterCollections()">
<select id="organization" name="OrganizationId" [(ngModel)]="organizationId" class="form-control"
(change)="filterCollections()">
<option *ngFor="let o of organizations" [ngValue]="o.id">{{o.name}}</option>
</select>
</div>
@ -36,7 +38,8 @@
<tbody>
<tr *ngFor="let c of collections; let i = index" (click)="check(c)">
<td class="table-list-checkbox">
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked" appStopProp>
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked"
appStopProp>
</td>
<td>
{{c.name}}
@ -46,11 +49,13 @@
</table>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary btn-submit manual" [disabled]="form.loading || !canSave" [ngClass]="{loading:form.loading}">
<button type="submit" class="btn btn-primary btn-submit manual" [disabled]="form.loading || !canSave"
[ngClass]="{loading:form.loading}">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal" title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal"
title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

22
src/app/vault/ciphers.component.html
View File

@ -9,8 +9,10 @@
<app-vault-icon [cipher]="c"></app-vault-icon>
</td>
<td (click)="checkCipher(c)" class="reduced-lh wrap">
<a href="#" appStopClick appStopProp (click)="selectCipher(c)" title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" appStopProp *ngIf="!organization && c.organizationId" title="{{'shared' | i18n}}"></i>
<a href="#" appStopClick appStopProp (click)="selectCipher(c)"
title="{{'editItem' | i18n}}">{{c.name}}</a>
<i class="fa fa-share-alt" appStopProp *ngIf="!organization && c.organizationId"
title="{{'shared' | i18n}}"></i>
<ng-container *ngIf="c.hasAttachments">
<i class="fa fa-paperclip" appStopProp title="{{'attachments' | i18n}}"></i>
<i class="fa fa-exclamation-triangle text-warning" appStopProp *ngIf="showFixOldAttachments(c)"
@ -21,12 +23,13 @@
</td>
<td class="table-list-options">
<div class="dropdown" appListDropdown>
<button class="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog fa-lg"></i>
</button>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#" appStopClick *ngIf="c.type === cipherType.Login" (click)="copy(c.login.password, 'password', 'password')">
<a class="dropdown-item" href="#" appStopClick *ngIf="c.type === cipherType.Login"
(click)="copy(c.login.password, 'password', 'password')">
<i class="fa fa-fw fa-clipboard"></i>
{{'copyPassword' | i18n}}
</a>
@ -34,15 +37,18 @@
<i class="fa fa-fw fa-paperclip"></i>
{{'attachments' | i18n}}
</a>
<a class="dropdown-item" href="#" appStopClick *ngIf="!organization && !c.organizationId" (click)="share(c)">
<a class="dropdown-item" href="#" appStopClick *ngIf="!organization && !c.organizationId"
(click)="share(c)">
<i class="fa fa-fw fa-share-alt"></i>
{{'share' | i18n}}
</a>
<a class="dropdown-item" href="#" appStopClick *ngIf="c.organizationId" (click)="collections(c)">
<a class="dropdown-item" href="#" appStopClick *ngIf="c.organizationId"
(click)="collections(c)">
<i class="fa fa-fw fa-cubes"></i>
{{'collections' | i18n}}
</a>
<a class="dropdown-item" href="#" appStopClick *ngIf="c.organizationId && accessEvents" (click)="events(c)">
<a class="dropdown-item" href="#" appStopClick *ngIf="c.organizationId && accessEvents"
(click)="events(c)">
<i class="fa fa-fw fa-file-text-o"></i>
{{'eventLogs' | i18n}}
</a>

6
src/app/vault/collections.component.html
View File

@ -30,7 +30,8 @@
<tbody>
<tr *ngFor="let c of collections; let i = index" (click)="check(c)">
<td class="table-list-checkbox">
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked" appStopProp>
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked"
appStopProp>
</td>
<td>
{{c.name}}
@ -44,7 +45,8 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary"
data-dismiss="modal">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

11
src/app/vault/folder-add-edit.component.html
View File

@ -16,12 +16,15 @@
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal" title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal"
title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
<div class="ml-auto">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger" title="{{'delete' | i18n}}" *ngIf="editMode"
[disabled]="deleteBtn.loading" [appApiAction]="deletePromise">
<button #deleteBtn type="button" (click)="delete()" class="btn btn-outline-danger"
title="{{'delete' | i18n}}" *ngIf="editMode" [disabled]="deleteBtn.loading"
[appApiAction]="deletePromise">
<i class="fa fa-trash-o fa-lg fa-fw" [hidden]="deleteBtn.loading"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading" title="{{'loading' | i18n}}"></i>
<i class="fa fa-spinner fa-spin fa-lg fa-fw" [hidden]="!deleteBtn.loading"
title="{{'loading' | i18n}}"></i>
</button>
</div>
</div>

38
src/app/vault/groupings.component.html
View File

@ -1,13 +1,14 @@
<div class="card vault-filters">
<div class="card-header d-flex">
{{'filters' | i18n}}
<a class="ml-auto" href="https://help.bitwarden.com/article/searching-vault/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://help.bitwarden.com/article/searching-vault/" target="_blank" rel="noopener"
title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</div>
<div class="card-body">
<input type="search" placeholder="{{searchPlaceholder || ('searchVault' | i18n)}}" id="search" class="form-control"
[(ngModel)]="searchText" (input)="searchTextChanged()" appAutofocus>
<input type="search" placeholder="{{searchPlaceholder || ('searchVault' | i18n)}}" id="search"
class="form-control" [(ngModel)]="searchText" (input)="searchTextChanged()" appAutofocus>
<ul class="fa-ul card-ul">
<li [ngClass]="{active: selectedAll}">
<a href="#" appStopClick (click)="selectAll()">
@ -50,27 +51,33 @@
<ng-container *ngIf="showFolders">
<h3 class="d-flex">
{{'folders' | i18n}}
<a href="#" class="text-muted ml-auto" appStopClick (click)="addFolder()" title="{{'addFolder' | i18n}}">
<a href="#" class="text-muted ml-auto" appStopClick (click)="addFolder()"
title="{{'addFolder' | i18n}}">
<i class="fa fa-plus fa-fw"></i>
</a>
</h3>
<ul class="fa-ul card-ul carets">
<ng-template #recursiveFolders let-folders>
<li *ngFor="let f of folders" [ngClass]="{active: selectedFolder && f.node.id === selectedFolderId}">
<li *ngFor="let f of folders"
[ngClass]="{active: selectedFolder && f.node.id === selectedFolderId}">
<div class="d-flex">
<i class="fa-li fa" title="{{'toggleCollapse' | i18n}}" [ngClass]="{'fa-caret-right': isCollapsed(f.node), 'fa-caret-down': !isCollapsed(f.node)}" (click)="collapse(f.node)"></i>
<i class="fa-li fa" title="{{'toggleCollapse' | i18n}}"
[ngClass]="{'fa-caret-right': isCollapsed(f.node), 'fa-caret-down': !isCollapsed(f.node)}"
(click)="collapse(f.node)"></i>
<a href="#" appStopClick (click)="selectFolder(f.node)">{{f.node.name}}</a>
<a href="#" class="text-muted ml-auto show-active" appStopClick (click)="editFolder(f.node)"
title="{{'editFolder' | i18n}}" *ngIf="f.node.id">
<a href="#" class="text-muted ml-auto show-active" appStopClick
(click)="editFolder(f.node)" title="{{'editFolder' | i18n}}" *ngIf="f.node.id">
<i class="fa fa-pencil fa-fw"></i>
</a>
</div>
<ul class="fa-ul card-ul carets" *ngIf="f.children.length && !isCollapsed(f.node)">
<ng-container *ngTemplateOutlet="recursiveFolders; context:{ $implicit: f.children }"></ng-container>
<ng-container *ngTemplateOutlet="recursiveFolders; context:{ $implicit: f.children }">
</ng-container>
</ul>
</li>
</ng-template>
<ng-container *ngTemplateOutlet="recursiveFolders; context:{ $implicit: nestedFolders }"></ng-container>
<ng-container *ngTemplateOutlet="recursiveFolders; context:{ $implicit: nestedFolders }">
</ng-container>
</ul>
</ng-container>
<ng-container *ngIf="showCollections && collections && collections.length">
@ -78,14 +85,19 @@
<ul class="fa-ul card-ul carets">
<ng-template #recursiveCollections let-collections>
<li *ngFor="let c of collections" [ngClass]="{active: c.node.id === selectedCollectionId}">
<i class="fa-li fa" title="{{'toggleCollapse' | i18n}}" [ngClass]="{'fa-caret-right': isCollapsed(c.node), 'fa-caret-down': !isCollapsed(c.node)}" (click)="collapse(c.node)"></i>
<i class="fa-li fa" title="{{'toggleCollapse' | i18n}}"
[ngClass]="{'fa-caret-right': isCollapsed(c.node), 'fa-caret-down': !isCollapsed(c.node)}"
(click)="collapse(c.node)"></i>
<a href="#" appStopClick (click)="selectCollection(c.node)">{{c.node.name}}</a>
<ul class="fa-ul card-ul carets" *ngIf="c.children.length && !isCollapsed(c.node)">
<ng-container *ngTemplateOutlet="recursiveCollections; context:{ $implicit: c.children }"></ng-container>
<ng-container
*ngTemplateOutlet="recursiveCollections; context:{ $implicit: c.children }">
</ng-container>
</ul>
</li>
</ng-template>
<ng-container *ngTemplateOutlet="recursiveCollections; context:{ $implicit: nestedCollections }"></ng-container>
<ng-container *ngTemplateOutlet="recursiveCollections; context:{ $implicit: nestedCollections }">
</ng-container>
</ul>
</ng-container>
</ng-container>

15
src/app/vault/share.component.html
View File

@ -17,7 +17,8 @@
<p>{{'shareDesc' | i18n}}</p>
<div class="form-group">
<label for="organization">{{'organization' | i18n}}</label>
<select id="organization" name="OrganizationId" [(ngModel)]="organizationId" class="form-control" (change)="filterCollections()">
<select id="organization" name="OrganizationId" [(ngModel)]="organizationId" class="form-control"
(change)="filterCollections()">
<option *ngFor="let o of organizations" [ngValue]="o.id">{{o.name}}</option>
</select>
</div>
@ -39,7 +40,8 @@
<tbody>
<tr *ngFor="let c of collections; let i = index" (click)="check(c)">
<td class="table-list-checkbox">
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked" appStopProp>
<input type="checkbox" [(ngModel)]="c.checked" name="Collection[{{i}}].Checked"
appStopProp>
</td>
<td>
{{c.name}}
@ -49,14 +51,17 @@
</table>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary btn-submit manual" [disabled]="form.loading || !canSave" [ngClass]="{loading:form.loading}" *ngIf="organizations && organizations.length">
<button type="submit" class="btn btn-primary btn-submit manual" [disabled]="form.loading || !canSave"
[ngClass]="{loading:form.loading}" *ngIf="organizations && organizations.length">
<i class="fa fa-spinner fa-spin" title="{{'loading' | i18n}}"></i>
<span>{{'save' | i18n}}</span>
</button>
<a href="#" routerLink="/settings/create-organization" class="btn btn-primary" *ngIf="!organizations || !organizations.length">
<a href="#" routerLink="/settings/create-organization" class="btn btn-primary"
*ngIf="!organizations || !organizations.length">
{{'newOrganization' | i18n}}
</a>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal" title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal"
title="{{'cancel' | i18n}}">{{'cancel' | i18n}}</button>
</div>
</form>
</div>

21
src/app/vault/vault.component.html
View File

@ -1,8 +1,9 @@
<div class="container page-content">
<div class="row">
<div class="col-3">
<app-vault-groupings (onAllClicked)="clearGroupingFilters()" (onFavoritesClicked)="filterFavorites()" (onCipherTypeClicked)="filterCipherType($event)"
(onFolderClicked)="filterFolder($event.id)" (onAddFolder)="addFolder()" (onEditFolder)="editFolder($event.id)"
<app-vault-groupings (onAllClicked)="clearGroupingFilters()" (onFavoritesClicked)="filterFavorites()"
(onCipherTypeClicked)="filterCipherType($event)" (onFolderClicked)="filterFolder($event.id)"
(onAddFolder)="addFolder()" (onEditFolder)="editFolder($event.id)"
(onCollectionClicked)="filterCollection($event.id)" (onSearchTextChanged)="filterSearchText($event)">
</app-vault-groupings>
</div>
@ -11,13 +12,14 @@
<h1>
{{'myVault' | i18n}}
<small #actionSpinner [appApiAction]="ciphersComponent.actionPromise">
<i *ngIf="actionSpinner.loading" class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
<i *ngIf="actionSpinner.loading" class="fa fa-spinner fa-spin text-muted"
title="{{'loading' | i18n}}"></i>
</small>
</h1>
<div class="ml-auto d-flex">
<div class="dropdown mr-2" appListDropdown>
<button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" id="bulkActionsButton" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button"
id="bulkActionsButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-cog"></i>
</button>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bulkActionsButton">
@ -49,7 +51,8 @@
</button>
</div>
</div>
<app-vault-ciphers (onCipherClicked)="editCipher($event)" (onAttachmentsClicked)="editCipherAttachments($event)" (onAddCipher)="addCipher()"
<app-vault-ciphers (onCipherClicked)="editCipher($event)"
(onAttachmentsClicked)="editCipherAttachments($event)" (onAddCipher)="addCipher()"
(onShareClicked)="shareCipher($event)" (onCollectionsClicked)="editCipherCollections($event)">
</app-vault-ciphers>
</div>
@ -72,7 +75,8 @@
</div>
<div class="card-body">
<p>{{'updateBrowserDesc' | i18n}}</p>
<a class="btn btn-block btn-outline-secondary" target="_blank" href="https://browser-update.org/update-browser.html" rel="noopener">
<a class="btn btn-block btn-outline-secondary" target="_blank"
href="https://browser-update.org/update-browser.html" rel="noopener">
{{'updateBrowser' | i18n}}
</a>
</div>
@ -91,7 +95,8 @@
<div class="card">
<div class="card-header d-flex">
{{'organizations' | i18n}}
<a class="ml-auto" href="https://help.bitwarden.com/article/what-is-an-organization/" target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<a class="ml-auto" href="https://help.bitwarden.com/article/what-is-an-organization/"
target="_blank" rel="noopener" title="{{'learnMore' | i18n}}">
<i class="fa fa-question-circle-o"></i>
</a>
</div>