-
-
Notifications
You must be signed in to change notification settings - Fork 32.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[TextField] Default Webkit autofill color does not use variables or palette #44665
Comments
Do you think this could be part of the theme too @zanivan ? |
Poking around too. It's only the The user agent also does apply styles in Chrome at least and they are marked as !important which is not ideal so even the CSSBaseline can't do much to reset that. |
Hey @mj12albert, in my opinion, I think this should be part of the theme. I had a hard time to customize this while working on the new templates—specially for the |
Honestly unless there is a spec requirement on Material I don't think there should be a webkit autofill style on the OutlinedInput. For UX consistency the other input variants do not have this behaviour and it's a weird edge case that designers don't normally account for. We found this in a customer demo where they have autofill enabled. |
Some more context, the color choice intends to be a dark mode alternative for Chrome's built-in autofill color: #14427 (comment) They're present on both the Filled and Outlined inputs: https://github.com/search?q=repo%3Amui%2Fmaterial-ui%20path%3A%2F%5Epackages%5C%2Fmui-material%5C%2Fsrc%5C%2F%2F%20WebkitBoxShadow&type=code |
@zanivan we could add a variable for it. It could work like Would you be willing to work on this? I'll also add the |
material-ui/packages/mui-material/src/OutlinedInput/OutlinedInput.js
Line 141 in 6389642
Looking at this I was having issue with the color of the TextField when autofill was put in (Chrome). The color is hardcoded in and not referenced to any css var or theme.palette. I can of course override this with sx props on the slotProps.htmlInput or globally override in the theme.
It seems like a very odd choice to do a very solid dark blue when someone could have a completely different color theme than the default blue.
Search keywords:
The text was updated successfully, but these errors were encountered: