From 9b323e81b4a133e09b08c4e4975c933b384d45ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?D=C3=A1vid=20Szab=C3=B3?= <david.szabo97@gmail.com>
Date: Fri, 15 Jan 2021 19:59:06 +0100
Subject: [PATCH] Navigation Component: Make sure the button takes up the whole
 row (#28230)

Fix odd focus outline of Navigation component button.
---
 packages/components/src/navigation/styles/navigation-styles.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/components/src/navigation/styles/navigation-styles.js b/packages/components/src/navigation/styles/navigation-styles.js
index 4e5c76ad36206..0b4fbcb1a4201 100644
--- a/packages/components/src/navigation/styles/navigation-styles.js
+++ b/packages/components/src/navigation/styles/navigation-styles.js
@@ -159,6 +159,8 @@ export const ItemBaseUI = styled.li`
 
 	button,
 	a {
+		width: 100%;
+
 		&:hover,
 		&:focus:not( [aria-disabled='true'] ):active,
 		&:active:not( [aria-disabled='true'] ):active {