Come together with the global Drupal community in Rotterdam, 28 Sept – 1 Oct 2026. Sessions, contribution, connection, and Early Bird savings until 8 June.Problem/Motivation
Browsers are using internal styles to change background color of input elements that are auto filled. This usually looks bad and not aligned with theme design. We should reset input bg color back to original state that is defined with `$input-bg` SASS variable.
| Comment | File | Size | Author |
|---|---|---|---|
| #6 | interdiff-3256665-5-6.txt | 1.53 KB | pivica |
| #6 | reset-input-bg-color-autofill-3256665-6.patch | 2.95 KB | pivica |
Comments
Comment #2
pivica commentedHere is a patch.
Additionally Chrome is changing font size of input while you do actual selection of auto fill options, when you select some option the font size is restored to original value. This is not possible to fix for now because Chrome is using internal style with `!important` statement and we can not override this.
Comment #3
pivica commentedComment #4
pivica commentedDisabling autofill bg color for inputs is not something that everybody will like because information about auto filed input fields will be lost visually. We will add a new SASS variable for this so custom theme can decide will it want to reset this bg color, use some other color or disable resetting so default browser colors are used.
Comment #5
pivica commentedWell this is a bit complex, browsers, well Chrome is really doing a lot of overrides here with an !important flag and that is making our life difficult - no idea why they thought this is a good idea...
Here is a new patch, added a mixin so rule can be used easily in custom CSS code and added color override hack.
Comment #6
pivica commentedAdded helper function `bs-input-autofill-box-shadow` so box shadow value can be easily reused or overridden.
Comment #8
pivica commentedCommitted.