38 lines
1.2 KiB
JavaScript
38 lines
1.2 KiB
JavaScript
const menuButton = document.querySelector('.menu-button');
|
|
const navigation = document.querySelector('#site-nav');
|
|
|
|
if (menuButton && navigation) {
|
|
const menuLabel = menuButton.querySelector('.sr-only');
|
|
const desktopViewport = window.matchMedia('(min-width: 761px)');
|
|
|
|
const setMenuState = (isOpen) => {
|
|
navigation.classList.toggle('open', isOpen);
|
|
menuButton.setAttribute('aria-expanded', String(isOpen));
|
|
if (menuLabel) menuLabel.textContent = isOpen ? 'Close navigation' : 'Open navigation';
|
|
};
|
|
|
|
menuButton.addEventListener('click', () => {
|
|
setMenuState(!navigation.classList.contains('open'));
|
|
});
|
|
|
|
navigation.querySelectorAll('a').forEach((link) => {
|
|
link.addEventListener('click', () => setMenuState(false));
|
|
});
|
|
|
|
document.addEventListener('keydown', (event) => {
|
|
if (event.key === 'Escape' && navigation.classList.contains('open')) {
|
|
setMenuState(false);
|
|
menuButton.focus();
|
|
}
|
|
});
|
|
|
|
desktopViewport.addEventListener('change', (event) => {
|
|
if (event.matches) setMenuState(false);
|
|
});
|
|
|
|
setMenuState(false);
|
|
}
|
|
|
|
const year = document.querySelector('#year');
|
|
if (year) year.textContent = new Date().getFullYear();
|