From f3d5a811b0ea067cb631825c5a154ef72551792a Mon Sep 17 00:00:00 2001
From: Alexander Klein <alexander.klein@logmein.com>
Date: Mon, 19 Jul 2021 11:09:31 +0200
Subject: [PATCH 1/3] style: increase sidebar search input hitbox

Increase the padding of the sidebar search input. Fixes linked issue.

refs #6529

Signed-off-by: Alexander Klein <x.klein.14@gmail.com>
Signed-off-by: Alexander Klein <alexander.klein@logmein.com>
---
 packages/core-components/src/layout/Sidebar/Items.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/core-components/src/layout/Sidebar/Items.tsx b/packages/core-components/src/layout/Sidebar/Items.tsx
index 28abbce53c..6fdf3d56dd 100644
--- a/packages/core-components/src/layout/Sidebar/Items.tsx
+++ b/packages/core-components/src/layout/Sidebar/Items.tsx
@@ -97,6 +97,9 @@ const useStyles = makeStyles<BackstageTheme>(theme => {
       fontWeight: 'bold',
       fontSize: theme.typography.fontSize,
     },
+    searchFieldHTMLInput: {
+      padding: '15px 0 17px',
+    },
     searchContainer: {
       width: drawerWidthOpen - iconContainerWidth,
     },
@@ -271,6 +274,9 @@ export const SidebarSearchField = (props: SidebarSearchFieldProps) => {
             disableUnderline: true,
             className: classes.searchField,
           }}
+          inputProps={{
+            className: classes.searchFieldHTMLInput,
+          }}
         />
       </SidebarItem>
     </div>

From 9a751bb28fb6c477f3909f2eebd135f5ef244d3d Mon Sep 17 00:00:00 2001
From: Alexander Klein <alexander.klein@logmein.com>
Date: Mon, 19 Jul 2021 11:29:50 +0200
Subject: [PATCH 2/3] docs: add changeset

Signed-off-by: Alexander Klein <x.klein.14@gmail.com>
Signed-off-by: Alexander Klein <alexander.klein@logmein.com>
---
 .changeset/chilled-cars-cough.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/chilled-cars-cough.md

diff --git a/.changeset/chilled-cars-cough.md b/.changeset/chilled-cars-cough.md
new file mode 100644
index 0000000000..b6406fcab1
--- /dev/null
+++ b/.changeset/chilled-cars-cough.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core-components': patch
+---
+
+Increase the vertical padding of the sidebar search input field to match the height of the parent anchor tag. This prevents users from accidentally navigating to the search page when they actually wanted to use the search input directly.

From 8359313600330aa1ac171b13552b742a59547c84 Mon Sep 17 00:00:00 2001
From: blam <ben@blam.sh>
Date: Wed, 21 Jul 2021 14:32:55 +0200
Subject: [PATCH 3/3] chore: refactoring to use `theme.spacing` Signed-off-by:
 blam <ben@blam.sh>

---
 packages/core-components/src/layout/Sidebar/Items.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/core-components/src/layout/Sidebar/Items.tsx b/packages/core-components/src/layout/Sidebar/Items.tsx
index 6fdf3d56dd..3944df0b50 100644
--- a/packages/core-components/src/layout/Sidebar/Items.tsx
+++ b/packages/core-components/src/layout/Sidebar/Items.tsx
@@ -44,7 +44,6 @@ const useStyles = makeStyles<BackstageTheme>(theme => {
     drawerWidthOpen,
     iconContainerWidth,
   } = sidebarConfig;
-
   return {
     root: {
       color: theme.palette.navigation.color,
@@ -98,7 +97,7 @@ const useStyles = makeStyles<BackstageTheme>(theme => {
       fontSize: theme.typography.fontSize,
     },
     searchFieldHTMLInput: {
-      padding: '15px 0 17px',
+      padding: `${theme.spacing(2)} 0 ${theme.spacing(2)}`,
     },
     searchContainer: {
       width: drawerWidthOpen - iconContainerWidth,