diff --git a/src/components/LanguageSwitcher.astro b/src/components/LanguageSwitcher.astro index fdd5768..2d9b157 100644 --- a/src/components/LanguageSwitcher.astro +++ b/src/components/LanguageSwitcher.astro @@ -79,6 +79,28 @@ function globeStyle(l: Locale) { el.classList.toggle("open"); btn.setAttribute("aria-expanded", el.classList.contains("open") ? "true" : "false"); }); + + // Öffnet zusätzlich automatisch beim Drüberfahren mit der Maus (Desktop) — kein Klick mehr + // nötig. Kurze Schließverzögerung beim Verlassen, damit der Wechsel von Button zu Menü nicht + // sofort wieder zuklappt. Klick bleibt als Fallback für Touch-Geräte/Tastatur erhalten. + let closeTimer: ReturnType | null = null; + el.addEventListener("mouseenter", () => { + if (closeTimer) { clearTimeout(closeTimer); closeTimer = null; } + document.querySelectorAll(".lang-switch.open").forEach((other) => { + if (other !== el) { + other.classList.remove("open"); + other.querySelector(".lang-switch-btn")?.setAttribute("aria-expanded", "false"); + } + }); + el.classList.add("open"); + btn?.setAttribute("aria-expanded", "true"); + }); + el.addEventListener("mouseleave", () => { + closeTimer = setTimeout(() => { + el.classList.remove("open"); + btn?.setAttribute("aria-expanded", "false"); + }, 200); + }); }); document.addEventListener("click", () => { document.querySelectorAll(".lang-switch.open").forEach((el) => el.classList.remove("open")); diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 6cf32da..34b6c67 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -227,6 +227,23 @@ const p = (href: string) => `${localePrefix(lang)}${href}`; const open = menu?.classList.toggle("open"); menuBtn.setAttribute("aria-expanded", open ? "true" : "false"); }); + + // Öffnet zusätzlich automatisch beim Drüberfahren mit der Maus (Desktop) — kein Klick mehr + // nötig. Kurze Schließverzögerung beim Verlassen, damit der Wechsel von Button zu Menü nicht + // sofort wieder zuklappt. Klick bleibt als Fallback für Touch-Geräte/Tastatur erhalten. + let accountCloseTimer: ReturnType | null = null; + menu?.addEventListener("mouseenter", () => { + if (accountCloseTimer) { clearTimeout(accountCloseTimer); accountCloseTimer = null; } + menu.classList.add("open"); + menuBtn?.setAttribute("aria-expanded", "true"); + }); + menu?.addEventListener("mouseleave", () => { + accountCloseTimer = setTimeout(() => { + menu.classList.remove("open"); + menuBtn?.setAttribute("aria-expanded", "false"); + }, 200); + }); + document.addEventListener("click", () => { menu?.classList.remove("open"); menuBtn?.setAttribute("aria-expanded", "false");