From 7e23a2c6ffac19d14f54ca0b30a595d1d2ff8367 Mon Sep 17 00:00:00 2001
From: Mike Kruskal <mkruskal@google.com>
Date: Fri, 7 Oct 2022 16:11:33 -0700
Subject: [PATCH] Fixing width and hiding effect on focus

---
 assets/scss/_search.scss | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/assets/scss/_search.scss b/assets/scss/_search.scss
index 79386afffc..ccfd3b9df6 100644
--- a/assets/scss/_search.scss
+++ b/assets/scss/_search.scss
@@ -2,7 +2,7 @@
 .td-search-wrapper {
     position: relative;
     background: transparent;
-    max-width: 90%;
+    width: 90%;
 }
 
 .td-search-wrapper .td-search-input {
@@ -40,6 +40,15 @@
     pointer-events: none;
 }
 
+# Hide the icon on focus.
+.td-search-wrapper:focus-within .fa {
+    display: none;
+}
+
+.td-search-wrapper:focus-within .td-search-input {
+   text-indent: 0px;
+}
+
 .popover.offline-search-result {
     // Override bootstrap default style (max-width: $popover-max-width;)
     max-width: 90%;