Fix sidebar dropdown direction and accidental mobile drawer opening

- CSS: When sidebar is collapsed, open user-menu dropdown to the right
  (left: 0, right: auto) via data-sidebar-expanded="false" selector.
- JS: Guard drawerToggle change handler – prevent mobile drawer from
  opening on desktop viewports (window.innerWidth >= 1024).
- HTML: Add phx-update="ignore" to mobile-drawer checkbox to prevent
  LiveView from resetting its checked state on DOM patches.
This commit is contained in:
Moritz 2026-02-24 10:34:29 +01:00
parent 97fcae3e9d
commit c637b6b84f
Signed by: moritz
GPG key ID: 1020A035E5DD0824
3 changed files with 20 additions and 1 deletions

View file

@ -228,6 +228,13 @@ document.addEventListener("DOMContentLoaded", () => {
// Listen for changes to the drawer checkbox
drawerToggle.addEventListener("change", () => {
// On desktop (lg:drawer-open), the mobile drawer must never open.
// The hamburger label is lg:hidden, but guard here as a safety net
// against any accidental toggles (e.g. from overlapping elements or JS).
if (drawerToggle.checked && window.innerWidth >= 1024) {
drawerToggle.checked = false
return
}
const isOpen = drawerToggle.checked
updateAriaExpanded()
updateSidebarTabIndex(isOpen)