diff options
author | Rigel Kent <sendmemail@rigelk.eu> | 2020-12-04 15:58:55 +0100 |
---|---|---|
committer | Rigel Kent <sendmemail@rigelk.eu> | 2020-12-04 16:01:53 +0100 |
commit | f8b530e0a523a0d9ff469ef716838374c395a360 (patch) | |
tree | a55d49365e539582dd5000a2c73b9351df93a52d /client/src/app/shared/shared-forms/input-toggle-hidden.component.html | |
parent | aa5ee5017a83b280352f8dbcfed2d4741709a4fd (diff) | |
download | PeerTube-f8b530e0a523a0d9ff469ef716838374c395a360.tar.gz PeerTube-f8b530e0a523a0d9ff469ef716838374c395a360.tar.zst PeerTube-f8b530e0a523a0d9ff469ef716838374c395a360.zip |
unify inputs requiring buttons like password inputs
Diffstat (limited to 'client/src/app/shared/shared-forms/input-toggle-hidden.component.html')
-rw-r--r-- | client/src/app/shared/shared-forms/input-toggle-hidden.component.html | 13 |
1 files changed, 13 insertions, 0 deletions
diff --git a/client/src/app/shared/shared-forms/input-toggle-hidden.component.html b/client/src/app/shared/shared-forms/input-toggle-hidden.component.html new file mode 100644 index 000000000..f59dc6215 --- /dev/null +++ b/client/src/app/shared/shared-forms/input-toggle-hidden.component.html | |||
@@ -0,0 +1,13 @@ | |||
1 | <div class="input-group input-group-sm"> | ||
2 | <input [id]="id" [autocomplete]="autocomplete" [value]="value" [placeholder]="placeholder" [(ngModel)]="value" (ngModelChange)="update()" [ngClass]="{ 'readonly': readonly }" [readonly]="readonly" | ||
3 | #input (click)="input.select()" (input)="update()" (change)="update()" [type]="inputType" class="form-control" /> | ||
4 | |||
5 | <div *ngIf="withToggle || withCopy" class="input-group-append"> | ||
6 | <button *ngIf="withToggle" (click)="toggle()" type="button" class="btn btn-outline-secondary" [title]="toggleTitle"> | ||
7 | <span class="glyphicon glyphicon-eye-{{ show ? 'open' : 'close' }}"></span> | ||
8 | </button> | ||
9 | <button *ngIf="withCopy" [cdkCopyToClipboard]="input.value" (click)="activateCopiedMessage()" type="button" class="btn btn-outline-secondary" i18n-title title="Copy"> | ||
10 | <span class="glyphicon glyphicon-copy"></span> | ||
11 | </button> | ||
12 | </div> | ||
13 | </div> | ||