chore: some tuning of aria hidden and alt on images

data-fair · Jan 27, 2025 · 65dda0b · 65dda0b
1 parent f7ff611
commit 65dda0b
Show file tree

Hide file tree

Showing 6 changed files with 17 additions and 17 deletions.
diff --git a/public/components/layout/layout-personal-menu.vue b/public/components/layout/layout-personal-menu.vue
@@ -11,10 +11,9 @@
         <v-icon
           large
           :color="backgroundDark ? 'white' : 'primary'"
-          aria-label="symbole de connexion"
           aria-hidden="false"
         >
-          {{ mdiAccountCircle }}
+          mdi-account-circle
         </v-icon>
       </v-btn>
       <v-btn
@@ -44,7 +43,6 @@
           <v-avatar :size="36">
             <img
               :src="`${directoryUrl}/api/avatars/user/${user.id}/avatar.png`"
-              aria-hidden
               :alt="'Avatar de ' + user.name"
             >
           </v-avatar>
@@ -92,16 +90,9 @@
 
 <script>
 import { mapState, mapGetters, mapActions } from 'vuex'
-// better to load svg for semantic icons important for accessbility
-import { mdiAccountCircle } from '@mdi/js'
 
 export default {
   props: ['loginHref', 'backgroundDark'],
-  data () {
-    return {
-      mdiAccountCircle
-    }
-  },
   computed: {
     ...mapState(['config', 'textDark', 'userPartners']),
     ...mapState('session', ['user']),

diff --git a/public/components/layout/layout-personal-navigation.vue b/public/components/layout/layout-personal-navigation.vue
@@ -16,7 +16,10 @@
         :to="`/`"
       >
         <v-list-item-avatar>
-          <img :src="`${directoryUrl}/api/avatars/${config.owner.type}/${config.owner.id}/avatar.png`">
+          <img
+            aria-hidden="true"
+            :src="`${directoryUrl}/api/avatars/${config.owner.type}/${config.owner.id}/avatar.png`"
+          >
         </v-list-item-avatar>
         <v-list-item-content>
           <v-list-item-title>{{ config.title }}</v-list-item-title>
@@ -68,7 +71,10 @@
           >
             <v-list-item-action class=" my-0">
               <v-avatar :size="28">
-                <img :src="item.avatar">
+                <img
+                  aria-hidden="true"
+                  :src="item.avatar"
+                >
               </v-avatar>
             </v-list-item-action>
             <v-list-item-title>

diff --git a/public/components/notifications-queue.vue b/public/components/notifications-queue.vue
@@ -23,10 +23,9 @@
         >
           <v-icon
             :color="backgroundDark ? 'white' : textDark"
-            aria-label="symbole de notification"
             aria-hidden="false"
           >
-            {{ mdiBell }}
+            mdi-bell
           </v-icon>
         </v-badge>
       </v-btn>
@@ -86,7 +85,6 @@
 <script>
 import { mapState } from 'vuex'
 import eventBus from '~/event-bus'
-import { mdiBell } from '@mdi/js'
 
 /* let sound
 if (!process.server) {
@@ -100,8 +98,7 @@ export default {
     countNew: null,
     notifications: null,
     loading: false,
-    size: 10,
-    mdiBell
+    size: 10
   }),
   computed: {
     ...mapState(['textDark', 'config']),

diff --git a/public/components/owner/owner-department.vue b/public/components/owner/owner-department.vue
@@ -7,6 +7,7 @@
     <v-avatar :size="28">
       <img
         aria-hidden="true"
+        alt=""
         :src="`${directoryUrl}/api/avatars/${owner.type}/${owner.id}/${owner.department}/avatar.png`"
       >
     </v-avatar>

diff --git a/public/components/owner/owner-facets.vue b/public/components/owner/owner-facets.vue
@@ -43,11 +43,13 @@
           <img
             v-if="item.value.department"
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/${item.value.department}/avatar.png`"
           >
           <img
             v-else
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/avatar.png`"
           >
         </v-list-item-avatar>
@@ -62,11 +64,13 @@
           <img
             v-if="item.value.department"
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/${item.value.department}/avatar.png`"
           >
           <img
             v-else
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/avatar.png`"
           >
         </v-avatar>

diff --git a/public/components/owner/owner-short.vue b/public/components/owner/owner-short.vue
@@ -6,6 +6,7 @@
     <v-avatar :size="28">
       <img
         aria-hidden="true"
+        alt=""
         :src="`${directoryUrl}/api/avatars/${owner.type}/${owner.id}/avatar.png`"
       >
     </v-avatar>