diff --git a/resources/js/menus.js b/resources/js/menus.js index 221646f..54bdee2 100644 --- a/resources/js/menus.js +++ b/resources/js/menus.js @@ -26,12 +26,41 @@ export default function menuInit() { footer.querySelector('.sub-menu--open') !== null ); } + function isFooterSubmenu(buttonToggle) { + let currentElement = buttonToggle; + + for (let i = 0; i < 6; i++) { + currentElement = currentElement.parentElement; + + // Vérifiez si l'élément actuel est un menu-renovateur--footer + + if (currentElement.classList.contains('menu-renovateur--footer')) { + console.log(`FOUND IT !`); + + return true; // Si trouvé, retournez true + } + // Arrêtez la boucle si l'élément actuel est null (pas plus de parents) + if (!currentElement) { + break; + } + } + return false; + // return buttonToggle.parentElement.parentElement.parentElement.parentElement.classList.contains( + // 'menu-renovateur--footer' + // ); + } function openSubmenu(buttonToggle) { let isExpanded = buttonToggle.getAttribute('aria-expanded') === 'true'; + const submenu = buttonToggle.parentElement.querySelector('.sub-menu'); buttonToggle.setAttribute('aria-expanded', !isExpanded); - buttonToggle.parentElement.querySelector('.sub-menu').classList.toggle('sub-menu--open'); - buttonToggle.parentElement.querySelector('.sub-menu').classList.toggle('sub-menu--closed'); + + submenu.classList.toggle('sub-menu--open'); + submenu.classList.toggle('sub-menu--closed'); + + if (isFooterSubmenu(buttonToggle)) { + submenu.parentElement.parentElement.style.marginBottom = submenu.clientHeight + 'px'; + } } function closeSubmenus() { const headerOpenSubmenus = header.querySelectorAll('.sub-menu--open'); @@ -49,6 +78,7 @@ export default function menuInit() { submenu.parentElement .querySelector('.menu-item__submenu-toggle') .setAttribute('aria-expanded', 'false'); + submenu.parentElement.parentElement.style.marginBottom = '0px'; }); } @@ -64,8 +94,6 @@ export default function menuInit() { } function closeCurrentSubmenu(buttonClose) { - // console.log('close submenu'); - // console.log(buttonClose.parentElement); const currentOpenedSubmenu = buttonClose.parentElement; currentOpenedSubmenu.classList.remove('sub-menu--open'); @@ -73,7 +101,11 @@ export default function menuInit() { currentOpenedSubmenu.parentElement .querySelector('.menu-item__submenu-toggle') .setAttribute('aria-expanded', 'false'); + if (isFooterSubmenu(buttonClose)) { + currentOpenedSubmenu.parentElement.parentElement.style.marginBottom = '0px'; + } } + // ###HEADER — SUBMENU TOGGGLES open/close headerSubmenuToggles.forEach((button) => { button.addEventListener('click', () => { @@ -285,7 +317,6 @@ export default function menuInit() { } }); - /* ----------------------------------------------------------- HANDLE FOCUS CHANGE -----------------------------------------------------------*/