title: Overriding TableRow hover CSS on Material-ui in React
body: <p>Been going round in circles on this. Clearly I'm not fully understanding how class overrides work in Material-ui.</p>
  
  <p>I tried this answer:
  <a href="https://stackoverflow.com/questions/49125789/css-on-material-ui-components">CSS on Material UI components</a>
  but it didn't work (no errors), perhaps because I'm using a stateful component rather than the stateless one in the example.</p>
  
  <p>Currently I'm trying this...</p>
  
  <pre><code>&lt;TableRow className={styles.tableRow}
      key={n.id} hover
      onClick={event =&gt; this.handleRowClick(event, n.id)}
      classes={{ 'hover': {color: '#7EA5FF'}}} &gt;
        &lt;TableCell&gt;&amp;nbsp;&lt;/TableCell&gt;
        &lt;TableCell&gt;{n.title}&lt;/TableCell&gt;
        &lt;TableCell&gt;{n.author}&lt;/TableCell&gt;
  &lt;/TableRow&gt;
  </code></pre>
  
  <p>But I get this error:
  the key <code>hover</code> provided to the classes property is not valid for TableRow.
  You need to provide a non empty string instead of: [object Object].</p>
  
  <p>Help appreciated. Thanks.</p>