Merge pull request #221 from hlxsites/loginbtn

feat: enable display of login screen on click of login button in hamb…
RoronoaSrinu · May 2, 2023 · 0b99c1b · 0b99c1b
2 parents 05fc50a + ece958e
commit 0b99c1b
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/blocks/header/header.js b/blocks/header/header.js
@@ -44,6 +44,8 @@ function injectNavTools(nav, type) {
 }
 
 function addLoginEventListener(nav) {
+  // if this selector changes, modify the configureHamburgerLoginBtn
+  // function in nav-utils.js as well
   const loginButton = nav.querySelector('.nav-tools-login');
 
   if (loginButton) {

diff --git a/blocks/header/nav-utils.js b/blocks/header/nav-utils.js
@@ -122,6 +122,19 @@ export function toggleSearch() {
   document.body.classList.toggle('overflowY-hidden');
 }
 
+function configureHamburgerLoginBtn() {
+  const loginButton = document.querySelector('.nbd-hamburger-menu-wrapper .nbd-hamburger-menu-mob [data-target="#logincomp"]');
+  const actualLoginButton = document.querySelector('.nav-tools-login');
+  if (loginButton) {
+    // this attributes adds a click handler which disables any click events
+    // on this particular button. Hence removing the attribute
+    loginButton.removeAttribute('data-toggle');
+    loginButton.addEventListener('click', () => {
+      actualLoginButton.click();
+    });
+  }
+}
+
 export async function loadNavTools() {
   const resp = await fetch(getMetadata('nav'));
   if (resp.ok) {
@@ -181,6 +194,8 @@ export async function loadNavTools() {
       });
     }
 
+    configureHamburgerLoginBtn();
+
     appendStyles(doc);
   }
 }