title: Material-UI dialog overlay?
body: <p>I'm using the React-Redux Material-UI package: <a href="http://www.material-ui.com/#/components/dialog" rel="nofollow noreferrer">http://www.material-ui.com/#/components/dialog</a></p>
  
  <p>I'm trying to add a grey overlay over the entire dialog component with a circular indicator after the user logs in.</p>
  
  <p>Attempting to do this in the dialog body like so: </p>
  
  <pre><code>return &lt;div&gt;
              &lt;Dialog
                  title="Login"
                  actions={actions}
                  modal={false}
                  open={this.props.open}
                  onRequestClose={this.handleClose}&gt;
  
                  &lt;div className="loadingRoot"&gt;
                      TEST TEST TEST  TEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TESTTEST TEST TEST
                  &lt;/div&gt;
  
                  &lt;div&gt;
                      &lt;TextField floatingLabelText='username' name='username' onChange={this.handleTextFieldChange} /&gt;&lt;br /&gt;
                      &lt;TextField floatingLabelText='password' name='password' onChange={this.handleTextFieldChange} /&gt;
                  &lt;/div&gt;
              &lt;/Dialog&gt;
          &lt;/div&gt;;
  </code></pre>
  
  <p>Leads to a dialog box like this: </p>
  
  <p><a href="https://i.stack.imgur.com/81muN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/81muN.png" alt="enter image description here"></a></p>
  
  <p>Anyway to make this work so the 'loadingRoot' class will cover the entire dialog?</p>