title: How to adjust MUI Tooltip font size?
body: <p>I implemented a tooltip with MUI but the <code>fontSize</code> is too small. And I can't change it with a <code>.scss</code>.</p>
  <pre class="lang-js prettyprint-override"><code>import React from &quot;react&quot;;
  import &quot;./InfoTooltip.scss&quot;;
  import InfoIcon from '@material-ui/icons/Info';
  import Tooltip from '@material-ui/core/Tooltip';
  
  const InfoTooltip: React.FC&lt;{ children?: any }&gt; = ({ children }) =&gt; {
    const [label, ...rest] = children;
    return (
      &lt;div className=&quot;info-tooltip-container&quot;&gt;
        &lt;div className=&quot;label-container&quot;&gt;
          &lt;Tooltip title={label}&gt;
            &lt;InfoIcon style={{ fontSize: '24px' }} /&gt;
          &lt;/Tooltip&gt;
        &lt;/div&gt;
        {rest}
      &lt;/div&gt;
    );
  };
  
  export default InfoTooltip;
  </code></pre>
  <pre class="lang-css prettyprint-override"><code>.info-tooltip-container {
    .label-container {
      font-size: 18px;
    }
    label {
      font-size: 18px;
    }
  }
  </code></pre>
  <p><a href="https://i.stack.imgur.com/mNALW.png" rel="noreferrer">https://mui.com/components/tooltips/#main-content</a></p>