diff --git a/assets/component-mega-menu.css b/assets/component-mega-menu.css index 2ef7ac2856b..39129b5c47c 100644 --- a/assets/component-mega-menu.css +++ b/assets/component-mega-menu.css @@ -48,6 +48,7 @@ padding-top: 0.6rem; text-decoration: none; transition: text-decoration var(--duration-short) ease; + word-wrap: break-word; } .mega-menu__link--level-2 { @@ -55,7 +56,7 @@ } .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 index c8c2b554b37..b488ce3f891 100644 --- 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 index 6fc6707c8c0..3c29c6ad611 100644 --- 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`); }