fix the burger menu icon

ImperialCollegeLondon · Dec 2, 2024 · 1aaa074 · 1aaa074
1 parent 90633e0
commit 1aaa074
Show file tree

Hide file tree

Showing 3 changed files with 52 additions and 85 deletions.
diff --git a/assets/less/site/collections/menu.overrides b/assets/less/site/collections/menu.overrides
@@ -39,21 +39,59 @@
     }
 }
 
-#rdm-burger-toggle {
-    font-size: 20px;
-    position: absolute;
-    right: -1.5rem;
-    top: calc(50%);
-    border: none;
-
-    #rdm-burger-menu-icon {
-        .navicon {
-            background: @primaryColor;
-            color: @primaryColor;
-            &:hover {
-                color: @black;
+.outer-navbar {
+    background-image: None;
+    background-color: transparent;
+    border-color: transparent;
+
+    #invenio-nav {
+        background: @white;
+        border-top: 2px solid @brandColor;
+        border-bottom: 2px solid @brandColor;
+        margin: 1rem 0;
+    }
+
+    a {
+        color: @primaryColor;
+    }
+
+    .header__nav-open#rdm-burger-menu-icon {
+        color: @navyBlue;
+        margin-inline-start: 1rem;
+        border-style: unset !important;
+        border-width: 0 !important;
+
+        span {
+            top: 1px;
+
+            &::before {
+                top: clamp(0.4375rem, 0.4016rem + 0.1795vw, 0.5625rem); // 7px -> 9px
+                transition: unset;
             }
+
+            &::after {
+                top: clamp(0.875rem, 0.8032rem + 0.3591vw, 1.125rem); // 14px -> 18px
+                transition: uset;
+            }
+        }
+
+        span,
+        span::before,
+        span::after {
+            background-color: @navyBlue;
         }
+
+        &:hover {
+
+            span,
+            span::before,
+            span::after {
+                left: 0px;
+                transform: none;
+                width: clamp(0.875rem, 1.1623rem, 1.125rem);
+                background-color: @darkGray;
+            }
+	    }
     }
 }
 

diff --git a/assets/less/site/elements/header.overrides b/assets/less/site/elements/header.overrides
@@ -34,20 +34,4 @@ aside.sidebar {
   h3.hidden {
     display: none;
   }
-}
-
-.ui.header  {
-  word-break: break-word;
-
-  &.text-muted {
-    color: @mutedTextColor;
-  }
-
-  .doi.sub.header {
-    display: inline-block;
-  }
-
-  &.highlight{
-    background-color:  @highlightBackgroundColor;
-  }
-}
+}
diff --git a/assets/less/site/globals/site.overrides b/assets/less/site/globals/site.overrides
@@ -154,61 +154,6 @@ html.cover-page {
     background-color: @white;
 }
 
-.outer-navbar {
-    background-image: None;
-    background-color: transparent;
-    border-color: transparent;
-
-    #invenio-nav {
-        background: @white;
-        border-top: 2px solid @brandColor;
-        border-bottom: 2px solid @brandColor;
-        margin: 1rem 0;
-    }
-
-    a {
-        color: @primaryColor;
-    }
-
-.header__nav-open {
-	color: var(--header-overlay-open-color);
-	margin-inline-start: $space-m;
-
-	span {
-		top: 1px;
-
-		&::before {
-			top: clamp(0.4375rem, 0.4016rem + 0.1795vw, 0.5625rem); // 7px -> 9px
-			transition: transform 0.2s;
-		}
-
-		&::after {
-			top: clamp(0.875rem, 0.8032rem + 0.3591vw, 1.125rem); // 14px -> 18px
-			transition: none;
-		}
-	}
-
-	span,
-	span::before,
-	span::after {
-		background-color: var(--header-overlay-open-color);
-	}
-
-	&:hover {
-		--header-overlay-open-color: #{$base-color};
-
-		.header__inner--inverse & {
-			--header-overlay-open-color: #{$base-light};
-		}
-
-		span::before {
-			left: 1px;
-			transform: rotate(90deg);
-			width: clamp(0.875rem, 0.8032rem + 0.3591vw, 1.125rem); // 14px -> 18px
-		}
-	}
-}
-
 .theme.header {
   box-shadow: None;
 }