[TextField] Outline has Inline Styles

Using the TextField component with the variant prop set to “outlined” will inline a padding-left and width inline style. This is difficult to accommodate for Content Security Policy.

• This is not a v0.x issue.
• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

All styles provided by material-ui should be inlined in the head tag which contains a CSP nonce

Current Behavior

When implementing TextField, the following HTML is output - note the style attributes

<fieldset aria-hidden="true" class="MuiNotchedOutline-root-174 MuiOutlinedInput-notchedOutline-151" style="padding-left: 8px;">
    <legend class="MuiNotchedOutline-legend-175" style="width: 38px;"></legend>
</fieldset>

Steps to Reproduce

Link: https://codesandbox.io/s/31prwv9j5q

1. Implement TextField component
2. add variant=“outlined”
3. Inspect the fieldset and input elements

Context

This makes implementing a good CSP difficult due to arbitrary inline styles

Your Environment

Tech	Version
Material-UI	v3.2.2
React	v16.5.2
Browser	Chrome 69

[oliviertassinari]

I’m closing as I don’t think that we should stop ourselves to use inline style if it can enable better solutions.

Regrading the very case of the text field, #17680 will very likely remove this inline style.

See #19938 for the general issue with inline-style for CSP.

[oliviertassinari]

I’m not sure we should fix this issue. We are using inline style at different locations in the code base. cc @mui-org/core-contributors.