{% extends "three-column-content.html" %}

{% block three_col_js %}
    {% block users_js_media %}{% endblock %}
    {% include "user/base-users-js.html" %}
{% endblock %}

{% block three_col_media %}
    <link href="http://fonts.cdnfonts.com/css/jersey-m54" rel="stylesheet">
    <style>
        @media (min-width: 800px) {
            .middle-content {
                max-width: none;
                padding-left: 1em;
            }
        }
    </style>
    {% block users_media %}{% endblock %}
{% endblock %}

{% block middle_content %}
    <div id="common-content">
        <div id="content-left" class="users">
            {% if page_obj and page_obj.num_pages > 1 %}
                <div style="margin-bottom: 7px; margin-top: 3px;">
                    {% include "list-pages.html" %}
                    <form id="search-form" name="form" action="{{ url('user_ranking_redirect') }}" method="get">
                        <input id="search-handle" type="text" name="search"
                               placeholder="{{ _('Search by handle...') }}">
                    </form>
                </div>
            {% endif %}

            <table id="users-table" class="table">
                {% block users_table %}{% endblock %}
            </table>

            {% if page_obj and page_obj.num_pages > 1 %}
                <div style="margin-top:10px;">{% include "list-pages.html" %}</div>
            {% endif %}
        </div>
    </div>
{% endblock %}