fix: responsive mega menu
This commit is contained in:
+57
-8
@@ -2926,15 +2926,50 @@ a.citation-count-badge:hover {
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.nav-item.has-megamenu:hover .nav-arrow {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.nav-item.has-megamenu.open .nav-arrow {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.megamenu {
|
||||
position: static;
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
border: 1px solid var(--glass-border);
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
border-radius: var(--radius-md);
|
||||
transform: none;
|
||||
box-shadow: none;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.nav-item.has-megamenu:hover .megamenu {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
max-height: 0;
|
||||
pointer-events: none;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.nav-item.has-megamenu.open .megamenu {
|
||||
max-height: 2000px;
|
||||
overflow: visible;
|
||||
margin-top: 0.25rem;
|
||||
padding: 0;
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
border: 1px solid var(--glass-border);
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.megamenu-inner {
|
||||
@@ -2956,14 +2991,28 @@ a.citation-count-badge:hover {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.megamenu-product-item.has-subproducts .megamenu-sublist {
|
||||
max-height: none;
|
||||
opacity: 1;
|
||||
border-top-color: var(--glass-border);
|
||||
.megamenu-product-item.has-subproducts:hover .megamenu-sub-chevron,
|
||||
.megamenu-product-item.has-subproducts:focus-within .megamenu-sub-chevron {
|
||||
transform: none;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.nav-item.has-megamenu:hover .megamenu {
|
||||
transform: none;
|
||||
.megamenu-product-item.has-subproducts:hover .megamenu-sublist,
|
||||
.megamenu-product-item.has-subproducts:focus-within .megamenu-sublist {
|
||||
max-height: 0;
|
||||
opacity: 0;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
|
||||
.megamenu-product-item.has-subproducts.open .megamenu-sub-chevron {
|
||||
transform: rotate(180deg);
|
||||
color: var(--accent-blue-light);
|
||||
}
|
||||
|
||||
.megamenu-product-item.has-subproducts.open .megamenu-sublist {
|
||||
max-height: 320px;
|
||||
opacity: 1;
|
||||
border-top-color: var(--glass-border);
|
||||
}
|
||||
|
||||
.sub-product-grid {
|
||||
|
||||
Reference in New Issue
Block a user