From 6aa8e280001dbdba80c19b6e715d71f27308e415 Mon Sep 17 00:00:00 2001
From: jasmussen <joen@automattic.com>
Date: Fri, 26 Mar 2021 11:50:39 +0100
Subject: [PATCH] Navigation: Fix arrow inheritance, polish

---
 .../block-library/src/navigation-link/editor.scss     |  3 ++-
 packages/block-library/src/navigation-link/icons.js   |  6 +-----
 packages/block-library/src/navigation-link/index.php  |  2 +-
 packages/block-library/src/navigation-link/style.scss | 11 +++++++----
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/block-library/src/navigation-link/editor.scss b/packages/block-library/src/navigation-link/editor.scss
index bd81b95f3bd9f4..e61560d7e87a62 100644
--- a/packages/block-library/src/navigation-link/editor.scss
+++ b/packages/block-library/src/navigation-link/editor.scss
@@ -12,9 +12,10 @@
  */
 
 // Show submenus above the sibling inserter.
-.has-child {
+.wp-block-navigation .has-child {
 	cursor: pointer;
 
+	.submenu-container,
 	.wp-block-navigation-link__container {
 		z-index: z-index(".has-child .wp-block-navigation-link__container");
 	}
diff --git a/packages/block-library/src/navigation-link/icons.js b/packages/block-library/src/navigation-link/icons.js
index 6cd15932a7199a..3a44a250b084ef 100644
--- a/packages/block-library/src/navigation-link/icons.js
+++ b/packages/block-library/src/navigation-link/icons.js
@@ -11,10 +11,6 @@ export const ItemSubmenuIcon = () => (
 		viewBox="0 0 12 12"
 		fill="none"
 	>
-		<Path
-			d="M1.50002 4L6.00002 8L10.5 4"
-			stroke="#000000"
-			strokeWidth="1.5"
-		/>
+		<Path d="M1.50002 4L6.00002 8L10.5 4" strokeWidth="1.5" />
 	</SVG>
 );
diff --git a/packages/block-library/src/navigation-link/index.php b/packages/block-library/src/navigation-link/index.php
index 9e33ff17b7f3fe..5309df8a510270 100644
--- a/packages/block-library/src/navigation-link/index.php
+++ b/packages/block-library/src/navigation-link/index.php
@@ -91,7 +91,7 @@ function block_core_navigation_link_build_css_font_sizes( $context ) {
  * @return string
  */
 function block_core_navigation_link_render_submenu_icon() {
-	return '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke="#000000" stroke-width="1.5"></path></svg>';
+	return '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg>';
 }
 
 /**
diff --git a/packages/block-library/src/navigation-link/style.scss b/packages/block-library/src/navigation-link/style.scss
index bb9b1988f80498..c5f6a5da54d7b1 100644
--- a/packages/block-library/src/navigation-link/style.scss
+++ b/packages/block-library/src/navigation-link/style.scss
@@ -82,7 +82,6 @@
 
 		.submenu-container,
 		.wp-block-navigation-link__container {
-			border: 1px solid rgba(0, 0, 0, 0.15);
 			background-color: inherit;
 			color: inherit;
 			position: absolute;
@@ -115,13 +114,11 @@
 			}
 
 			@include break-medium {
-				left: 1.5em;
-
 				// Nested submenus sit to the left on large breakpoints.
 				.submenu-container,
 				.wp-block-navigation-link__container {
 					left: 100%;
-					top: -$border-width;
+					top: 0;
 
 					// Prevent the menu from disappearing when the mouse is over the gap
 					&::before {
@@ -190,5 +187,11 @@
 		// several times, so care needs to be taken.
 		background-color: #fff;
 		color: #000;
+		border: 1px solid rgba(0, 0, 0, 0.15);
+
+		.submenu-container,
+		.wp-block-navigation-link__container {
+			top: -1px;
+		}
 	}
 }