min height for nav bar 2 on desktop (#479)

gobitfly · Jun 14, 2024 · 0210d94 · 0210d94
1 parent 3b32571
commit 0210d94
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 4 deletions.
diff --git a/frontend/assets/css/prime_megamenu.scss b/frontend/assets/css/prime_megamenu.scss
@@ -1,5 +1,4 @@
 .p-megamenu {
-  padding: 8px 0 8px 8px;
   background: var(--container-background);
   user-select: none;
   z-index: 1;  // without this, the menu keeps a very high z-index when it is open in mobile mode and then the window is enlarged (the change of mode closes the menu but does not reset its z-index, so the menu bar floats above the search bar)
@@ -37,7 +36,7 @@
     min-width: fit-content;
     right: 0;
     left: auto;
-    top: var(--navbar2-height);
+    top: calc(var(--navbar2-height) - 7px);
     border-radius: var(--border-radius);
   }
   .p-submenu-header {

diff --git a/frontend/assets/css/variables.scss b/frontend/assets/css/variables.scss
@@ -2,7 +2,7 @@
   --border-radius: 4px;
 
   --navbar-height: 50px;
-  --navbar2-height: 61px;
+  --navbar2-height: 56px;
 
   --padding-xl: 32px;
   --padding-large: 20px;

diff --git a/frontend/components/bc/header/MainHeader.vue b/frontend/components/bc/header/MainHeader.vue
@@ -164,7 +164,7 @@ $smallHeaderThreshold: 1024px;
     position: relative;
     display: grid;
     grid-template-columns: 0px min-content min-content auto min-content 0px;  // the 0px are paddings, useless now but they exist in the structure of the grid so ready to be set if they are wanted one day
-    grid-template-rows: var(--navbar-height) min-content;
+    grid-template-rows: var(--navbar-height) minmax(var(--navbar2-height), min-content);
     @media (max-width: $smallHeaderThreshold) {
       grid-template-columns: 0px min-content auto min-content 0px;  // same remark about the 0px
       grid-template-rows: var(--navbar-height) min-content;