diff --git a/client/components/comments.vue b/client/components/comments.vue index 42ac58bd..fd2f1ccc 100644 --- a/client/components/comments.vue +++ b/client/components/comments.vue @@ -12,6 +12,7 @@ color='blue-grey darken-2' :background-color='$vuetify.theme.dark ? `grey darken-5` : `white`' v-if='permissions.write' + :aria-label='$t(`common:comments.fieldContent`)' ) v-row.mt-2(dense, v-if='!isAuthenticated && permissions.write') v-col(cols='12', lg='6') @@ -24,6 +25,7 @@ dense autocomplete='name' v-model='guestName' + :aria-label='$t(`common:comments.fieldName`)' ) v-col(cols='12', lg='6') v-text-field( @@ -36,6 +38,7 @@ dense autocomplete='email' v-model='guestEmail' + :aria-label='$t(`common:comments.fieldEmail`)' ) .d-flex.align-center.pt-3(v-if='permissions.write') v-icon.mr-1(color='blue-grey') mdi-language-markdown-outline @@ -49,6 +52,7 @@ color='blue-grey darken-2' @click='postComment' depressed + :aria-label='$t(`common:comments.postComment`)' ) v-icon(left) mdi-comment span.text-none {{$t('common:comments.postComment')}} diff --git a/client/components/common/nav-header.vue b/client/components/common/nav-header.vue index 5ad14a81..0c608ae1 100644 --- a/client/components/common/nav-header.vue +++ b/client/components/common/nav-header.vue @@ -72,7 +72,7 @@ ) v-tooltip(bottom) template(v-slot:activator='{ on }') - v-btn.ml-2.mr-0(icon, v-on='on', href='/t') + v-btn.ml-2.mr-0(icon, v-on='on', href='/t', :aria-label='$t(`common:header.browseTags`)') v-icon(color='grey') mdi-tag-multiple span {{$t('common:header.browseTags')}} v-flex(xs7, md4) @@ -96,10 +96,18 @@ template(v-if='mode === `view` && locales.length > 0') v-menu(offset-y, bottom, transition='slide-y-transition', max-height='320px', min-width='210px', left) - template(v-slot:activator='{ on: menu }') + template(v-slot:activator='{ on: menu, attrs }') v-tooltip(bottom) template(v-slot:activator='{ on: tooltip }') - v-btn(icon, v-on='{ ...menu, ...tooltip }', :class='$vuetify.rtl ? `ml-3` : ``', tile, height='64') + v-btn( + icon + v-bind='attrs' + v-on='{ ...menu, ...tooltip }' + :class='$vuetify.rtl ? `ml-3` : ``' + tile + height='64' + :aria-label='$t(`common:header.language`)' + ) v-icon(color='grey') mdi-web span {{$t('common:header.language')}} v-list(nav) @@ -113,10 +121,18 @@ template(v-if='hasAnyPagePermissions && path && mode !== `edit`') v-menu(offset-y, bottom, transition='slide-y-transition', left) - template(v-slot:activator='{ on: menu }') + template(v-slot:activator='{ on: menu, attrs }') v-tooltip(bottom) template(v-slot:activator='{ on: tooltip }') - v-btn(icon, v-on='{ ...menu, ...tooltip }', :class='$vuetify.rtl ? `ml-3` : ``', tile, height='64') + v-btn( + icon + v-bind='attrs' + v-on='{ ...menu, ...tooltip }' + :class='$vuetify.rtl ? `ml-3` : ``' + tile + height='64' + :aria-label='$t(`common:header.pageActions`)' + ) v-icon(color='grey') mdi-file-document-edit-outline span {{$t('common:header.pageActions')}} v-list(nav, :light='!$vuetify.theme.dark', :dark='$vuetify.theme.dark', :class='$vuetify.theme.dark ? `grey darken-4` : ``') @@ -151,7 +167,7 @@ template(v-if='hasNewPagePermission && path && mode !== `edit`') v-tooltip(bottom) template(v-slot:activator='{ on }') - v-btn(icon, tile, height='64', v-on='on', @click='pageNew') + v-btn(icon, tile, height='64', v-on='on', @click='pageNew', :aria-label='$t(`common:header.newPage`)') v-icon(color='grey') mdi-text-box-plus-outline span {{$t('common:header.newPage')}} v-divider(vertical) @@ -159,10 +175,18 @@ //- ACCOUNT v-menu(v-if='isAuthenticated', offset-y, bottom, min-width='300', transition='slide-y-transition', left) - template(v-slot:activator='{ on: menu }') + template(v-slot:activator='{ on: menu, attrs }') v-tooltip(bottom) template(v-slot:activator='{ on: tooltip }') - v-btn(icon, v-on='{ ...menu, ...tooltip }', :class='$vuetify.rtl ? `ml-0` : ``', tile, height='64') + v-btn( + icon + v-bind='attrs' + v-on='{ ...menu, ...tooltip }' + :class='$vuetify.rtl ? `ml-0` : ``' + tile + height='64' + :aria-label='$t(`common:header.account`)' + ) v-icon(v-if='picture.kind === `initials`', color='grey') mdi-account-circle v-avatar(v-else-if='picture.kind === `image`', :size='34') v-img(:src='picture.url') @@ -195,7 +219,7 @@ v-tooltip(v-else, left) template(v-slot:activator='{ on }') - v-btn(icon, v-on='on', color='grey darken-3', href='/login') + v-btn(icon, v-on='on', color='grey darken-3', href='/login', :aria-label='$t(`common:header.login`)') v-icon(color='grey') mdi-account-circle span {{$t('common:header.login')}} diff --git a/client/themes/default/components/nav-sidebar.vue b/client/themes/default/components/nav-sidebar.vue index 761d464b..cb5ec0b8 100644 --- a/client/themes/default/components/nav-sidebar.vue +++ b/client/themes/default/components/nav-sidebar.vue @@ -1,12 +1,30 @@