Navigation: Small fixes (#36298)

* Navigation: Extract small fixes, and refine border rules.

* Revert the box shadow change.

packages/block-library/src/navigation-link/editor.scss

@@ -26,6 +26,7 @@
 			min-width: 200px !important;
 			height: auto !important;
 			width: auto !important;
+			overflow: visible !important;
 		}
 	}
 }

packages/block-library/src/navigation-submenu/style.scss

@@ -13,6 +13,7 @@ button.wp-block-navigation-item__content {
 	color: currentColor;
 	font-size: inherit;
 	font-family: inherit;
+	line-height: inherit;
 
 	// Buttons default to center alignment. This becomes visible
 	// when a menu item label is long enough to wrap.

packages/block-library/src/navigation/editor.scss

@@ -37,6 +37,7 @@
 .wp-block-navigation__container.is-parent-of-selected-block {
 	visibility: visible;
 	opacity: 1;
+	overflow: visible;
 }
 
 // Low specificity default to ensure background color applies to submenus.

packages/block-library/src/navigation/style.scss

@@ -119,17 +119,14 @@
 		// Don't take up space when the menu is collapsed.
 		width: 0;
 		height: 0;
+		overflow: hidden; // Overflow is necessary to set, otherwise submenu items will take up space.
 
 		// Submenu items.
 		> .wp-block-navigation-item {
 			> .wp-block-navigation-item__content {
 				display: flex;
 				flex-grow: 1;
 
-				// Without this, the changing to zero on hover-out can cause wrapping and
-				// result in an invinite hover/hover-out loop.
-				white-space: nowrap;
-
 				// Right-align the chevron in submenus.
 				.wp-block-navigation__submenu-icon {
 					margin-right: 0;
@@ -178,6 +175,7 @@
 	// Show submenus on hover unless they open on click.
 	&:where(:not(.open-on-click)):hover > .wp-block-navigation__submenu-container {
 		visibility: visible;
+		overflow: visible;
 		opacity: 1;
 		width: auto;
 		height: auto;
@@ -187,6 +185,7 @@
 	// Keep submenus open when focus is within.
 	&:where(:not(.open-on-click):not(.open-on-hover-click)):focus-within > .wp-block-navigation__submenu-container {
 		visibility: visible;
+		overflow: visible;
 		opacity: 1;
 		width: auto;
 		height: auto;
@@ -196,6 +195,7 @@
 	// Show submenus on click.
 	.wp-block-navigation-submenu__toggle[aria-expanded="true"] + .wp-block-navigation__submenu-container {
 		visibility: visible;
+		overflow: visible;
 		opacity: 1;
 		width: auto;
 		height: auto;
@@ -396,7 +396,6 @@
 				border: none;
 				padding-left: 32px;
 				padding-right: 32px;
-
 			}
 
 			// Space unfolded items using gap and padding for submenus.