<nav class="vf-pagination" aria-label="Pagination">
  <ul class="vf-pagination__list">
    {% for item in pagination__list %}
    <li class="vf-pagination__item{% if item.item_modifier %} {{ item.item_modifier }}{% endif %}">
      {% if item.page_href %}
      <a
      href="{{ item.page_href }}"
      class="vf-pagination__link">
        {{ item.page_number }}<span class="vf-u-sr-only"> page</span>
      </a>
      {% elseif item.item_modifier == "vf-pagination__item--is-active" %}
      <span class="vf-pagination__label" aria-current="page">
        <span class="vf-u-sr-only">Page </span>{{ item.page_number }}
      </span>
      {% else %}
      <span class="vf-pagination__label">{{ item.page_number }}</span>
      {% endif %}
    </li>
    {% endfor %}
  </ul>
</nav>
