EVOgeek
/
Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3947 datetime: Improve a11y of datetime-button

main
Dani Palou 2024-03-08 12:07:20 +01:00
parent f0bb576920
commit abd1a32f63
2 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/addons/calendar/pages/edit-event/edit-event.html
View File

@ -27,9 +27,9 @@
<!-- Date. --> <!-- Date. -->
<ion-item class="ion-text-wrap"> <ion-item class="ion-text-wrap">
<ion-label position="stacked"> <ion-label position="stacked">
<p class="item-heading" [core-mark-required]="true">{{ 'core.date' | translate }}</p> <label class="item-heading" [core-mark-required]="true" for="timestart-button">{{ 'core.date' | translate }}</label>
</ion-label> </ion-label>
<ion-datetime-button datetime="timestart" /> <ion-datetime-button datetime="timestart" id="timestart-button" />
<ion-modal [keepContentsMounted]="true"> <ion-modal [keepContentsMounted]="true">
<ng-template> <ng-template>
<ion-datetime id="timestart" formControlName="timestart" presentation="date-time" [max]="maxDate" [min]="minDate" <ion-datetime id="timestart" formControlName="timestart" presentation="date-time" [max]="maxDate" [min]="minDate"
@ -147,12 +147,12 @@
</ion-item> </ion-item>
<ion-item> <ion-item>
<ion-radio [value]="1"> <ion-radio [value]="1">
<p>{{ 'addon.calendar.durationuntil' | translate }}</p> <p><label for="timedurationuntil-button">{{ 'addon.calendar.durationuntil' | translate }}</label></p>
</ion-radio> </ion-radio>
</ion-item> </ion-item>
<ion-item *ngIf="form.controls.duration.value === 1"> <ion-item *ngIf="form.controls.duration.value === 1">
<ion-label position="stacked" /> <ion-label position="stacked" />
<ion-datetime-button datetime="timedurationuntil" /> <ion-datetime-button datetime="timedurationuntil" id="timedurationuntil-button" />
<ion-modal [keepContentsMounted]="true"> <ion-modal [keepContentsMounted]="true">
<ng-template> <ng-template>
<ion-datetime id="timedurationuntil" formControlName="timedurationuntil" [max]="maxDate" [min]="minDate" <ion-datetime id="timedurationuntil" formControlName="timedurationuntil" [max]="maxDate" [min]="minDate"
@ -164,11 +164,11 @@
</ion-item> </ion-item>
<ion-item> <ion-item>
<ion-radio [value]="2"> <ion-radio [value]="2">
<p id="durationinminutes">{{ 'addon.calendar.durationminutes' | translate }}</p> <p><label for="timedurationminutes">{{ 'addon.calendar.durationminutes' | translate }}</label></p>
</ion-radio> </ion-radio>
</ion-item> </ion-item>
<ion-item *ngIf="form.controls.duration.value === 2"> <ion-item *ngIf="form.controls.duration.value === 2">
<ion-input type="number" name="timedurationminutes" labelPlacement="start" aria-labelledby="durationinminutes" <ion-input type="number" name="timedurationminutes" labelPlacement="start" id="timedurationminutes"
[placeholder]="'addon.calendar.durationminutes' | translate" formControlName="timedurationminutes" /> [placeholder]="'addon.calendar.durationminutes' | translate" formControlName="timedurationminutes" />
</ion-item> </ion-item>
</ion-radio-group> </ion-radio-group>

10
src/addons/userprofilefield/datetime/component/addon-user-profile-field-datetime.html
View File

@ -13,17 +13,17 @@
<!-- Edit. --> <!-- Edit. -->
<ion-item *ngIf="edit && field && field.shortname && form" class="ion-text-wrap" [formGroup]="form"> <ion-item *ngIf="edit && field && field.shortname && form" class="ion-text-wrap" [formGroup]="form">
<ion-label position="stacked"> <ion-label position="stacked">
<span [core-mark-required]="required"> <label [core-mark-required]="required" for="profile-field-datetime-{{field.shortname}}-button">
<core-format-text [text]="field.name" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId" <core-format-text [text]="field.name" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId"
[courseId]="courseId" [wsNotFiltered]="true" /> [courseId]="courseId" [wsNotFiltered]="true" />
</span> </label>
</ion-label> </ion-label>
<ion-datetime-button datetime="datetime" /> <ion-datetime-button datetime="profile-field-datetime-{{field.shortname}}" id="profile-field-datetime-{{field.shortname}}-button" />
<ion-modal [keepContentsMounted]="true"> <ion-modal [keepContentsMounted]="true">
<ng-template> <ng-template>
<ion-datetime id="datetime" [formControlName]="modelName" [presentation]="ionDateTimePresentation" [max]="max" [min]="min" <ion-datetime id="profile-field-datetime-{{field.shortname}}" [formControlName]="modelName"
[showDefaultButtons]="true"> [presentation]="ionDateTimePresentation" [max]="max" [min]="min" [showDefaultButtons]="true">
<span slot="title"> <span slot="title">
<core-format-text [text]="field.name" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId" <core-format-text [text]="field.name" [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId"
[courseId]="courseId" [wsNotFiltered]="true" /> [courseId]="courseId" [wsNotFiltered]="true" />