feat: highlight selected navbar item

clicepfl · Apr 12, 2024 · 126ffb6 · 126ffb6
1 parent b4fbf6d
commit 126ffb6
Showing 1 changed file with 17 additions and 13 deletions.
diff --git a/app/src/styles/NavigationBar.module.scss b/app/src/styles/NavigationBar.module.scss
@@ -74,24 +74,23 @@
         }
       }
 
+      &.selected {
+        background-color: variables.$dark-text-color;
+        padding: 0.5rem;
+        border-radius: 2rem;
+
+        &:hover {
+          color: variables.$text-color;
+          .arrow {
+            border-color: variables.$text-color;
+          }
+        }
+      }
       @media (max-width: 800px) {
         display: none;
       }
     }
 
-    .selected {
-      background-color: variables.$dark-text-color;
-      padding: 0.5rem;
-      border-radius: 2rem;
-
-      &:hover {
-        color: variables.$text-color;
-        .arrow {
-          border-color: variables.$text-color;
-        }
-      }
-    }
-
     .dropdownHead {
       display: flex;
       justify-content: center;
@@ -134,6 +133,11 @@
           &:hover {
             background-color: variables.$glass-color-hover;
           }
+
+          &.selected {
+            border-radius: 0;
+            background-color: variables.$glass-color-hover;
+          }
         }
       }