fix: add alt text

components/CommitStatBox.vue

@@ -27,7 +27,12 @@ onMounted(async () => {
       title="Latest commit"
       :clearstyles="true"
     >
-      <img class="m-0 w-full h-full" :src="imgUrl" id="github-commit-img" />
+      <img
+        class="m-0 w-full h-full"
+        :src="imgUrl"
+        id="github-commit-img"
+        alt="Latest GitHub commit"
+      />
       <!--
         <div>
         <h2>{{ title }}</h2>

components/HamburgerMenu.vue

@@ -34,10 +34,11 @@ const getSvgIcon = async (name: string) => {
             :src="`/nav/${item.title.toLowerCase()}.svg`"
             class="m-0"
             preload="auto"
+            :alt="`${item.title} logo`"
           />
           {{ item.title }}
         </a>
-        <hr class="m-0 m-2" v-if="index !== navItems.length - 1" />
+        <hr class="m-2" v-if="index !== navItems.length - 1" />
       </li>
     </div>
   </div>

components/Navbar.vue

@@ -11,7 +11,10 @@ const props = defineProps<{ activeItem?: string }>();
       <li class="home-text"><a href="/">Eggworld</a></li>
       <li v-for="(item, index) in navItems" :key="index">
         <a :href="item.href" class="flex gap-2">
-          <img :src="`/nav/${item.title.toLowerCase()}.svg`" />
+          <img
+            :src="`/nav/${item.title.toLowerCase()}.svg`"
+            :alt="`${item.title} logo`"
+          />
           {{ item.title }}</a
         >
       </li>

components/ServiceCard.vue

@@ -16,7 +16,7 @@ const imgUrl = `/images/services/${props.img}`;
     :class="['no-underline', { unclickable: unclickable || broken, broken }]"
   >
     <div class="card flex flex-col items-center justify-around">
-      <img class="m-0" :src="imgUrl" />
+      <img class="m-0" :src="imgUrl" :alt="`${name} logo`" />
       <h3 class="m-0">{{ props.name }}</h3>
       <p class="desc-text text-gray-600 dark:text-gray-200"><slot /></p>
     </div>