Unverified Commit 00b0a6ed authored by lauriii's avatar lauriii

Issue #3180086 by mherchel, kishor_kolekar, ranjith_kumar_k_u, Scott Weston,...

Issue #3180086 by mherchel, kishor_kolekar, ranjith_kumar_k_u, Scott Weston, bnjmnm, lauriii, paulocs, andrewmacpherson, proeung: It should not be possible to have two dropdown menus appear at the same time within Olivero
parent eae5dcc8
......@@ -93,6 +93,9 @@
props.body.classList.remove('js-overlay-active');
props.body.classList.remove('js-fixed');
}
// Ensure that all sub-navigation menus close when the browser is resized.
Drupal.olivero.closeAllSubNav();
});
}
......
......@@ -65,6 +65,8 @@
props.body.classList.remove('js-overlay-active');
props.body.classList.remove('js-fixed');
}
Drupal.olivero.closeAllSubNav();
});
}
......
......@@ -11,15 +11,27 @@
* @param {boolean} [toState] - Optional state where we want the submenu to end up.
*/
function toggleSubNav(topLevelMenuITem, toState) {
const button = topLevelMenuITem.querySelector(
'.primary-nav__button-toggle, .primary-nav__menu-link--button',
);
const buttonSelector =
'.primary-nav__button-toggle, .primary-nav__menu-link--button';
const button = topLevelMenuITem.querySelector(buttonSelector);
const state =
toState !== undefined
? toState
: button.getAttribute('aria-expanded') !== 'true';
if (state) {
// If desktop nav, ensure all menus close before expanding new one.
if (isDesktopNav()) {
secondLevelNavMenus.forEach((el) => {
el.querySelector(buttonSelector).setAttribute(
'aria-expanded',
'false',
);
el.querySelector('.primary-nav__menu--level-2').classList.remove(
'is-active',
);
});
}
button.setAttribute('aria-expanded', 'true');
topLevelMenuITem
.querySelector('.primary-nav__menu--level-2')
......
......@@ -10,10 +10,18 @@
var secondLevelNavMenus = document.querySelectorAll('.primary-nav__menu-item--has-children');
function toggleSubNav(topLevelMenuITem, toState) {
var button = topLevelMenuITem.querySelector('.primary-nav__button-toggle, .primary-nav__menu-link--button');
var buttonSelector = '.primary-nav__button-toggle, .primary-nav__menu-link--button';
var button = topLevelMenuITem.querySelector(buttonSelector);
var state = toState !== undefined ? toState : button.getAttribute('aria-expanded') !== 'true';
if (state) {
if (isDesktopNav()) {
secondLevelNavMenus.forEach(function (el) {
el.querySelector(buttonSelector).setAttribute('aria-expanded', 'false');
el.querySelector('.primary-nav__menu--level-2').classList.remove('is-active');
});
}
button.setAttribute('aria-expanded', 'true');
topLevelMenuITem.querySelector('.primary-nav__menu--level-2').classList.add('is-active');
} else {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment