diff options
| author | Derick Montague <derick.montague@ibm.com> | 2020-06-27 19:59:17 +0300 |
|---|---|---|
| committer | Derick Montague <derick.montague@ibm.com> | 2020-07-02 16:10:47 +0300 |
| commit | de87f67879d02ccf09cea983cdc927f7c9dda2cf (patch) | |
| tree | 4d6e03168bde4d0bf1469facc0c032527506b013 /src/components/Global/LoadingBar.vue | |
| parent | 74466b852979859e4b8c9a448123460098fdbbf5 (diff) | |
| download | webui-vue-de87f67879d02ccf09cea983cdc927f7c9dda2cf.tar.xz | |
Resolve LoadingBar accessibility issue
- Add an aria-label to the b-progress-bar component to meet
accessibility guidelines
- Nest b-progess-bar component in b-progress component in order to add
aria-label to the correct element
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I3b7d23026d4bcdb607fdbad24170e38116a7eb8a
Diffstat (limited to 'src/components/Global/LoadingBar.vue')
| -rw-r--r-- | src/components/Global/LoadingBar.vue | 11 |
1 files changed, 6 insertions, 5 deletions
diff --git a/src/components/Global/LoadingBar.vue b/src/components/Global/LoadingBar.vue index d972b869..ee333404 100644 --- a/src/components/Global/LoadingBar.vue +++ b/src/components/Global/LoadingBar.vue @@ -1,10 +1,11 @@ <template> <transition name="fade"> - <b-progress - v-if="!isLoadingComplete" - :value="loadingIndicatorValue" - height="0.4rem" - /> + <b-progress v-if="!isLoadingComplete" height="0.4rem"> + <b-progress-bar + :value="loadingIndicatorValue" + :aria-label="$t('global.ariaLabel.progressBar')" + /> + </b-progress> </transition> </template> |