fix: improve lighthouse accessibility (#362)

Co-authored-by: JB Aubrée <jb.aubree@digitsole.com>

src/layouts/default.vue

@@ -2,7 +2,7 @@
   <main class="px-4 py-10 text-center text-gray-700 dark:text-gray-200">
     <RouterView />
     <Footer />
-    <div class="mt-5 mx-auto text-center opacity-25 text-sm">
+    <div class="mt-5 mx-auto text-center opacity-75 dark:opacity-50 text-sm">
       [Default Layout]
     </div>
   </main>

src/layouts/home.vue

@@ -2,7 +2,7 @@
   <main class="px-4 py-10 text-center text-gray-700 dark:text-gray-200">
     <RouterView />
     <Footer />
-    <div class="mt-5 mx-auto text-center opacity-25 text-sm">
+    <div class="mt-5 mx-auto text-center opacity-75 dark:opacity-50 text-sm">
       [Home Layout]
     </div>
   </main>

src/pages/hi/[name].vue

@@ -20,7 +20,7 @@ watchEffect(() => {
       {{ t('intro.hi', { name: props.name }) }}
     </p>
 
-    <p text-sm opacity-50>
+    <p text-sm opacity-75>
       <em>{{ t('intro.dynamic-route') }}</em>
     </p>