Input broken autofill styling - outlined, material

[damyanpetev]

Description

Styling on the form inputs is broken with auto-filled values:

Steps to Reproduce

Note: See comment after, while the repro is using React, it's still valid and I've checked the installed version in the lock is latest:

"node_modules/igniteui-webcomponents": {
      "version": "7.2.4",

1. ig [new] with the following selection

   ✔ Enter a name for your project: ReactAuth
   ✔ Choose framework: React
   Project type: Ignite UI for React
   ✔ Choose project template: Side navigation + collapsible mini nav
   ✔ Would you like to add authentication (login, register, social login)? Yes

or ReactAuth.zip

2. If you don't have an already saved credentials for this domain:
   a. go though the create account account steps
   b. let the browser save the credentials;
   c. Sign out and reload
3. Open the login dialog for the browser to autofill

Actual Result

Expected Result

Normal input styling like in the first editor after its been edited:

OR better integrated auto-filled indication :)

[damyanpetev]

Actually it seems the issue is not with the project styling, however much that is, breaks just the same without it

because the styling seems to come from the user-agent:

We seem to have some `:autofill` modification, it's possible the autofill background is a recent addition to Chromium browsers, yet to check FF.