1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-15 15:53:27 +00:00

implemented date & time fallbacks for safari and FF

This commit is contained in:
addison
2021-03-03 15:03:05 -05:00
parent 61d7fcfc85
commit 50b8f6955c
4 changed files with 52 additions and 15 deletions

View File

@@ -116,6 +116,20 @@
<!-- Deletion Date -->
<div class="box">
<div class="box-content">
<ng-template #deletionDateCustom>
<ng-container *ngIf="isDateTimeLocalSupported">
<input id="deletionDateCustom" type="datetime-local" name="DeletionDate"
[(ngModel)]="deletionDate" required placeholder="MM/DD/YYYY HH:MM AM/PM">
</ng-container>
<div class="flex flex-grow"*ngIf="!isDateTimeLocalSupported">
<input id="deletionDateCustomFallback" type="date"
name="DeletionDateFallback" [(ngModel)]="deletionDateFallback" required
placeholder="MM/DD/YYYY" [readOnly]="disableSend">
<input id="deletionTimeCustomFallback" type="time"
name="DeletionTimeDate" [(ngModel)]="deletionTimeFallback" required
placeholder="HH:MM AM/PM" [readOnly]="disableSend">
</div>
</ng-template>
<div class="box-content-row" *ngIf="!editMode">
<label for="deletionDate">{{'deletionDate' | i18n}}</label>
<select id="deletionDate" name="DeletionDateSelect" [(ngModel)]="deletionDateSelect" required>
@@ -123,16 +137,15 @@
</option>
</select>
</div>
<div class="box-content-row" *ngIf="deletionDateSelect === 0 && !editMode">
<input id="deletionDateCustom" type="datetime-local" name="DeletionDate"
[(ngModel)]="deletionDate" required placeholder="MM/DD/YYYY HH:MM AM/PM">
</div>
<div class="box-content-row" *ngIf="editMode" appBoxRow>
<label for="editDeletionDate">{{'deletionDate' | i18n}}</label>
<input id="editDeletionDate" type="datetime-local" name="EditDeletionDate"
[(ngModel)]="deletionDate" required placeholder="MM/DD/YYYY HH:MM AM/PM"
[readonly]="disableSend">
</div>
<ng-container *ngIf="deletionDateSelect === 0 && !editMode">
<ng-container *ngTemplateOutlet="deletionDateCustom"></ng-container>
</ng-container>
<ng-container *ngIf="editMode" appBoxRow>
<div class="box-content-row">
<label for="editDeletionDate">{{'deletionDate' | i18n}}</label>
<ng-container *ngTemplateOutlet="deletionDateCustom"></ng-container>
</div>
</ng-container>
</div>
<div class="box-footer">
{{'deletionDateDesc' | i18n}}
@@ -141,6 +154,21 @@
<!-- Expiration Date -->
<div class="box">
<div class="box-content">
<ng-template #expirationDateCustom>
<ng-container *ngIf="isDateTimeLocalSupported">
<input id="expirationDateCustom" class="form-control mt-1" type="datetime-local"
name="ExpirationDate" [(ngModel)]="expirationDate" required
placeholder="MM/DD/YYYY HH:MM AM/PM" [readOnly]="disableSend">
</ng-container>
<div class="flex flex-grow" *ngIf="!isDateTimeLocalSupported">
<input id="expirationDateCustomFallback" class="form-control mt-1" type="date"
name="ExpirationDateFallback" [(ngModel)]="expirationDateFallback" [required]="!editMode"
placeholder="MM/DD/YYYY" [readOnly]="disableSend">
<input id="expirationTimeCustomFallback" class="form-control mt-1 ml-1" type="time"
name="ExpirationTimeFallback" [(ngModel)]="expirationTimeFallback" [required]="!editMode"
placeholder="HH:MM AM/PM" [readOnly]="disableSend">
</div>
</ng-template>
<div class="box-content-row" *ngIf="!editMode">
<label for="expirationDate">{{'expirationDate' | i18n}}</label>
<select id="expirationDate" name="ExpirationDateSelect" [(ngModel)]="expirationDateSelect"
@@ -150,8 +178,7 @@
</select>
</div>
<div class="box-content-row" *ngIf="expirationDateSelect === 0 && !editMode">
<input id="expirationDateCustom" type="datetime-local" name="ExpirationDate"
[(ngModel)]="expirationDate" required placeholder="MM/DD/YYYY HH:MM AM/PM">
<ng-container *ngTemplateOutlet="expirationDateCustom"></ng-container>
</div>
<div class="box-content-row" *ngIf="editMode" appBoxRow>
<div class="flex-label">
@@ -160,8 +187,7 @@
{{'clear' | i18n}}
</a>
</div>
<input id="editExpirationDate" type="datetime-local" name="EditExpirationDate"
[(ngModel)]="expirationDate" placeholder="MM/DD/YYYY HH:MM AM/PM" [readonly]="disableSend">
<ng-container *ngTemplateOutlet="expirationDateCustom"></ng-container>
</div>
</div>
<div class="box-footer">