diff options
| -rw-r--r-- | src/components/Global/InputPasswordToggle.vue | 12 | ||||
| -rw-r--r-- | src/components/Global/TableDateFilter.vue | 10 | ||||
| -rw-r--r-- | src/locales/en-US.json | 1 | ||||
| -rw-r--r-- | src/views/Configuration/DateTimeSettings/DateTimeSettings.vue | 5 |
4 files changed, 23 insertions, 5 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> diff --git a/src/locales/en-US.json b/src/locales/en-US.json index 07eae3de..de6dfce6 100644 --- a/src/locales/en-US.json +++ b/src/locales/en-US.json @@ -19,6 +19,7 @@ "selected": "Selected" }, "ariaLabel": { + "hidePassword": "Hide password", "showPassword": "Show password as plain text. Note: this will visually expose your password on the screen.", "tooltip": "Tooltip", "progressBar": "Page loading progress bar" diff --git a/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue b/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue index b6bc8151..7358c0d0 100644 --- a/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue +++ b/src/views/Configuration/DateTimeSettings/DateTimeSettings.vue @@ -86,7 +86,10 @@ aria-controls="input-manual-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> |