title: What is best approach to responsive buttons with icons in material-ui?
body: <p>I have a material-ui Button with a startIcon where I'd like to hide the button text on smaller screens but continue to show the icon. </p>
  
  <p>The obvious approach is use the useMediaQuery hook to detect the browser size and render a different component.</p>
  
  <p>However, I have to imagine there is an approach through using the CSS api? At first blush, I could not target the text element to hide it as it is wrapped in the same parent element as the icon. The <code>label</code> field for the Button CSS api includes the icon, so adding a display: 'none' doesn't work as it hides both the text and the sibling icon element. </p>
  
  <p>Is there a standard approach for this with material-ui. </p>