Link List

Component preview opent in nieuw tabblad

Een link lijst heeft andere styling (donkergrijze linkkleur en iconen) op een gekleurde achtergrond: bv. in een highlight-box en in de footer.

<ul class="dso-link-list">
    <li>
        <a href="#" class="extern" target="_blank" rel="noopener noreferrer">Externe link<span class="sr-only">(Opent andere website in nieuw tabblad)</span></a>

    </li>
    <li>
        <a href="#" class="download">Download link</a>

    </li>
    <li>
        <a href="#">Interne link</a>

    </li>
</ul>
{% if navLabel %}
<nav aria-label="{{ navLabel }}" class="dso-link-list-nav">
{% endif %}
<ul class="dso-link-list">
  {%- for link in links -%}
    <li>
      {% render '@anchor', link %}
    </li>
  {% endfor -%}
</ul>
{% if navLabel %}
</nav>
{% endif %}
links:
  - label: Externe link
    url: '#'
    modifier: extern
  - label: Download link
    url: '#'
    modifier: download
  - label: Interne link
    url: '#'