mirror of
https://github.com/bitwarden/browser
synced 2025-12-20 02:03:39 +00:00
[PM-17598] Long custom fields (#13668)
* add custom directive to use the angular CDK resize textarea directive * swap to textarea to allow for full content to be shown when view text or hidden custom fields * add text-field styling to web sass file * move angular import to CL scss file * add `textarea` to selector to enforce directive usage only on textareas
This commit is contained in:
@@ -5,13 +5,19 @@
|
||||
<bit-card>
|
||||
<div
|
||||
class="tw-border-secondary-300 [&_bit-form-field:last-of-type]:tw-mb-0"
|
||||
*ngFor="let field of cipher.fields; let last = last"
|
||||
*ngFor="let field of cipher.fields; let last = last; let i = index"
|
||||
[ngClass]="{ 'tw-mb-4': !last }"
|
||||
data-testid="custom-field"
|
||||
>
|
||||
<bit-form-field *ngIf="field.type === fieldType.Text" [disableReadOnlyBorder]="last">
|
||||
<bit-label [appTextDrag]="field.value">{{ field.name }}</bit-label>
|
||||
<input readonly bitInput type="text" [value]="field.value" aria-readonly="true" />
|
||||
<textarea
|
||||
readonly
|
||||
bitInput
|
||||
[value]="field.value"
|
||||
aria-readonly="true"
|
||||
vaultAutosizeReadOnlyTextArea
|
||||
></textarea>
|
||||
<button
|
||||
bitIconButton="bwi-clone"
|
||||
bitSuffix
|
||||
@@ -32,14 +38,26 @@
|
||||
[value]="field.value"
|
||||
aria-readonly="true"
|
||||
class="tw-font-mono"
|
||||
*ngIf="!revealedHiddenFields.includes(i)"
|
||||
/>
|
||||
<!-- `type="password"` is only available for inputs, but textarea should show the entire field when visible. -->
|
||||
<textarea
|
||||
*ngIf="revealedHiddenFields.includes(i)"
|
||||
readonly
|
||||
bitInput
|
||||
type="password"
|
||||
[value]="field.value"
|
||||
aria-readonly="true"
|
||||
class="tw-font-mono"
|
||||
vaultAutosizeReadOnlyTextArea
|
||||
></textarea>
|
||||
<button
|
||||
bitSuffix
|
||||
type="button"
|
||||
bitIconButton
|
||||
bitPasswordInputToggle
|
||||
*ngIf="canViewPassword"
|
||||
(toggledChange)="logHiddenEvent($event)"
|
||||
(toggledChange)="toggleHiddenField($event, i)"
|
||||
></button>
|
||||
<button
|
||||
bitIconButton="bwi-clone"
|
||||
|
||||
Reference in New Issue
Block a user