From a77ee62f8e9634dde4a0ef75fd20a354476caec8 Mon Sep 17 00:00:00 2001
From: sboursen-scinote <soufiane@scinote.net>
Date: Fri, 26 May 2023 11:19:27 +0200
Subject: [PATCH] Fix hover effect depending on the type of the navigator link
 [SCI-8509]

Co-authored-by: Sboursen <dev.sboursen@gmail.com>
---
 app/assets/stylesheets/navigation/navigator.scss | 16 +++++++++++++++-
 app/javascript/vue/navigation/navigator_item.vue |  7 +++++--
 2 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/navigation/navigator.scss b/app/assets/stylesheets/navigation/navigator.scss
index 4c524e64e..4eca5b903 100644
--- a/app/assets/stylesheets/navigation/navigator.scss
+++ b/app/assets/stylesheets/navigation/navigator.scss
@@ -2,8 +2,22 @@
   .menu-item:not(.active):hover {
     background-color: var(--sn-super-light-grey);
 
-    a {
+    a:not(.no-hover) {
       color: var(--sn-blue);
     }
+
+    a.no-hover {
+      color: var(--sn-science-blue-hover);
+    }
+  }
+
+  .menu-item.active:hover {
+    a:not(.no-hover) {
+      color: var(--sn-blue);
+    }
+
+    a.no-hover {
+      color: var(--sn-science-blue-hover);
+    }
   }
 }
diff --git a/app/javascript/vue/navigation/navigator_item.vue b/app/javascript/vue/navigation/navigator_item.vue
index 79b01fb08..89bcede1b 100644
--- a/app/javascript/vue/navigation/navigator_item.vue
+++ b/app/javascript/vue/navigation/navigator_item.vue
@@ -1,6 +1,8 @@
 <template>
   <div class="text-sn-blue max-w-[196px] flex justify-center flex-col"
-       :class="{ 'pl-6': !firstLevel }"
+       :class="{
+         'pl-6': !firstLevel
+       }"
        :navigator-item-id="item.id"
   >
     <div class="py-1.5 px-1 menu-item flex items-center whitespace-nowrap" :title="this.itemToolTip" :class="{ 'bg-sn-light-grey active': activeItem }">
@@ -14,7 +16,8 @@
       <a :href="item.url"
           class="text-ellipsis overflow-hidden hover:no-underline pr-3"
           :class="{
-            'text-sn-science-blue-hover': (!item.archived && archived)
+            'text-sn-science-blue-hover': (!item.archived && archived),
+            'no-hover': (!item.archived && archived)
           }">
         <template v-if="item.archived">(A)</template>
         {{ item.name }}