From f6072777a0bd46c16d31670303c4a6d13a17eaed Mon Sep 17 00:00:00 2001
From: Fabrizio Duroni <fabrizio.duroni@gmail.com>
Date: Mon, 30 Dec 2024 03:28:38 +0100
Subject: [PATCH] Fix search input box

---
 src/components/design-system/molecules/search.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/design-system/molecules/search.tsx b/src/components/design-system/molecules/search.tsx
index d5227903a..72aef200b 100644
--- a/src/components/design-system/molecules/search.tsx
+++ b/src/components/design-system/molecules/search.tsx
@@ -118,24 +118,25 @@ const SearchBoxInput = styled.input<TransientProps<StartSearchProps>>`
   border-radius: 50px;
   box-sizing: border-box;
   font-size: ${(props) => props.theme.fontSizes[3]};
-  color: ${(props) => props.theme.light.textAbovePrimaryColor};
   border: 2px solid ${(props) => props.theme.light.textAbovePrimaryColor};
   outline: none;
   transition: 0.5s;
+  color: transparent;
 
   ${mediaQuery.dark} {
-    color: ${(props) => props.theme.dark.textAbovePrimaryColor};
     border: 2px solid ${(props) => props.theme.dark.textAbovePrimaryColor};
   }
 
   ${(props) =>
     props.$startSearch &&
     css`
+      color: ${(props) => props.theme.light.textAbovePrimaryColor};
       width: 200px;
       background: ${(props) => props.theme.light.generalBackground};
       ${borderRadius};
 
       ${mediaQuery.dark} {
+        color: ${(props) => props.theme.dark.textAbovePrimaryColor};
         background: ${(props) => props.theme.dark.generalBackground};
       }
     `}