From 590122db45ea45fdf106c01584078a135b913b8a Mon Sep 17 00:00:00 2001
From: druid <druid@druids-MBP-2.lan>
Date: Fri, 15 Jan 2021 12:19:51 +0200
Subject: [PATCH] hide is-active-trail underlining when panel is shown
---
.../hy-desktop-menu-links.scss | 3 +++
.../hy-desktop-menu-links.tsx | 16 ++++++++++++++++
2 files changed, 19 insertions(+)
diff --git a/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.scss b/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.scss
index e0f2acc0..df0cb587 100644
--- a/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.scss
+++ b/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.scss
@@ -72,6 +72,9 @@
right: 0;
width: 100%;
}
+ &--is-active-trail--disabled::after {
+ border: none;
+ }
}
hy-icon {
diff --git a/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.tsx b/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.tsx
index 6d450fd2..3e7ac2be 100644
--- a/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.tsx
+++ b/src/components/site-header/hy-desktop-menu-links/hy-desktop-menu-links.tsx
@@ -91,6 +91,14 @@ export class HyDesktopMenuLinks {
}
activeMenuItemSibling.setAttribute('aria-hidden', 'false');
+ //Hide is-active-trail underlining
+ const activeTrailMenuItem = this.el.shadowRoot.querySelector(
+ `.desktop-menu-link__label--is-active-trail`
+ ) as HTMLElement;
+ if (activeTrailMenuItem) {
+ activeTrailMenuItem.classList.add('desktop-menu-link__label--is-active-trail--disabled');
+ }
+
// Add panels top value automatically with the correct header height
const headerHeight = `${
this.el.parentElement.offsetTop + this.el.parentElement.offsetHeight + this._headerBorderOffset
@@ -141,6 +149,14 @@ export class HyDesktopMenuLinks {
// Return focus to the button of the last desktop panel that was active.
if (activeMenuItem !== null) activeMenuItem.focus();
+ //Show is-active-trail underlining
+ const activeTrailMenuItem = this.el.shadowRoot.querySelector(
+ `.desktop-menu-link__label--is-active-trail`
+ ) as HTMLElement;
+ if (activeTrailMenuItem) {
+ activeTrailMenuItem.classList.remove('desktop-menu-link__label--is-active-trail--disabled');
+ }
+
// Reset elements by removing the active classes.
menuItems.forEach((item) => {
item.classList.remove('desktop-menu-link--is-active');
--
GitLab