Изменения background-color при автозаполнении textField

Добрый при автозаполнении поля видно, что задний фон не полностью изменился у объекта, если правильно понял, то без учёта отступов, подскажите пожалуйста, как исправить.
Попытался применить глобальные настройки, но без результата, настройки брал отсюда:

image

Добрый день

Дело в особенностях стилизации textField.

Дело в том, что видимое поле, которое на вашем скриншоте обведено фокусным кольцом - это элемент vaadin-input-container для vaadin-field, задний фон которого закрашен. В этом контейнере содержится prefix слот, input слот и suffix слот.

Непосредственно ввод значений, также, как и автозаполнение, действует на элемент input. Поэтому именно к нему применяется стилизация.
image

vaadin-input-container, к сожалению, никак не сможет узнать, применили ли свойство autofill к его вложенному input. Поэтому изменить цвет заднего фона в данном случае не предоставляется возможным.

Как вариант, Вы можете попробовать не делать заливку элементам input, которые стали автозаполнены.

Для этого можно воспользоваться стилями:

input:-webkit-autofill {
    -webkit-background-clip: text;
}

С уважением,
Дмитрий

1 симпатия