Dropdown button

Introductie

Knop met openklapbaar menu.

Snelstart

SCSS importeren:

    
      
    
    @use "@minvws/manon/components/dropdown";
  

JavaScript importeren:

    
      
    
    import "@minvws/manon/js/collapsible.js";
  

Voorbeelden

Voorbeeld: button

    
      
    
    <div
  data-open-label="Dropdown menu"
  data-close-label="Sluit dropdown menu"
  data-media="(min-width: 100%)"
  class="collapsible dropdown"
>
  <div class="collapsing-element">
    <ul>
      <li><a href="/library/components/collapsible">Item 1</a></li>
      <li>
        <a href="/library/components/collapsible">Huidige selectie</a>
      </li>
      <li><a href="/library/components/collapsible">a</a></li>
    </ul>
  </div>
</div>
  

Voorbeeld: Meerdere openklapbare knoppen

    
      
    
    <div
  data-open-label="Dropdown menu"
  data-close-label="Sluit dropdown menu"
  data-media="(min-width: 100%)"
  class="collapsible"
>
  <div class="collapsing-element">
    <ul>
      <li><a href="#">Item 1</a></li>
      <li><a href="#">Huidige selectie</a></li>
      <li><a href="#">Item 3</a></li>
    </ul>
  </div>
</div>