1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-15 15:53:27 +00:00
Files
browser/libs/vault/src/cipher-view/login-credentials/login-credentials-view.component.html

137 lines
3.9 KiB
HTML

<bit-section>
<bit-section-header>
<h2 bitTypography="h6">{{ "loginCredentials" | i18n }}</h2>
</bit-section-header>
<read-only-cipher-card>
<bit-form-field *ngIf="cipher.login.username">
<bit-label>
{{ "username" | i18n }}
</bit-label>
<input
readonly
bitInput
type="text"
[value]="cipher.login.username"
aria-readonly="true"
data-testid="login-username"
/>
<button
bitIconButton="bwi-clone"
bitSuffix
type="button"
[appCopyClick]="cipher.login.username"
[valueLabel]="'username' | i18n"
showToast
[appA11yTitle]="'copyValue' | i18n"
data-testid="copy-username"
></button>
</bit-form-field>
<bit-form-field *ngIf="cipher.login.password">
<bit-label>{{ "password" | i18n }}</bit-label>
<input
readonly
bitInput
type="password"
[value]="cipher.login.password"
aria-readonly="true"
data-testid="login-password"
/>
<button
*ngIf="cipher.viewPassword"
bitSuffix
type="button"
bitIconButton
bitPasswordInputToggle
data-testid="toggle-password"
(toggledChange)="pwToggleValue($event)"
></button>
<button
*ngIf="cipher.viewPassword && passwordRevealed"
bitIconButton="bwi-numbered-list"
bitSuffix
type="button"
data-testid="toggle-password-count"
[appA11yTitle]="(showPasswordCount ? 'hideCharacterCount' : 'showCharacterCount') | i18n"
[attr.aria-expanded]="showPasswordCount"
appStopClick
(click)="togglePasswordCount()"
></button>
<button
*ngIf="cipher.viewPassword"
bitIconButton="bwi-clone"
bitSuffix
type="button"
[appCopyClick]="cipher.login.password"
[valueLabel]="'password' | i18n"
showToast
[appA11yTitle]="'copyValue' | i18n"
data-testid="copy-password"
></button>
</bit-form-field>
<div
*ngIf="showPasswordCount && passwordRevealed"
[ngClass]="{ 'tw-mt-3': !cipher.login.totp }"
>
<bit-color-password
[password]="cipher.login.password"
[showCount]="true"
></bit-color-password>
</div>
<bit-form-field *ngIf="cipher.login?.fido2Credentials?.length > 0">
<bit-label>{{ "typePasskey" | i18n }} </bit-label>
<input
readonly
bitInput
type="text"
[value]="fido2CredentialCreationDateValue"
aria-readonly="true"
data-testid="login-passkey"
/>
</bit-form-field>
<bit-form-field *ngIf="cipher.login.totp">
<bit-label
>{{ "verificationCodeTotp" | i18n }}
<span
*ngIf="!(isPremium$ | async)"
bitBadge
variant="success"
class="tw-ml-2 tw-cursor-pointer"
(click)="getPremium()"
slot="end"
>
{{ "premium" | i18n }}
</span>
</bit-label>
<input
readonly
bitInput
[type]="!(isPremium$ | async) ? 'password' : 'text'"
[value]="totpCodeCopyObj?.totpCodeFormatted || '*** ***'"
aria-readonly="true"
data-testid="login-totp"
/>
<button
*ngIf="isPremium$ | async"
bitTotpCountdown
[cipher]="cipher"
bitSuffix
type="button"
(sendCopyCode)="setTotpCopyCode($event)"
class="tw-cursor-default"
></button>
<button
bitIconButton="bwi-clone"
bitSuffix
type="button"
[appCopyClick]="totpCodeCopyObj?.totpCode"
[valueLabel]="'verificationCodeTotp' | i18n"
showToast
[appA11yTitle]="'copyValue' | i18n"
data-testid="copy-totp"
[disabled]="!(isPremium$ | async)"
class="disabled:tw-cursor-default"
></button>
</bit-form-field>
</read-only-cipher-card>
</bit-section>