<nav class="page-navigation">
  <ul class="page-navigation__items">
    <li class="page-navigation__item page-navigation__item--prev"><a class="icon-link page-navigation__link" href="/previous"><span class="icon-link__icon"><svg class="icon icon--arrow-left" viewBox="0 0 200 200">
  <use xlink:href="#icon-arrow-left"></use>
</svg></span><span class="icon-link__text page-navigation__desktop">vorheriger Begriff</span><span class="icon-link__text page-navigation__mobile">Zurück</span><span class="page-navigation__term">Dunnock</span></a></li>
    <li class="page-navigation__item page-navigation__item--next"><a class="icon-link icon-link--right page-navigation__link" href="/next"><span class="icon-link__text page-navigation__desktop">nächster Begriff</span><span class="icon-link__text page-navigation__mobile">Weiter</span><span class="icon-link__icon"><svg class="icon icon--arrow-right" viewBox="0 0 200 200">
  <use xlink:href="#icon-arrow-right"></use>
</svg></span><span class="page-navigation__term">Dusky Dolphin with a name that is a bit longer</span></a></li>
    <li class="page-navigation__item page-navigation__item--overview"><a class="icon-link" href="/overview"><span class="icon-link__icon"><svg class="icon icon--grid" viewBox="0 0 200 200">
  <use xlink:href="#icon-grid"></use>
</svg></span><span class="icon-link__text">Zur Übersicht</span></a></li>
  </ul>
</nav>

{
  "prev": {
    "text": "vorheriger Begriff",
    "mobileText": "Zurück",
    "link": "/previous",
    "term": "Dunnock"
  },
  "next": {
    "text": "nächster Begriff",
    "mobileText": "Weiter",
    "link": "/next",
    "term": "Dusky Dolphin with a name that is a bit longer"
  },
  "overview": {
    "text": "Zur Übersicht",
    "link": "/overview",
    "icon": "grid",
    "left": true,
    "right": null
  }
}