Refine shared header language selector

2026-09-15 12:34:26 +02:00
parent 50bf79965f
commit 52a48cacb9
8 changed files with 135 additions and 42 deletions
@@ -0,0 +1,24 @@
+/* Native details/summary provides keyboard activation and expanded state. */
+(() => {
+    const selector = '.language-switch, .header-controls .user-menu';
+    document.addEventListener('toggle', event => {
+        if (!event.target.matches(selector) || !event.target.open) return;
+        document.querySelectorAll(selector).forEach(menu => {
+            if (menu !== event.target) menu.open = false;
+        });
+    }, true);
+    document.addEventListener('click', event => {
+        document.querySelectorAll(selector).forEach(menu => {
+            if (menu.open && !menu.contains(event.target)) menu.open = false;
+        });
+    });
+    document.addEventListener('keydown', event => {
+        if (event.key !== 'Escape') return;
+        document.querySelectorAll(selector).forEach(menu => {
+            if (!menu.open) return;
+            menu.open = false;
+            menu.querySelector('summary').focus();
+            event.preventDefault();
+        });
+    });
+})();