{% extends base_template %}
{% load i18n %}
{% load my_filters %}
{% load staticfiles %}

{% block headcss %}{{ block.super }}
    <link rel="stylesheet" href="{% static 'css/distributed/search.css' %}">
{% endblock headcss %}

{% block title %}{{ title }}{% endblock title %}

{% block content %}
    {% if query_error %}
        <h2 class="errorlist">{{ query_error }}</h2>

    {% else %}
        <h2>{{ title }}</h2>
        <div class="container container-fluid search-results">
            <div class="row">
            {% for category, subresults in results.iteritems %}
                <div class="col-sm-4 category-col">    
                    <h3>{{ category }}
                    {% if hit_max|get_item:category %}
                        <br class="visible-sm"/>
                        <small>({% blocktrans %}showing first {{ max_results }} results{% endblocktrans %})</small>
                    {% endif %}</h3>
                    <ul class="subresults-list">
                    {% for node in subresults %}
                        <li class="subresults-item">
                            <a href="{% url 'learn' %}{{ node.path }}" class="{{ node.kind }}-{% if not node.available %}un{% endif %}available">{% trans node.title %}</a>
                        </li>
                    {% endfor %}
                    </ul>
                </div>
                <hr class="visible-xs">
            {% endfor %}
            </div>
            {% if more or page > 1 %}
            <nav>
              <ul class="pagination">
                <li {% if page == 1 %}class="disabled"{% endif %}>
                  <a href="{{ previous_url }}" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                  </a>
                </li>
                <li class="active"><a href="#">{{ page }} <span class="sr-only">({% trans "current" %})</span></a></li>
                <li {% if not more %}class="disabled"{% endif %}>
                  <a href="{{ next_url }}" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                  </a>
                </li>
              </ul>
            </nav>
            {% endif %}
        </div>
    {% endif %}
{% endblock %}
