feat(frontend): restore Zibll-like global search panel
Render full search overlay with types/history/suggestions for tabbar and desktop header toggle. Open panel on all viewports (not mobile-only) and wire data-toggle-class/.navbar-search compatibility hooks.
This commit is contained in:
@@ -301,3 +301,44 @@ html.dark .footer-tabbar {
|
||||
.site-footer--compact .site-footer__brand {
|
||||
flex: 1 1 100%;
|
||||
}
|
||||
|
||||
|
||||
/* Full-viewport search panel open state (desktop + mobile) */
|
||||
.tabbar-search-overlay[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
.tabbar-search-overlay.is-open,
|
||||
.tabbar-search-overlay.show:not([hidden]) {
|
||||
display: flex;
|
||||
}
|
||||
.tabbar-search-overlay__dialog {
|
||||
max-width: 720px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.tabbar-search-overlay {
|
||||
align-items: flex-start;
|
||||
padding-top: 8vh;
|
||||
background: rgba(15, 23, 42, 0.45);
|
||||
}
|
||||
.tabbar-search-overlay__dialog {
|
||||
min-height: auto;
|
||||
max-height: min(84vh, 860px);
|
||||
overflow: auto;
|
||||
border-radius: 20px;
|
||||
box-shadow: var(--shadow-lg, 0 20px 50px rgba(15, 23, 42, 0.22));
|
||||
}
|
||||
.nav-searchbox--desktop {
|
||||
display: none;
|
||||
}
|
||||
.main-search-btn.nav-search-toggle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767.98px) {
|
||||
.main-search-btn.nav-search-toggle {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user