<legno-dropdown-wrapper>
<legno-dropdown title="Banana" anchor-id="banana" />
<legno-dropdown title="Apple" anchor-id="apple" />
<legno-dropdown title="Orange" anchor-id="orange" />
</legno-dropdown-wrapper>
INFO
When using plain HTML you need to toggle these css classes manually on the root element:
legno-dropdown--openstyles the element in open position
<div class="legno-dropdown-wrapper">
<div class="legno-dropdown">
<a id="Banana" aria-hidden="true"></a>
<button type="button" class="legno-dropdown__item">
<span class="legno-dropdown__title">Banana</span>
</button>
<div class="legno-dropdown__content">Bananas are great!</div>
</div>
<div class="legno-dropdown">
<a id="Apple" aria-hidden="true"></a>
<button type="button" class="legno-dropdown__item">
<span class="legno-dropdown__title">Apple</span>
</button>
<div class="legno-dropdown__content">An apple a day</div>
</div>
<div class="legno-dropdown">
<a id="Orange" aria-hidden="true"></a>
<button type="button" class="legno-dropdown__item">
<span class="legno-dropdown__title">Orange</span>
</button>
<div class="legno-dropdown__content">Annoying orange</div>
</div>
</div>