Highlight menu group containing the active item

This commit is contained in:
Jeremy Stretch 2024-01-11 12:08:35 -05:00
parent 15385eeda5
commit f864fc6e22
3 changed files with 4 additions and 2 deletions

Binary file not shown.

Binary file not shown.

View File

@ -209,17 +209,19 @@ class SideNav {
const dropdownMenu = link.closest('.dropdown-menu') as Nullable<HTMLDivElement>; const dropdownMenu = link.closest('.dropdown-menu') as Nullable<HTMLDivElement>;
if (isElement(dropdownMenu)) { if (isElement(dropdownMenu)) {
// Find the closest `.nav-link`, which should be adjacent to the `.dropdown-menu` element. // Find the closest `.nav-link`, which should be adjacent to the `.dropdown-menu` element.
const groupItem = dropdownMenu.parentElement;
const groupLink = dropdownMenu.parentElement?.querySelector('.nav-link'); const groupLink = dropdownMenu.parentElement?.querySelector('.nav-link');
if (isElement(groupLink)) { if (isElement(groupLink) && isElement(groupItem)) {
groupLink.classList.add('active');
switch (action) { switch (action) {
case 'expand': case 'expand':
groupLink.setAttribute('aria-expanded', 'true'); groupLink.setAttribute('aria-expanded', 'true');
groupItem.classList.add('active');
dropdownMenu.classList.add('show'); dropdownMenu.classList.add('show');
link.classList.add('active'); link.classList.add('active');
break; break;
case 'collapse': case 'collapse':
groupLink.setAttribute('aria-expanded', 'false'); groupLink.setAttribute('aria-expanded', 'false');
groupItem.classList.remove('active');
dropdownMenu.classList.remove('show'); dropdownMenu.classList.remove('show');
link.classList.remove('active'); link.classList.remove('active');
break; break;