{% extends "auth/login_base.html" %}
{% load i18n static %}

{% block login_content %}
<form action="{% url 'idhub:login' %}" role="form" method="post">
    {% csrf_token %}
    <input type="hidden" name="next" value="{{ next }}" />

    <div id="div_id_username"
        class="clearfix control-group {% if form.username.errors %}error{% endif %}">
        <div class="form-group">
            <input type="text" name="username" maxlength="100" autocapitalize="off"
                autocorrect="off" class="form-control textinput textInput" id="id_username" required
                autofocus placeholder="{{ form.username.label }}"
                {% if form.username.value %}value="{{ form.username.value }}" {% endif %}>
            {% if form.username.errors %}
            <p class="text-error">
                {{ form.username.errors|striptags }}
            </p>
            {% endif %}
        </div>
    </div>

    <div id="div_id_password"
        class="clearfix control-group {% if form.password.errors %}error{% endif %}">
        <div class="form-group">
            <input type="password" name="password" maxlength="100" autocapitalize="off"
                autocorrect="off" class="form-control textinput textInput" id="id_password"
                placeholder="{{ form.password.label }}" required>
            {% if form.password.errors %}
            <p class="text-error">
                {{ form.password.errors|striptags }}
            </p>
            {% endif %}
        </div>
    </div>

    {% if form.non_field_errors %}
    {% for error in form.non_field_errors %}
    <div class="well well-small text-error" style="border: none">{{ error }}</div>
    {% endfor %}
    {% endif %}

    <input name="next" type="hidden" value="{{ success_url }}">

    <div class="form-actions-no-box">
        <input type="submit" name="submit" value="{% trans 'Log in' %}"
            class="btn btn-primary form-control" id="submit-id-submit">
    </div>
</form>
<div id="login-footer">
    <a href="{% url 'idhub:password_reset' %}" data-toggle="modal" data-target="#forgotPasswordModal">{% trans "Forgot your password? Click here to recover" %}</a>
</div>
{% endblock %}