title: Override Material UI MuiInput
body: <p>I am trying to override Material UI's input so my text field has a box around it instead of a line. I followed Material's example for a button which worked. I'm not sure what I need to do differently to override a text field. Thanks in advance.</p>
  
  <p>MyTheme.js</p>
  
  <pre><code>import { createMuiTheme } from 'material-ui/styles';
  import Input from 'material-ui/Input';
  
  export default createMuiTheme({
  overrides: {
          MuiInput: {
              Root: {
                  borderRadius: 0,
                  backgroundColor: "#fff",
                  border: '1px solid pink',
                  fontSize: 16,
                  padding: '10px 12px',
                  width: 'calc(100% - 24px)',
              },
          }
      } 
  });
  </code></pre>
  
  <p>App.js</p>
  
  <pre><code>import React, { Component } from 'react';
  import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
  import MyTheme from './MyTheme';
  import { withStyles } from 'material-ui/styles';
  import TextField from 'material-ui/TextField';
  
  
  class App extends Component {
    constructor(props) {
      super(props);
    }
  
    render() {
      return (
        &lt;MuiThemeProvider theme={MyTheme}&gt;
           &lt;form noValidate autoComplete="off"&gt;
             &lt;TextField
                label="Name"
                margin="normal"
               /&gt;
           &lt;/form&gt;
        &lt;/MuiThemeProvider&gt;
        );
     }
  }
  
  App.propTypes = {
    classes: PropTypes.object.isRequired,
  };
  
  export default App;
  </code></pre>