- Syne + IBM Plex Mono, bordures épaisses, ombres décalées - Accueil type polaroid + stickers + bandeau sombre - Nav sticky, menu mobile, pied de page assorti - Pages intérieures dans cadre blanc contrasté Made-with: Cursor
43 lines
1.3 KiB
JavaScript
43 lines
1.3 KiB
JavaScript
(function () {
|
|
var nav = document.getElementById("cp-nav");
|
|
if (!nav) return;
|
|
var toggle = document.getElementById("cp-nav-toggle");
|
|
var mq = window.matchMedia("(max-width: 51.99rem)");
|
|
|
|
function setOpen(open) {
|
|
nav.classList.toggle("is-open", open);
|
|
if (toggle) {
|
|
toggle.setAttribute("aria-expanded", open ? "true" : "false");
|
|
toggle.setAttribute("aria-label", open ? "Fermer le menu" : "Ouvrir le menu");
|
|
}
|
|
}
|
|
|
|
if (toggle) {
|
|
toggle.addEventListener("click", function () {
|
|
var next = !nav.classList.contains("is-open");
|
|
setOpen(next);
|
|
if (next) {
|
|
var first = nav.querySelector(".cp-nav-list a");
|
|
if (first) requestAnimationFrame(function () { first.focus(); });
|
|
}
|
|
});
|
|
}
|
|
|
|
document.addEventListener("keydown", function (e) {
|
|
if (e.key === "Escape" && nav.classList.contains("is-open")) {
|
|
setOpen(false);
|
|
if (toggle) toggle.focus();
|
|
}
|
|
});
|
|
|
|
nav.querySelectorAll(".cp-nav-list a").forEach(function (a) {
|
|
a.addEventListener("click", function () {
|
|
if (mq.matches) setOpen(false);
|
|
});
|
|
});
|
|
|
|
mq.addEventListener("change", function (ev) {
|
|
if (!ev.matches) setOpen(false);
|
|
});
|
|
})();
|