{% extends "admin/base_site.html" %}
{% load i18n %}


{% block styles %}
  {{ block.super }}
  {{ form.media.css }}
{% endblock %}

{% block scripts %}
  {{ block.super }}
  {{ form.media.js }}
{% endblock %}

{% block bodyclass %}{{ block.super }} login{% endblock %}


{% block sidebar %}{% endblock %}
{% block header %}{% endblock %}
{% block breadcrumbs %}{% endblock %}


{% block messages %}
  {{ block.super }}

  {% for error in form.non_field_errors %}
    <li class="paper-message paper-message--error">
      {{ error }}
    </li>
  {% endfor %}

  {% if user.is_authenticated %}
    <li class="paper-message paper-message--error">
      {% blocktrans trimmed %}
        You are authenticated as {{ username }}, but are not authorized to
        access this page. Would you like to login to a different account?
      {% endblocktrans %}
    </li>
  {% endif %}
{% endblock %}


{% block before_content %}{% endblock %}


{% block layout %}
  <div class="login-card m-auto">
    <div class="paper-card card border-0">
      <h2 class="card-header text-center">{{ _("Log in") }}</h2>
      <div class="card-body">
        <form action="{{ app_path }}" method="post" id="login-form">
          {% csrf_token %}
          <input type="hidden" name="next" value="{{ next }}" />

          <div class="paper-widget{% if form.password.errors %} paper-widget--invalid{% endif %}">
            <label for="{{ form.username.id_for_label }}">{{ form.username.label }}</label>
            <input type="text" name="{{ form.username.name }}"
                   value="{{ form.username.value|default:"" }}" id="{{ form.username.id_for_label }}"
                   class="form-control form-control-lg" autofocus>
          </div>
          <ul class="paper-error-list invalid-feedback">{% spaceless %}
            {% for error in form.username.errors %}
              <li>{{ error }}</li>
            {% endfor %}
          {% endspaceless %}</ul>

          <div class="paper-widget mt-3{% if form.password.errors %} paper-widget--invalid{% endif %}">
            <label for="{{ form.password.id_for_label }}">{{ form.password.label }}</label>
            <input type="password" name="{{ form.password.name }}"
                   id="{{ form.password.id_for_label }}" value="{{ form.password.value|default:"" }}"
                   class="form-control form-control-lg">
          </div>
          <ul class="paper-error-list invalid-feedback">{% spaceless %}
            {% for error in form.password.errors %}
              <li>{{ error }}</li>
            {% endfor %}
          {% endspaceless %}</ul>

          <button type="submit" class="btn btn-block btn-lg btn-info mt-4">
            {{ _("Log in") }}
          </button>
        </form>
      </div>
    </div>

    {% url 'admin_password_reset' as password_reset_url %}
    {% if password_reset_url %}
      <div class="password-reset-link text-muted text-center mt-2">
        <a href="{{ password_reset_url }}">
          <small>{{ _("Forgotten your password or username?") }}</small>
        </a>
      </div>
    {% endif %}
  </div>
{% endblock %}
