title: How to pass CSS modules in props?
body: <p>I'm getting <code>h2</code> undefined in <code>component2</code>.
  How to pass CSS module in props? Adding <code>className</code> to a child component from the parent component through props.</p>
  <p>Using: Next.js version 11.1.0</p>
  <p>example:</p>
  <p>component1:</p>
  <pre><code>import React from 'react'
  import Component2 from './Component2'
  import styles from './css/styles.module.css'
  
  function component1() {
      return (
          &lt;&gt;
              &lt;h1 className={styles.h1}&gt;hello World&lt;/h1&gt;
              &lt;Component2 styles={styles}/&gt;
         &lt;/&gt;
      )
  }
  
  export default component1
  </code></pre>
  <p>component2:</p>
  <pre><code>import React from 'react'
  
  function component2(props) {
  
      const styles = props.styles
  
      return (
          &lt;&gt;
              &lt;h2 className={styles.h2}&gt;Hellow World 2&lt;/h2&gt;
          &lt;/&gt;
      )
  }
  
  export default component2
  </code></pre>