title: react how to style : styled-dropdown-component
body: <p>I am trying to change the <code>color</code> and the <code>size</code> of the <code>DropdownMenu</code> using the <code>styled-components</code> like the code below:</p>
  
  <pre><code>const DropdownCustom = styled.DropdownMenu`
    font-family: sans-serif;
    font-size: 1.3rem;
    border: none;
    border-radius: 5px;
    background-color: red;
  `;
  </code></pre>
  
  <p>Then I try to use it like this:</p>
  
  <pre><code> &lt;Dropdown&gt;
              &lt;button onClick={() =&gt; setState(!state)}&gt;Create&lt;/button&gt;
              &lt;DropdownCustom hidden={!state}&gt;
                &lt;DropdownItem&gt;Action&lt;/DropdownItem&gt;
                &lt;DropdownItem&gt;Another action&lt;/DropdownItem&gt;
                &lt;DropdownItem&gt;Something else here&lt;/DropdownItem&gt;
              &lt;/DropdownCustom&gt;
   &lt;/Dropdown&gt;
  </code></pre>
  
  <p>But it gives me an error saying that <code>_styledComponents.default.DropdownMenu is not a function</code>.</p>
  
  <p>I am very new to styling with css and it is very confusing, so any advice or guide would be really appreciated! :)</p>
  
  <p><strong>Edited</strong></p>
  
  <pre><code>import {
    Dropdown,
    DropdownItem,
    DropdownMenu
  } from "styled-dropdown-component";
  </code></pre>