diff --git a/package-lock.json b/package-lock.json index 007f9d3..f75faf9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3180,9 +3180,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001564", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001564.tgz", - "integrity": "sha512-DqAOf+rhof+6GVx1y+xzbFPeOumfQnhYzVnZD6LAXijR77yPtm9mfOcqOnT3mpnJiZVT+kwLAFnRlZcIz+c6bg==", + "version": "1.0.30001690", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001690.tgz", + "integrity": "sha512-5ExiE3qQN6oF8Clf8ifIDcMRCRE/dMGcETG/XGMD8/XiXm6HXQgQTh1yZYLXXpSOsEUlJm1Xr7kGULZTuGtP/w==", "dev": true, "funding": [ { @@ -10856,9 +10856,9 @@ "dev": true }, "caniuse-lite": { - "version": "1.0.30001564", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001564.tgz", - "integrity": "sha512-DqAOf+rhof+6GVx1y+xzbFPeOumfQnhYzVnZD6LAXijR77yPtm9mfOcqOnT3mpnJiZVT+kwLAFnRlZcIz+c6bg==", + "version": "1.0.30001690", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001690.tgz", + "integrity": "sha512-5ExiE3qQN6oF8Clf8ifIDcMRCRE/dMGcETG/XGMD8/XiXm6HXQgQTh1yZYLXXpSOsEUlJm1Xr7kGULZTuGtP/w==", "dev": true }, "chalk": { diff --git a/site/layouts/partials/nav.html b/site/layouts/partials/nav.html index 1bf64f2..12fe03e 100644 --- a/site/layouts/partials/nav.html +++ b/site/layouts/partials/nav.html @@ -1,8 +1,8 @@ -
-
+ - + diff --git a/site/layouts/partials/template/nav-sponsor.html b/site/layouts/partials/template/nav-sponsor.html index a9743ed..82097e0 100644 --- a/site/layouts/partials/template/nav-sponsor.html +++ b/site/layouts/partials/template/nav-sponsor.html @@ -1,8 +1,5 @@ -
-
Nos partenaires
- +
\ No newline at end of file +
  • Tous nos partenaires
    • +
  • Soutenez Paris Web
    • + diff --git a/site/layouts/partials/template/nav.html b/site/layouts/partials/template/nav.html index f384313..6716910 100644 --- a/site/layouts/partials/template/nav.html +++ b/site/layouts/partials/template/nav.html @@ -1,8 +1,8 @@ -
    -
    + - \ No newline at end of file + diff --git a/src/js/pages/nav.js b/src/js/pages/nav.js index 1a3bcb4..16f2e78 100644 --- a/src/js/pages/nav.js +++ b/src/js/pages/nav.js @@ -1,5 +1,6 @@ import debounce from "../util/debounce"; -import throttle from "../util/throttle"; + +const breakpoint = window.matchMedia('(max-width: 68em'); const getFocusableElementsWithin = target => target.querySelectorAll( @@ -111,48 +112,26 @@ const listenButtons = () => { } }; -const listenIntersection = (element, callback) => { - const simulateIntersectionObserver = () => { - const offsetTop = element.offsetTop; - const windowHeight = window.innerHeight; - callback({ isIntersecting: window.scrollY > offsetTop - windowHeight }); - }; - - const throttledSimulateIntersectionObserver = throttle( - simulateIntersectionObserver, - 200 - ); - const debouncedSimulateIntersectionObserver = debounce( - simulateIntersectionObserver, - 50 - ); - - if ("IntersectionObserver" in window) { - const observer = new IntersectionObserver( - entries => { - const entry = entries.find(entry => entry.target === element); - callback(entry); - }, - { - threshold: 0 - } - ); - observer.observe(element); +const initModalDialog = (breakpoint) => { + const menu = document.querySelector('.menu__content'); + if (breakpoint.matches) { + Object.assign(menu, { + role: 'dialog', + ariaModal: 'true', + tabindex: '-1' + }); } else { - window.addEventListener("scroll", () => { - throttledSimulateIntersectionObserver(); - debouncedSimulateIntersectionObserver(); + ['role', 'aria-modal', 'tabindex'].forEach(attr => { + menu.removeAttribute(attr); }); } - - window.addEventListener("resize", () => { - throttledSimulateIntersectionObserver(); - debouncedSimulateIntersectionObserver(); - }); -}; +} const initNavigation = () => { + initModalDialog(breakpoint); listenButtons(); + + breakpoint.addEventListener("change", initModalDialog); }; export default initNavigation;