mirror of
https://github.com/bitwarden/browser
synced 2025-12-20 18:23:31 +00:00
more flex. toggle password on add/edit
This commit is contained in:
Kyle Spearrin
@@ -11,7 +11,12 @@
|
||||
</div>
|
||||
<!-- Login -->
|
||||
<div *ngIf="cipher.login">
|
||||
<div class="box-content-row" *ngIf="cipher.login.uri">
|
||||
<div class="box-content-row box-content-row-flex" *ngIf="cipher.login.uri">
|
||||
<div class="row-main">
|
||||
<span class="row-label" *ngIf="!cipher.login.isWebsite">{{'uri' | i18n}}</span>
|
||||
<span class="row-label" *ngIf="cipher.login.isWebsite">{{'website' | i18n}}</span>
|
||||
{{cipher.login.domainOrUri}}
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'launch' | i18n}}"
|
||||
*ngIf="cipher.login.canLaunch" (click)="launch()">
|
||||
@@ -22,21 +27,25 @@
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span class="row-label" *ngIf="!cipher.login.isWebsite">{{'uri' | i18n}}</span>
|
||||
<span class="row-label" *ngIf="cipher.login.isWebsite">{{'website' | i18n}}</span>
|
||||
{{cipher.login.domainOrUri}}
|
||||
</div>
|
||||
<div class="box-content-row" *ngIf="cipher.login.username">
|
||||
<div class="box-content-row box-content-row-flex" *ngIf="cipher.login.username">
|
||||
<div class="row-main">
|
||||
<span class="row-label">{{'username' | i18n}}</span>
|
||||
{{cipher.login.username}}
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'copyValue' | i18n}}"
|
||||
(click)="copy(cipher.login.username, 'Username')">
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span class="row-label">{{'username' | i18n}}</span>
|
||||
{{cipher.login.username}}
|
||||
</div>
|
||||
<div class="box-content-row" *ngIf="cipher.login.password">
|
||||
<div class="box-content-row box-content-row-flex" *ngIf="cipher.login.password">
|
||||
<div class="row-main">
|
||||
<span class="row-label">{{'password' | i18n}}</span>
|
||||
<span [hidden]="showPassword" class="monospaced">{{cipher.login.maskedPassword}}</span>
|
||||
<span [hidden]="!showPassword" class="monospaced">{{cipher.login.password}}</span>
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'toggleVisibility' | i18n}}"
|
||||
(click)="togglePassword()">
|
||||
@@ -48,17 +57,12 @@
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span class="row-label">{{'password' | i18n}}</span>
|
||||
<span [hidden]="showPassword" class="monospaced">{{cipher.login.maskedPassword}}</span>
|
||||
<span [hidden]="!showPassword" class="monospaced">{{cipher.login.password}}</span>
|
||||
</div>
|
||||
<div class="box-content-row totp" [ngClass]="{'low': totpLow}"
|
||||
<div class="box-content-row box-content-row-flex totp" [ngClass]="{'low': totpLow}"
|
||||
*ngIf="cipher.login.totp && totpCode">
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'copyValue' | i18n}}"
|
||||
(click)="copy(totpCode, 'TOTP')">
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
<div class="row-main">
|
||||
<span class="row-label">{{'verificationCodeTotp' | i18n}}</span>
|
||||
<span class="totp-code">{{totpCodeFormatted}}</span>
|
||||
</div>
|
||||
<span class="totp-countdown">
|
||||
<span class="totp-sec">{{totpSec}}</span>
|
||||
@@ -70,8 +74,12 @@
|
||||
</g>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="row-label">{{'verificationCodeTotp' | i18n}}</span>
|
||||
<span class="totp-code">{{totpCodeFormatted}}</span>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'copyValue' | i18n}}"
|
||||
(click)="copy(totpCode, 'TOTP')">
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Card -->
|
||||
@@ -80,15 +88,17 @@
|
||||
<span class="row-label">{{'cardholderName' | i18n}}</span>
|
||||
{{cipher.card.cardholderName}}
|
||||
</div>
|
||||
<div class="box-content-row" *ngIf="cipher.card.number">
|
||||
<div class="box-content-row box-content-row-flex" *ngIf="cipher.card.number">
|
||||
<div class="row-main">
|
||||
<span class="row-label">{{'number' | i18n}}</span>
|
||||
{{cipher.card.number}}
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'copyValue' | i18n}}"
|
||||
(click)="copy(cipher.card.number, 'Number')">
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span class="row-label">{{'number' | i18n}}</span>
|
||||
{{cipher.card.number}}
|
||||
</div>
|
||||
<div class="box-content-row" *ngIf="cipher.card.brand">
|
||||
<span class="row-label">{{'brand' | i18n}}</span>
|
||||
@@ -98,15 +108,17 @@
|
||||
<span class="row-label">{{'expiration' | i18n}}</span>
|
||||
{{cipher.card.expiration}}
|
||||
</div>
|
||||
<div class="box-content-row" *ngIf="cipher.card.code">
|
||||
<div class="box-content-row box-content-row-flex" *ngIf="cipher.card.code">
|
||||
<div class="row-main">
|
||||
<span class="row-label">{{'securityCode' | i18n}}</span>
|
||||
{{cipher.card.code}}
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'copyValue' | i18n}}"
|
||||
(click)="copy(cipher.card.code, 'Security Code')">
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span class="row-label">{{'securityCode' | i18n}}</span>
|
||||
{{cipher.card.code}}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Identity -->
|
||||
@@ -172,7 +184,21 @@
|
||||
{{'customFields' | i18n}}
|
||||
</div>
|
||||
<div class="box-content">
|
||||
<div class="box-content-row" *ngFor="let field of cipher.fields">
|
||||
<div class="box-content-row box-content-row-flex" *ngFor="let field of cipher.fields">
|
||||
<div class="row-main">
|
||||
<span class="row-label">{{field.name}}</span>
|
||||
<div *ngIf="field.type === fieldType.Text">
|
||||
{{field.value || ' '}}
|
||||
</div>
|
||||
<div *ngIf="field.type === fieldType.Hidden">
|
||||
<span [hidden]="!field.showValue" class="monospaced">{{field.value}}</span>
|
||||
<span [hidden]="field.showValue" class="monospaced">{{field.maskedValue}}</span>
|
||||
</div>
|
||||
<div *ngIf="field.type === fieldType.Boolean">
|
||||
<i class="fa fa-check-square-o" *ngIf="field.value === 'true'"></i>
|
||||
<i class="fa fa-square-o" *ngIf="field.value !== 'true'"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<a class="row-btn" href="#" appStopClick title="{{'toggleVisibility' | i18n}}"
|
||||
*ngIf="field.type === fieldType.Hidden" (click)="toggleFieldValue(field)">
|
||||
@@ -185,18 +211,6 @@
|
||||
<i class="fa fa-lg fa-clipboard"></i>
|
||||
</a>
|
||||
</div>
|
||||
<span class="row-label">{{field.name}}</span>
|
||||
<div *ngIf="field.type === fieldType.Text">
|
||||
{{field.value || ' '}}
|
||||
</div>
|
||||
<div *ngIf="field.type === fieldType.Hidden">
|
||||
<span [hidden]="!field.showValue" class="monospaced">{{field.value}}</span>
|
||||
<span [hidden]="field.showValue" class="monospaced">{{field.maskedValue}}</span>
|
||||
</div>
|
||||
<div *ngIf="field.type === fieldType.Boolean">
|
||||
<i class="fa fa-check-square-o" *ngIf="field.value === 'true'"></i>
|
||||
<i class="fa fa-square-o" *ngIf="field.value !== 'true'"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user