<div class="ecl-popover" data-ecl-auto-init="Popover"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__toggle"
aria-controls="popover-example" data-ecl-popover-toggle="" aria-expanded="false" aria-label="Popover toggle"><svg
class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false" aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#share"></use>
</svg><span class="ecl-link__label">Popover</span></a>
<div id="popover-example" class="ecl-popover__container" hidden="">
<div class="ecl-popover__content">
<ul class="ecl-popover__list">
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 1"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 1</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 2"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 2</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 3"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 3</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 4"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 4</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 5"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 5</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 6"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 6</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 7"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 7</span></a></li>
<li class="ecl-popover__item"><a href="/example"
class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-before ecl-popover__link"
aria-label="Link to item 8"><svg class="ecl-icon ecl-icon--fluid ecl-link__icon" focusable="false"
aria-hidden="true">
<use xlink:href="/dist/media/icons.6770a2ae.svg#global"></use>
</svg><span class="ecl-link__label">item 8</span></a></li>
</ul>
</div>
</div>
</div>Try it yourself on the playground
Playground