{% extends "comments/base.html" %}

{% load i18n %}
{% load comments_ink %}

{% block title %}{% blocktrans %}Who reacted with {{ reaction }}{% endblocktrans %}{% endblock %}

{% block content %}
<main>
  <article>
    <div class="container">
      <h2 class="text-center">{% blocktrans with reaction_icon=reaction.icon %}List of users that reacted with <span class="emoji">&{{ reaction_icon }};</span> to{% endblocktrans %}<br/><span id="users"></span><a href="{{ object.get_absolute_url }}">{{ object }}</a></h2>
    </div>
    <div class="central-column">
      <div class="{% dci_custom_selector %} mt32 xpb32">
        <div class="users-grid">
          {% for author_name in page_obj %}
            <div>{{ author_name }}</div>
          {% endfor %}
        </div>

        {% if page_obj.paginator.num_pages > 1 %}
          <div class="inline-centered pagination">
            <span class="step-links">
              {% if page_obj.has_previous %}
                <a href="?page=1#users">&laquo; first</a>
                <a href="?page={{ page_obj.previous_page_number }}#users">previous</a>
              {% endif %}

              <span class="current">
                Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
              </span>

              {% if page_obj.has_next %}
                <a href="?page={{ page_obj.next_page_number }}#users">next</a>
                <a href="?page={{ page_obj.paginator.num_pages }}#users">last &raquo;</a>
              {% endif %}
            </span>
          </div>
        {% endif %}
      </div>
    </div>
  </article>
</main>
{% endblock %}
