{% load i18n %}
<div class="col-auto pr-0">
  {% if page.has_previous %}
    <a href="{% url root_link %}{{ querystring }}" class="btn btn-light btn-sm" data-tooltip="top" title="{% trans 'Go to first page' %}">
      {% trans "First" %}
    </a>
  {% else %}
    <button class="btn btn-light btn-sm" disabled>
      {% trans "First" %}
    </button>
  {% endif %}
  {% if page.number > 1 %}
    <a href="{% url root_link page=page.previous_page_number %}{{ querystring }}" class="btn btn-light btn-sm" data-tooltip="top" title="{% trans 'Go to previous page' %}">
      <span class="fa fa-chevron-left"></span>
    </a>
  {% else %}
    <button class="btn btn-light btn-sm" disabled>
      <span class="fa fa-chevron-left"></span>
    </button>
  {% endif %}
  {% if page.next_page_number < paginator.num_pages %}
    <a href="{% url root_link page=page.next_page_number %}{{ querystring }}" class="btn btn-light btn-sm" data-tooltip="top" title="{% trans 'Go to next page' %}">
      <span class="fa fa-chevron-right"></span>
    </a>
  {% else %}
    <button class="btn btn-light btn-sm" disabled>
      <span class="fa fa-chevron-right"></span>
    </button>
  {% endif %}
  {% if page.has_next %}
    <a href="{% url root_link page=paginator.num_pages %}{{ querystring }}" class="btn btn-light btn-sm" data-tooltip="top" title="{% trans 'Go to last page' %}">
      {% trans "Last" %}
    </a>
  {% else %}
    <button class="btn btn-light btn-sm" disabled>
      {% trans "Last" %}
    </button>
  {% endif %}
</div>
<div class="col-auto">
  {% blocktrans trimmed with page=page.number pages=paginator.num_pages %}
    Page {{ page }} of {{ pages }}
  {% endblocktrans %}
</div>