Ensure that nav-drop item takes full height to prevent unintentional …

…mouseover/mouseleave events (#179) Co-authored-by: Satya Deep Maheshwari <[email protected]>
RoronoaSrinu · Apr 5, 2023 · 92f5ce5 · 92f5ce5
1 parent c5ef062
commit 92f5ce5
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/blocks/header/header.css b/blocks/header/header.css
@@ -132,7 +132,9 @@ header secondary-nav .nav-sections {
   display: none;
 }
 header secondary-nav .nav-sections > ul > li.nav-drop {
+  height: var(--nav-height);
   position: relative;
+  padding-top: 16px;
 }
 header secondary-nav .nav-sections > ul > li.nav-drop:first-child {
   font-family: 'Libre Franklin', Arial, Helvetica, sans-serif;
@@ -349,6 +351,8 @@ header .sticky {
     display: none;
   }
   header secondary-nav .nav-sections > ul > li:not(:first-child) {
+    height: var(--nav-height);
+    padding-top: 16px;
     display: unset;
   }
   header secondary-nav .nav-sections > ul > li > a::after {

diff --git a/blocks/header/header.less b/blocks/header/header.less
@@ -166,7 +166,9 @@ header {
 
 			>ul {
 				>li.nav-drop {
+					height: var(--nav-height);
 					position: relative;
+					padding-top: 16px;
 
 					&:first-child {
 						font-family: @nav-heading-first-child-font-family;
@@ -179,7 +181,6 @@ header {
 					&:not(:first-child) {
 						display: none;
 					}
-
 					position: relative;
 					font-size: 18px;
 					margin: 0;
@@ -442,6 +443,8 @@ header {
 						}
 
 						&:not(:first-child) {
+							height: var(--nav-height);
+							padding-top: 16px;
 							display: unset;
 						}