{% load cf_ui %}
{% comment %} Foundation generates the « / » arrows from `.pagination-previous a::before`
   and `.pagination-next a::after`, and disabled edges are bare text rather
than links (`.pagination-previous.disabled::before` covers that case). {% endcomment %}
<nav role="navigation" aria-label="pagination">
  <ul class="pagination {{ class }}">
    {% if page|add:"0" > 1 %}
      <li class="pagination-previous">
        <a
          hx-get="{{ hx_url }}?page={{ page|add:'-1' }}"
          hx-target="{{ hx_target }}"
        >Previous <span class="show-for-sr">page</span></a>
      </li>
    {% else %}
      <li class="pagination-previous disabled">Previous <span class="show-for-sr">page</span></li>
    {% endif %}
    {% for p in total_pages|make_list_1_to_n %}
      {% if p == page|add:'0' %}
        <li class="current" aria-current="page">
          <span class="show-for-sr">You're on page</span> {{ p }}
        </li>
      {% else %}
        <li>
          <a
            hx-get="{{ hx_url }}?page={{ p }}"
            hx-target="{{ hx_target }}"
            aria-label="Page {{ p }}"
          >{{ p }}</a>
        </li>
      {% endif %}
    {% endfor %}
    {% if page|add:"0" < total_pages|add:"0" %}
      <li class="pagination-next">
        <a
          hx-get="{{ hx_url }}?page={{ page|add:'1' }}"
          hx-target="{{ hx_target }}"
        >Next <span class="show-for-sr">page</span></a>
      </li>
    {% else %}
      <li class="pagination-next disabled">Next <span class="show-for-sr">page</span></li>
    {% endif %}
  </ul>
</nav>