Simplify approach for both mobile/desktop

hlxsites · Feb 14, 2025 · 633157c · 633157c
1 parent 036d968
commit 633157c
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 16 deletions.
diff --git a/blocks/header/header.css b/blocks/header/header.css
@@ -567,15 +567,14 @@ header nav .nav-sections .active-submenu {
     padding: 0 2em 1em;
     position: relative;
     text-align: left;
-    width: 120%;
+    width: 115%;
   }
 
   header nav .nav-sections .active-submenu span.back {
     position: absolute;
     right: 3em;
   }
 
-
   header nav .nav-sections .active-submenu ul > li.nav-drop::after {
     content: none;
   }

diff --git a/blocks/header/header.js b/blocks/header/header.js
@@ -125,21 +125,16 @@ activeSubmenu.innerHTML = `
     <h6>Title</h6><ul><li class="nav-drop"></li></ul>
 `;
 
+/**
+ * Sets up the menu for mobile
+ * @param {navSection} navSection The nav section element
+ */
 function setupMobileMenu(navSection) {
   if (!isDesktop.matches && navSection.querySelector('ul')) {
-    const checkboxId = `nav-checkbox-${Math.random()
-      .toString(36)
-      .substr(2, 9)}`;
     let label;
     if (navSection.childNodes.length) {
       [label] = navSection.childNodes;
-      navSection.childNodes[0].remove();
     }
-    const submenuToggle = document.createRange()
-      .createContextualFragment(
-        `<label for="${checkboxId}" class="nav-toggle">${label.textContent}</label>
-            <input type="checkbox"  id="${checkboxId}" />`,
-      );
 
     const subMenu = navSection.querySelector('ul');
     const clonedSubMenu = subMenu.cloneNode(true);
@@ -150,7 +145,6 @@ function setupMobileMenu(navSection) {
       activeSubmenu.querySelector('li')
         .append(clonedSubMenu);
     });
-    navSection.prepend(submenuToggle);
   }
 }
 
@@ -338,7 +332,3 @@ export default async function decorate(block) {
   );
   renderAuthDropdown(navTools);
 }
-
-window.addEventListener('resize', () => {
-  window.location.reload();
-});