From 58b2c3f791e02fa7b605a00b61e59cac4742bf70 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Mon, 10 Feb 2020 11:22:44 +0100
Subject: [PATCH] Align icon in mini search (#7589)

* Align icon vertically and horizontally inside icon placeholder

* Add aria-hidden to search icon
---
 .../src/less/components/umb-mini-search.less          | 11 ++++++++---
 .../components/umb-mini-search/umb-mini-search.html   |  2 +-
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-search.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-search.less
index ac15b3dcf8..68cb9b2e58 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-search.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-search.less
@@ -4,16 +4,21 @@
 
     .icon {
         position: absolute;
-        padding: 5px 8px;
+        width: 30px;
+        height: 30px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        margin: 1px;
+        padding: 0;
         pointer-events: none;
-        top: 2px;
         color: @ui-action-discreet-type;
         transition: color .1s linear;
     }
 
     input {
         width: 0px;
-        padding-left:24px;
+        padding-left: 24px;
         margin-bottom: 0px;
         background-color: transparent;
         border-color: @ui-action-discreet-border;
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-search/umb-mini-search.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-search/umb-mini-search.html
index 20ce87f0eb..93801f14b8 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-search/umb-mini-search.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-search/umb-mini-search.html
@@ -1,5 +1,5 @@
 <ng-form class="umb-mini-search" ng-class="{'--has-value': vm.model !== null && vm.model !== ''}" novalidate>
-    <i class="icon icon-search"></i>
+    <i class="icon icon-search" aria-hidden="true"></i>
     <input
         class="form-control search-input"
         type="text"