From 3693ed2bafd5856a8492a95eea265ff3716612b7 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandrocelaya@gmail.com>
Date: Sat, 22 Feb 2025 10:23:07 +0100
Subject: [PATCH] Add background color to search inputs

---
 src/components/Search.tsx              | 2 +-
 src/components/header/HeaderSearch.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Search.tsx b/src/components/Search.tsx
index e32b437..3086fae 100644
--- a/src/components/Search.tsx
+++ b/src/components/Search.tsx
@@ -36,7 +36,7 @@ export const Search: FC<SearchProps> = ({ posts }) => {
     <>
       <section className="mb-6">
         <input
-          className="w-full border-2 focus:border-primary rounded-sm p-2 outline-0 transition text-main"
+          className="w-full border-2 focus:border-primary rounded-sm p-2 outline-0 transition text-main bg-white"
           type="search"
           name="q"
           placeholder="Search…"
diff --git a/src/components/header/HeaderSearch.tsx b/src/components/header/HeaderSearch.tsx
index f909b82..85d5183 100644
--- a/src/components/header/HeaderSearch.tsx
+++ b/src/components/header/HeaderSearch.tsx
@@ -14,7 +14,7 @@ export const HeaderSearch: FC<{ className?: string }> = ({ className }) => {
       <input
         type="search"
         className={clsx(
-          'md:absolute right-0 rounded-sm p-2 md:pr-9 outline-0 text-main',
+          'md:absolute right-0 rounded-sm p-2 md:pr-9 outline-0 text-main bg-white',
           'w-full md:w-0 md:opacity-0 md:focus:w-80 focus:opacity-100 transition-appear',
         )}
         placeholder="Search…"
@@ -32,7 +32,7 @@ export const HeaderSearch: FC<{ className?: string }> = ({ className }) => {
       />
       <button
         tabIndex={-1}
-        className="absolute right-2 top-2"
+        className="absolute right-2 top-2 cursor-pointer"
         onClick={() => ref.current?.focus()}
       >
         <FontAwesomeIcon