fix(nav): stop Bootstrap .collapse from hiding desktop top bar
Markup used `collapse navbar-collapse`; BS5 hides `.collapse:not(.show)`. Drop the `.collapse` class in the header shell and force desktop `.navbar-collapse` to display:flex so menu/CTA/user/search stay visible.
This commit is contained in:
@@ -105,18 +105,27 @@ body.mobile-navbar-show { overflow: hidden; }
|
|||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
.navbar-collapse {
|
/* Beat Bootstrap 5 `.collapse:not(.show){display:none}` if legacy markup still
|
||||||
display: flex;
|
carries both classes. Desktop top bar is always a flex row. */
|
||||||
|
.navbar-top .navbar-collapse,
|
||||||
|
.navbar.navbar-top .collapse.navbar-collapse {
|
||||||
|
display: flex !important;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
|
visibility: visible;
|
||||||
|
height: auto;
|
||||||
|
overflow: visible;
|
||||||
}
|
}
|
||||||
.navbar-header { display: flex; align-items: center; flex-shrink: 0; }
|
.navbar-header { display: flex; align-items: center; flex-shrink: 0; }
|
||||||
.navbar-top .navbar-toggle { display: none; background: none; border: 0; color: inherit; }
|
.navbar-top .navbar-toggle { display: none; background: none; border: 0; color: inherit; }
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.navbar-top .navbar-toggle { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; }
|
.navbar-top .navbar-toggle { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; }
|
||||||
.navbar-collapse { display: none; }
|
.navbar-top .navbar-collapse,
|
||||||
|
.navbar.navbar-top .collapse.navbar-collapse {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Senior submenu full width under fixed header */
|
/* Senior submenu full width under fixed header */
|
||||||
|
|||||||
@@ -169,7 +169,10 @@ $nav_style = '';
|
|||||||
|
|
||||||
aksrt_navbar_header($ctx);
|
aksrt_navbar_header($ctx);
|
||||||
|
|
||||||
echo '<div class="collapse navbar-collapse">';
|
// Do NOT use Bootstrap's `.collapse` here — BS5 hides `.collapse:not(.show)`
|
||||||
|
// which would wipe the whole PC top bar (menu / CTA / user / search).
|
||||||
|
// Zibll uses a plain `.navbar-collapse` flex row; mobile uses the drawer.
|
||||||
|
echo '<div class="navbar-collapse">';
|
||||||
if ('3' !== $layout) {
|
if ('3' !== $layout) {
|
||||||
aksrt_menu_items('primary', true);
|
aksrt_menu_items('primary', true);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user