List group
List group
List groups are used in lists where the content is more elaborate than just a simple link or text. This block also provides a clear visual separation between items. One use case example is when listing links to service locations and a corresponding distance label in the find organization unit component.
- 0 km Sentrum politistasjon
- 1 km Grønland politistasjon
- 3 km Min politistasjon
<ol class="list-group list--reset-style">
<li class="list-group__item">
<span class="list-group__label list-group__item--label">0 km</span>
<a class="list-group__button link--no-underline" href="#">Sentrum politistasjon</a>
</li>
<li class="list-group__item">
<span class="list-group__label list-group__item--label">1 km</span>
<a class="list-group__button link--no-underline" href="#">Grønland politistasjon</a>
</li>
<li class="list-group__item">
<span class="list-group__label list-group__item--label">3 km</span>
<a class="list-group__button link--no-underline" href="#">Min politistasjon</a>
</li>
</ol>