From dfa718f8ead6914c1fabb7fce5f3479cea6644f4 Mon Sep 17 00:00:00 2001 From: Abdulrehman-Jafer <121712508+Abdulrehman-Jafer@users.noreply.github.com> Date: Mon, 6 Mar 2023 14:53:35 +0500 Subject: [PATCH] web: fix autocomplete text color for all inputs (#2057) Signed-off-by: Abdulrehman-Jafer --- apps/web/src/components/search/index.js | 2 +- packages/theme/src/theme/variants/input.ts | 5 +++++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/apps/web/src/components/search/index.js b/apps/web/src/components/search/index.js index 419528bd9..a50f061ac 100644 --- a/apps/web/src/components/search/index.js +++ b/apps/web/src/components/search/index.js @@ -29,7 +29,7 @@ function SearchBox(props) { id="search" name="search" type="text" - sx={{ m: 0, mx: 1, mt: 1 }} + sx={{m: 0,mx: 1,mt: 1}} placeholder="Type your query here" onKeyDown={(e) => { if (e.key === "Enter") props.onSearch(e.target.value); diff --git a/packages/theme/src/theme/variants/input.ts b/packages/theme/src/theme/variants/input.ts index e21c67e21..7cae2c3de 100644 --- a/packages/theme/src/theme/variants/input.ts +++ b/packages/theme/src/theme/variants/input.ts @@ -27,6 +27,11 @@ const defaultVariant: ThemeUIStyleObject = { fontWeight: "body", fontSize: "input", color: "text", + ":-webkit-autofill": { + WebkitTextFillColor: "var(--text)", + caretColor: "red", + fontSize: "inherit" + }, ":focus": { outline: "2px solid var(--primary)" },