From 4cd62f7735f2b797f3486d30afe393a7a1ed3322 Mon Sep 17 00:00:00 2001
From: jlpereira <pepelui@outlook.com>
Date: Tue, 25 Apr 2023 17:37:09 -0300
Subject: [PATCH] Fix meta tags and SEO

---
 public/robots.txt                             |  2 ++
 .../Animation/AnimationOpacity.global.vue     |  3 ---
 src/components/Dropdown/Dropdown.global.vue   | 24 +++++------------
 src/components/Gallery/GalleryMainImage.vue   |  2 +-
 src/components/Layout/LayoutFooter.vue        | 27 +++++++++----------
 src/components/Layout/LayoutHeader.vue        |  2 ++
 src/components/Navbar/NavbarMobile.vue        |  3 ++-
 src/components/SwitchTheme.vue                |  1 +
 .../PanelNomenclatureCitations.vue            | 24 ++++++++++-------
 .../PanelNomenclatureShowMore.vue             |  6 ++---
 src/utils/getMeta.js                          |  3 ++-
 11 files changed, 46 insertions(+), 51 deletions(-)
 create mode 100644 public/robots.txt

diff --git a/public/robots.txt b/public/robots.txt
new file mode 100644
index 0000000..c2a49f4
--- /dev/null
+++ b/public/robots.txt
@@ -0,0 +1,2 @@
+User-agent: *
+Allow: /
diff --git a/src/components/Animation/AnimationOpacity.global.vue b/src/components/Animation/AnimationOpacity.global.vue
index 9619d6d..2f4212c 100644
--- a/src/components/Animation/AnimationOpacity.global.vue
+++ b/src/components/Animation/AnimationOpacity.global.vue
@@ -10,6 +10,3 @@
     <slot />
   </transition>
 </template>
-
-<script setup>
-</script>
\ No newline at end of file
diff --git a/src/components/Dropdown/Dropdown.global.vue b/src/components/Dropdown/Dropdown.global.vue
index 7d57235..d42b56f 100644
--- a/src/components/Dropdown/Dropdown.global.vue
+++ b/src/components/Dropdown/Dropdown.global.vue
@@ -1,26 +1,14 @@
 <template>
   <div class="relative inline">
-    <button @click="toggleMenu">
+    <button
+      title="Menu"
+      @click="toggleMenu"
+    >
       <slot name="button" />
     </button>
     <ul
       v-if="isVisible"
-      class="
-        bg-base-foreground
-        absolute font-normal
-        text-sm
-        text-base-lighter
-        right-0
-        z-10
-        mt-2
-        w-56
-        origin-top-right
-        rounded-md
-        shadow-lg
-        ring-1
-        ring-black
-        ring-opacity-5
-        focus:outline-none"
+      class="bg-base-foreground absolute font-normal text-sm text-base-lighter right-0 z-10 mt-2 w-56 origin-top-right rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
     >
       <li
         v-for="item in items"
@@ -50,7 +38,7 @@ const toggleMenu = () => {
   isVisible.value = !isVisible.value
 }
 
-const itemClicked = item => {
+const itemClicked = (item) => {
   isVisible.value = false
 
   item.action()
diff --git a/src/components/Gallery/GalleryMainImage.vue b/src/components/Gallery/GalleryMainImage.vue
index d53a8a1..13363e2 100644
--- a/src/components/Gallery/GalleryMainImage.vue
+++ b/src/components/Gallery/GalleryMainImage.vue
@@ -7,6 +7,7 @@
       ref="imageElement"
       class="max-h-80 h-max w-100 cursor-zoom-in m-auto"
       :src="image.original"
+      :alt="image.depictions.map((d) => d.label).join(';')"
       @click="emit('open:viewer')"
     />
   </div>
@@ -38,5 +39,4 @@ watch(
 onMounted(() => {
   imageElement.value.addEventListener('load', () => (isLoading.value = false))
 })
-
 </script>
diff --git a/src/components/Layout/LayoutFooter.vue b/src/components/Layout/LayoutFooter.vue
index 5c7034b..afe0435 100644
--- a/src/components/Layout/LayoutFooter.vue
+++ b/src/components/Layout/LayoutFooter.vue
@@ -1,5 +1,7 @@
 <template>
-  <footer class="footer text-white bottom-0 border-gray-200 bg-zinc-800 pl-4 pr-4">
+  <footer
+    class="footer text-white bottom-0 border-gray-200 bg-zinc-800 pl-4 pr-4"
+  >
     <div class="container mx-auto text-sm pt-2 pb-4">
       <div class="pt-4 pb-2">
         {{ project_authors }}
@@ -10,32 +12,31 @@
             class="text-secondary-color"
             :href="project_url"
           >
-            {{ project_url }} 
+            {{ project_url }}
           </a>
           &gt;
         </span>
       </div>
       <div class="flex items-center text-xs">
-        <component 
-          :is="copyright_image_link
-            ? 'a'
-            : 'span'"
+        <component
+          :is="copyright_image_link ? 'a' : 'span'"
           :href="copyright_image_link"
         >
           <img
             v-if="copyright_image"
-            class="mr-2"
             :src="copyright_image"
-          >
+            alt="copyright"
+            class="mr-2"
+          />
         </component>
         <p>{{ copyright_text }}</p>
       </div>
 
-      <hr class="mt-3 mb-3 border-gray-500">
+      <hr class="mt-3 mb-3 border-gray-500" />
 
       <div class="flex items-center">
         <span>
-          Data provided by 
+          Data provided by
           <a
             class="text-slate-400 hover:text-slate-500 dark:hover:text-slate-300 font-medium"
             target="_blank"
@@ -49,7 +50,7 @@
 
         <span>
           Pages by
-          <a 
+          <a
             class="text-slate-400 hover:text-slate-500 dark:hover:text-slate-300 font-medium"
             target="_blank"
             href="https://github.com/SpeciesFileGroup/taxonpages"
@@ -59,7 +60,7 @@
         </span>
         <span class="ml-2 mr-2">|</span>
         <span>
-          Support (Services) by 
+          Support (Services) by
           <a
             class="text-slate-400 hover:text-slate-500 dark:hover:text-slate-300 font-medium"
             target="_blank"
@@ -73,7 +74,6 @@
   </footer>
 </template>
 <script setup>
-
 const {
   project_authors,
   project_citation,
@@ -82,5 +82,4 @@ const {
   copyright_image,
   copyright_image_link
 } = __APP_ENV__
-
 </script>
diff --git a/src/components/Layout/LayoutHeader.vue b/src/components/Layout/LayoutHeader.vue
index 9167257..da0aef2 100644
--- a/src/components/Layout/LayoutHeader.vue
+++ b/src/components/Layout/LayoutHeader.vue
@@ -11,6 +11,8 @@
       >
         <img
           v-if="header_logo_url"
+          width="auto"
+          height="auto"
           class="mr-3 h-10"
           :src="header_logo_url"
           :alt="header_logo_text"
diff --git a/src/components/Navbar/NavbarMobile.vue b/src/components/Navbar/NavbarMobile.vue
index 6eb00d8..7ace3c1 100644
--- a/src/components/Navbar/NavbarMobile.vue
+++ b/src/components/Navbar/NavbarMobile.vue
@@ -2,8 +2,9 @@
   <button
     type="button"
     class="inline-flex items-center p-2 z-50 ml-3 text-sm text-primary-content rounded-lg md:hidden print:hidden"
+    title="Menu"
     aria-controls="mobile-menu"
-    aria-expanded="false"
+    :aria-expanded="isMenuVisible"
     @click="toggleMenu"
   >
     <span class="sr-only">Open main menu</span>
diff --git a/src/components/SwitchTheme.vue b/src/components/SwitchTheme.vue
index 3041234..58cf7c3 100644
--- a/src/components/SwitchTheme.vue
+++ b/src/components/SwitchTheme.vue
@@ -2,6 +2,7 @@
   <button
     type="button"
     @click="toggleTheme"
+    title="Toggle mode"
   >
     <svg
       v-if="themeMode === themeModes.dark"
diff --git a/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureCitations.vue b/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureCitations.vue
index 01dd40c..d0dac41 100644
--- a/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureCitations.vue
+++ b/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureCitations.vue
@@ -21,16 +21,20 @@
         :count="citationList.middle.length"
         @click="showAll = true"
       />
-      <AnimationOpacity>
-        <div v-show="showAll">
-          <CitationRow
-            v-for="citation in citationList.middle"
-            :key="citation.label"
-            :citation="citation"
-          />
-        </div>
-      </AnimationOpacity>
-
+    </ul>
+    <AnimationOpacity>
+      <ul
+        class="text-sm"
+        v-show="showAll"
+      >
+        <CitationRow
+          v-for="citation in citationList.middle"
+          :key="citation.label"
+          :citation="citation"
+        />
+      </ul>
+    </AnimationOpacity>
+    <ul class="text-sm">
       <CitationRow
         v-for="citation in citationList.last"
         :key="citation.label"
diff --git a/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureShowMore.vue b/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureShowMore.vue
index 67d9f13..0ef988a 100644
--- a/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureShowMore.vue
+++ b/src/modules/otus/components/Panel/PanelNomenclature/PanelNomenclatureShowMore.vue
@@ -1,6 +1,6 @@
 <template>
-  <div
-    class="flex justify-start border-b p-3 px-4 last:border-b-0 cursor-pointer border-base-muted"
+  <li
+    class="flex justify-start border-b p-3 px-4 cursor-pointer border-base-muted"
   >
     <div
       class="h-5 w-5 text-secondary-color opacity-60 mr-2 cursor-pointer"
@@ -9,7 +9,7 @@
       <IconPlusCircle class="h-5 w-5" />
     </div>
     <span>... Show all ... ({{ count }})</span>
-  </div>
+  </li>
 </template>
 
 <script setup>
diff --git a/src/utils/getMeta.js b/src/utils/getMeta.js
index 28fedf0..c306fe3 100644
--- a/src/utils/getMeta.js
+++ b/src/utils/getMeta.js
@@ -7,7 +7,8 @@ export function getMetaFromConfig(configObj) {
     const metaKey = key.slice(5)
 
     return {
-      [metaKey]: value
+      name: metaKey,
+      content: value
     }
   })
 }