fix(theme): removed pseudo cancel btn from input (#3912)

* fix(theme): removed pseudo cancel btn from input * chore(changeset): adding the changeset * fix(input): conditionally hiding the webkit search * chore(changeset): revise changeset message --------- Co-authored-by: WK Wong <wingkwong.code@gmail.com>
heroui-inc · Oct 19, 2024 · 38a54ab · 38a54ab
1 parent 8a33eab
commit 38a54ab
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 1 deletion.
diff --git a/.changeset/forty-doors-flash.md b/.changeset/forty-doors-flash.md
@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+remove the pseudo cancel btn from input (#3907)
diff --git a/packages/core/theme/src/components/input.ts b/packages/core/theme/src/components/input.ts
@@ -190,7 +190,7 @@ const input = tv({
     },
     isClearable: {
       true: {
-        input: "peer pe-6",
+        input: "peer pe-6 input-search-cancel-button-none",
         clearButton: "peer-data-[filled=true]:opacity-70 peer-data-[filled=true]:block",
       },
     },

diff --git a/packages/core/theme/src/utilities/custom.ts b/packages/core/theme/src/utilities/custom.ts
@@ -17,4 +17,9 @@ export default {
   ".tap-highlight-transparent": {
     "-webkit-tap-highlight-color": "transparent",
   },
+  ".input-search-cancel-button-none": {
+    "&::-webkit-search-cancel-button": {
+      "-webkit-appearance": "none",
+    },
+  },
 };