diff options
| author | Dixsie Wolmers <dixsie@ibm.com> | 2020-08-27 01:23:45 +0300 |
|---|---|---|
| committer | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-09-09 19:22:01 +0300 |
| commit | d2ac76d7922fff243174ee50ab05020a5064aa6e (patch) | |
| tree | 3e9b64191eb6c12cfa38dacbdef7f74638b84d00 /src/components/Global | |
| parent | 4afe2f762cf7f567579bcd3b03c9023c79b535fc (diff) | |
| download | webui-vue-d2ac76d7922fff243174ee50ab05020a5064aa6e.tar.xz | |
Add title attribute to all icon only buttons
- Title attribute allows action text to be displayed on hover
- Carets in hardware status table will be addressed in a separate
commit as part of Hardware status accessibility updates
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: I58a85b6d244d1125f0b43c22d0bb456a36815097
Diffstat (limited to 'src/components/Global')
| -rw-r--r-- | src/components/Global/InputPasswordToggle.vue | 12 | ||||
| -rw-r--r-- | src/components/Global/TableDateFilter.vue | 10 |
2 files changed, 18 insertions, 4 deletions
diff --git a/src/components/Global/InputPasswordToggle.vue b/src/components/Global/InputPasswordToggle.vue index 519a808f..6ac98639 100644 --- a/src/components/Global/InputPasswordToggle.vue +++ b/src/components/Global/InputPasswordToggle.vue @@ -7,8 +7,16 @@ :class="{ isVisible: isVisible }" @click="toggleVisibility" > - <icon-view-off v-if="isVisible" aria-hidden="true" /> - <icon-view v-else aria-hidden="true" /> + <icon-view-off + v-if="isVisible" + aria-hidden="true" + :title="$t('global.ariaLabel.hidePassword')" + /> + <icon-view + v-else + aria-hidden="true" + :title="$t('global.ariaLabel.showPassword')" + /> </b-button> </div> </template> diff --git a/src/components/Global/TableDateFilter.vue b/src/components/Global/TableDateFilter.vue index 538f0e05..1313eddd 100644 --- a/src/components/Global/TableDateFilter.vue +++ b/src/components/Global/TableDateFilter.vue @@ -39,7 +39,10 @@ aria-controls="input-from-date" > <template v-slot:button-content> - <icon-calendar /> + <icon-calendar + :title="$t('global.calendar.openDatePicker')" + aria-hidden="true" + /> <span class="sr-only">{{ $t('global.calendar.openDatePicker') }}</span> @@ -86,7 +89,10 @@ aria-controls="input-to-date" > <template v-slot:button-content> - <icon-calendar /> + <icon-calendar + :title="$t('global.calendar.openDatePicker')" + aria-hidden="true" + /> <span class="sr-only">{{ $t('global.calendar.openDatePicker') }}</span> |