Adjustments from code review

Shopify · Mar 29, 2022 · 2cf7a95 · 2cf7a95
1 parent 0e44a65
commit 2cf7a95
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 1 deletion.
diff --git a/assets/component-mega-menu.css b/assets/component-mega-menu.css
@@ -48,14 +48,15 @@
   padding-top: 0.6rem;
   text-decoration: none;
   transition: text-decoration var(--duration-short) ease;
+  word-wrap: break-word;
 }
 
 .mega-menu__link--level-2 {
   font-size: 1.4rem;
 }
 
 .mega-menu__link--level-2:not(:only-child) {
-  margin-bottom: 1rem;
+  margin-bottom: 0.8rem;
 }
 
 .header--top-center .mega-menu__list {

diff --git a/assets/component-menu-drawer.css b/assets/component-menu-drawer.css
@@ -198,6 +198,7 @@ details[open].menu-opening > .menu-drawer__submenu {
   background-color: transparent;
   font-family: var(--font-body-family);
   font-style: var(--font-body-style);
+  text-align: left;
 }
 
 .no-js .menu-drawer__close-button {

diff --git a/assets/details-disclosure.js b/assets/details-disclosure.js
@@ -39,6 +39,8 @@ class HeaderMenu extends DetailsDisclosure {
   }
 
   onToggle() {
+    document.body.classList.toggle('overflow-hidden', this.querySelectorAll('.mega-menu[open]').length);
+
     if (document.documentElement.style.getPropertyValue('--header-bottom-position-desktop') !== '') return;
     if (this.header) document.documentElement.style.setProperty('--header-bottom-position-desktop', `${Math.floor(this.header.getBoundingClientRect().bottom)}px`);
   }