{% extends "misago/userslists/base.html" %}
{% load i18n misago_pagetitle misago_shorthands misago_stringutils %}


{% block title %}{% pagetitle rank.name page=paginator.page %} | {{ block.super }}{% endblock %}


{% block meta-description %}
  {{ rank.description|default:"" }} {% blocktrans trimmed count users=paginator.count %}
    {{ users }} user have this rank.
  {% plural %}
    {{ users }} users have this rank.
  {% endblocktrans %}
{% endblock %}


{% block meta-extra %}
  {% if paginator.page > 1 %}
    <link rel="canonical" href="{% url 'misago:users-rank' slug=rank.slug page=paginator.page %}" />
  {% else %}
    <link rel="canonical" href="{% url 'misago:users-rank' slug=rank.slug %}" />
  {% endif %}
  {% if paginator.previous > 1 %}
    <link rel="prev" href="{% url 'misago:users-rank' slug=rank.slug page=paginator.previous %}" />
  {% elif paginator.previous %}
    <link rel="prev" href="{% url 'misago:users-rank' slug=rank.slug %}" />
  {% endif %}
  {% if paginator.next %}
    <link rel="next" href="{% url 'misago:users-rank' slug=rank.slug page=paginator.next %}" />
  {% endif %}
{% endblock meta-extra %}


{% block og-title %}
  {{ rank.name }}
{% endblock og-title %}


{% block og-description %}
  {% if rank.description %}
    {{ rank.description }}
  {% endif %} {% blocktrans trimmed count users=paginator.count %}
    {{ users }} user have this rank.
  {% plural %}
    {{ users }} users have this rank.
  {% endblocktrans %}
{% endblock og-description %}


{% block og-url %}{{ SITE_ADDRESS }}{{ rank.get_absolute_url }}{% endblock %}


{% block content %}
{{ block.super }}

<div class="rank-users-list{% if rank.css_class %} rank-users-{{ rank.css_class }}{% endif %}">
  <div class="container">

    {% if rank.description %}
      <section class="rank-description">
        <div class="page-lead {{ rank.description|force_escape|linebreaks|isdescriptionshort|iftrue:"lead" }}">
          {{ rank.description|force_escape|urlize|linebreaks|safe }}
        </div>
      </section>
    {% endif %}

    {% if paginator.count %}
      <section>
        <div class="users-cards-list ui-ready" itemscope itemtype="http://schema.org/ItemList">
          <div class="row">
            {% for user in users %}
              <div class="col-xs-12 col-sm-4 col-md-3" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
                {% include "misago/userslists/usercard.html" with user=user %}
                <meta itemprop="position" content="{{ paginator.before|add:forloop.counter }}" />
              </div>
            {% endfor %}
          </div>
          <meta itemprop="numberOfItems" content="{{ paginator.count }}">
          <meta itemprop="itemListOrder" content="http://schema.org/ItemListOrderAscending">
        </div>

        {% if paginator.pages > 1 %}
          <div class="pager-undercontent">
            <nav role="navigation" itemscope itemtype="http://schema.org/SiteNavigationElement">
              <ul class="pager">
                {% if paginator.previous > 1 %}
                <li class="previous">
                  <a href="{% url 'misago:users-rank' slug=rank.slug page=paginator.previous %}" rel="prev" title="{% trans 'Go to previous page' %}">
                    <span aria-hidden="true" class="material-icon">
                      arrow_back
                    </span>
                  </a>
                </li>
                {% elif paginator.first %}
                <li class="previous">
                  <a href="{% url 'misago:users-rank' slug=rank.slug %}" rel="prev" title="{% trans 'Go to previous page' %}">
                    <span aria-hidden="true" class="material-icon">
                      arrow_back
                    </span>
                  </a>
                </li>
                {% endif %}
                {% if paginator.next %}
                <li class="next">
                  <a href="{% url 'misago:users-rank' slug=rank.slug page=paginator.next %}" rel="next" title="{% trans 'Go to next page' %}">
                    <span aria-hidden="true" class="material-icon">
                      arrow_forward
                    </span>
                  </a>
                </li>
                {% endif %}
              </ul>
            </nav>
          </div>
        {% endif %}
      </section>
    {% else %}
      <p class="lead">
        {% trans "There are no users with this rank at the moment." %}
      </p>
    {% endif %}

  </div>
</div>
{% endblock content %}