TextField fullWidth prop missing left padding with leading icon enabled

[dohomi]

What MDC Web Version are you using?

Latest

What browser(s) is this bug affecting?

All versions

What OS are you using?

All versions

What are the steps to reproduce the bug?

Add a leading icon to the TextField with fullwidth enabled.

What is the expected behavior?

There should be left padding on the input field to show the icon

What is the actual behavior?

Icon overlaps.

Currently I fix it with CSS

.mdc-text-field--with-leading-icon.mdc-text-field--fullwidth .mdc-text-field__input {
  padding-left: 48px !important; /* fixing misaligned input field on fullWidth TextField */
}

[moog16]

I'm seeing this:

Can you confirm this is also what you're seeing?

[moog16]

@dohomi ping :)

[dohomi]

@moog16 thats exactly what I see as well. Fixed it with the work around above but not sure if it respects accurately Googles spec on margin/padding

[moog16]

We actually don't have any guidance on this setup. We need design guidance.

[abhiomkar]

Design says full width text field variant can have leading / trailing icon.

Adding this to icebox.

[deleonio]

I think that this definition must be removed.

.mdc-text-field--fullwidth:not(.mdc-text-field--textarea) .mdc-text-field__input {
    padding: 0;
}

[asyncLiz]

This will be fixed in #1892, which revamps the text field's layout.

[asyncLiz]

This is obsolete since #6146 which removed the fullwidth variant