[BUG] - Input autofill highlight

[Innders]

NextUI Version

2.2.6

Describe the bug

When autofilling inputs on chrome there's an ugly highlighting of the text. I'm not sure if it's a bug but it doesn't look very nice and clashes with the style of the input.

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

1. Input type text or password.
2. Use autofill on chrome to fill the input value. Also the same for password autofill.
3. New filled text has highlighted background.

Expected behavior

Autofill text without highlight background.

Screenshots or Videos

Operating System Version

MacOS

Browser

Chrome

[ghost]

@Innders This is the Styles embedded by Chrome, Any Framework you pick has the same thing the way around is to either disable the Autofill or Customize the Styles embedded by Browser.

[Oolix]

Unfortunately not a bug but if you want to get rid of it put this in your globals.css:

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-background-clip: text;
    transition: background-color 5000s ease-in-out 0s;
}

[getellez]

But in the nextui docs the input doesn't look like that, why?

[getellez]

@Innders I fixed the background by removing the colors property from the theme in the tailwind.config.js file

[dejavuhuh]

@Innders I fixed the background by removing the colors property from the theme in the tailwind.config.js file我通过从 tailwind.config.js 文件中删除 theme 的颜色属性来修复背景

@getellez How did you do that?

[awesome-pro]

@Innders this issue has been solved by this pr kindly close it.

[wingkwong]

Fixed in #3430