Top menu with show options V4
This commit is contained in:
parent
5eae0d3b2b
commit
418c2375e7
@ -214,12 +214,18 @@ window.onload = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (dropdown && dropdownContent && showMenuBtn) {
|
if (dropdown && dropdownContent && showMenuBtn) {
|
||||||
dropdown.addEventListener('mouseenter', openMenu);
|
showMenuBtn.onclick = (e) => {
|
||||||
dropdown.addEventListener('mouseleave', closeMenu);
|
e.stopPropagation();
|
||||||
showMenuBtn.addEventListener('focus', openMenu);
|
dropdown.classList.toggle('open');
|
||||||
showMenuBtn.addEventListener('blur', closeMenu);
|
};
|
||||||
|
// Close menu when clicking elsewhere
|
||||||
|
document.addEventListener('click', (e) => {
|
||||||
|
if (!dropdown.contains(e.target)) {
|
||||||
|
dropdown.classList.remove('open');
|
||||||
}
|
}
|
||||||
if (showAll) showAll.onclick = () => { matchViewMode = 'all'; renderTable(); closeMenu(); };
|
});
|
||||||
if (showFuture) showFuture.onclick = () => { matchViewMode = 'future'; renderTable(); closeMenu(); };
|
}
|
||||||
|
if (showAll) showAll.onclick = () => { matchViewMode = 'all'; renderTable(); if (dropdown) dropdown.classList.remove('open'); };
|
||||||
|
if (showFuture) showFuture.onclick = () => { matchViewMode = 'future'; renderTable(); if (dropdown) dropdown.classList.remove('open'); };
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|||||||
@ -66,10 +66,7 @@
|
|||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
.menu-bar .dropdown:hover .dropdown-content,
|
.menu-bar .dropdown.open .dropdown-content {
|
||||||
.menu-bar .dropdown:focus-within .dropdown-content,
|
|
||||||
.menu-bar .dropdown .dropdown-content:focus,
|
|
||||||
.menu-bar .dropdown .dropdown-content:active {
|
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
pointer-events: auto;
|
pointer-events: auto;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user