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

{% set title = _('Community Search Results') %}
{% set crumbs = [(url('community.home'), _('Community Hub')),
                 (None, title)] %}

{% block content %}
  <article class="community-results">

    <section class="community-results-header">
      {% if q %}
        <h1 class="sumo-page-heading">{{ _('Results for: {query}')|f(query=q) }}</h1>
      {% else %}
        <h1 class="sumo-page-heading">{{ _('Find your fellow contributors') }}</h1>
      {% endif %}
      <form name="find-contributor" id="find-contributor" class="simple-search-form" action="" method="get">
        <fieldset>
          <input type="text" name="q" id="search" class="searchbox" value="{{ q or "" }}" placeholder="{{ _('Username or Display Name') }}" />
          <input type="submit" value="{{ _('Search') }}" class="search-button" />
        </fieldset>
      </form>
    </section>

    <section class="sumo-page-section">
      {% if q and not results %}
      <p class="sumo-page-intro">{{ _('No users were found for your search query.') }}</p>

      {% else %}
        <div class="sumo-card-grid">
          <div class="scroll-wrap">
            {% for result in results %}
              <section class="card elevation-01 results-user">
                {% if result['avatar'] %}
		              <img src="{{ result['avatar']['url'] }}" alt="" class="user-img-results card--img" />
                {% endif %}
                <div class="card--details user-details">
                  <h2 class="card--title">{{ result['name'] }}</h2>
                  <ul class="results-user-details">
                    <li>{{ result['username'] }}</li>
                    <li><a rel="nofollow" href="{{ url('users.profile', result['user_id']) }}">{{ _('View Profile') }}</a></li>
                    <li><a href="{{ url('messages.new')|urlparams(to=result['username']) }}">{{ _('Private Message') }}</a></li>
                  </ul>
                </div>
              </section>
            {% endfor %}
          </div>
        </div>
      {% endif %}
    </section>

    {% if pages %}
      {{ pages|paginator }}
    {% endif %}

  </article>
{% endblock %}