From 3bdfd7f6a0d6818f9e4a7c7c7efecb949405a920 Mon Sep 17 00:00:00 2001
From: David Walsh <davidwalsh83@gmail.com>
Date: Fri, 18 Mar 2022 12:35:43 -0500
Subject: [PATCH] Dark Mode: Settings Search Bar (#13997)

---
 ui/pages/settings/settings-search/settings-search.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/ui/pages/settings/settings-search/settings-search.js b/ui/pages/settings/settings-search/settings-search.js
index 57b206684..a28561afd 100644
--- a/ui/pages/settings/settings-search/settings-search.js
+++ b/ui/pages/settings/settings-search/settings-search.js
@@ -15,7 +15,9 @@ export default function SettingsSearch({
   const t = useContext(I18nContext);
 
   const [searchQuery, setSearchQuery] = useState('');
-  const [searchIconColor, setSearchIconColor] = useState('#9b9b9b');
+  const [searchIconColor, setSearchIconColor] = useState(
+    'var(--color-icon-muted)',
+  );
 
   const settingsRoutesListArray = Object.values(settingsRoutesList);
   const settingsSearchFuse = new Fuse(settingsRoutesListArray, {
@@ -32,9 +34,9 @@ export default function SettingsSearch({
   const handleSearch = (searchQuery) => {
     setSearchQuery(searchQuery);
     if (searchQuery === '') {
-      setSearchIconColor('#9b9b9b');
+      setSearchIconColor('var(--color-icon-muted)');
     } else {
-      setSearchIconColor('#24292E');
+      setSearchIconColor('var(--color-icon-default)');
     }
     const fuseSearchResult = settingsSearchFuse.search(searchQuery);
     const addressSearchResult = settingsRoutesListArray.filter((routes) => {
@@ -91,7 +93,6 @@ export default function SettingsSearch({
       fullWidth
       autoFocus
       autoComplete="off"
-      style={{ backgroundColor: '#fff' }}
       startAdornment={renderStartAdornment()}
       endAdornment={renderEndAdornment()}
     />