fix hove font weight on icon to correct color (#1072)

chillenberger · web-flow · commit 6d16d13efbb1 · 2023-10-12T16:32:44.000-06:00
diff --git a/pgml-dashboard/static/css/scss/components/_navs.scss b/pgml-dashboard/static/css/scss/components/_navs.scss
@@ -199,19 +199,31 @@
     &:hover {
         background-color: #{$gray-700};
         color: #{$gray-100};
-        @include semibold_by_shadow($gray-100)
+        
+        span:not(.material-symbols-outlined) {
+            @include semibold_by_shadow($gray-100)
+        }
+        span.material-symbols-outlined {
+            @include bold_by_shadow($neon-shade-300)
+        }
     }
     
     &:active, :focus, :target, .active {
         background-color: #{$neon-tint-100};
         color: #{$gray-100};
         border-radius: calc($border-radius / 2);
-        
+
         span {
             color: #{$gray-100};
         }
     }
 
+    &:hover a.active {
+        span.material-symbols-outlined {
+            @include bold_by_shadow($gray-100)
+        }
+    }
+
     & a.disabled, .disabled>span, &.disabled {
         color: #{$gray-500};
         pointer-events: none;
