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

{% load i18n %}

{% block head_title %}{% trans "Change Password" %}{% endblock %}

{% block content %}
    <div class="col-lg-12 col-md-12">
      <div class="text-left">
          <h3>{% trans "New User" %}</h3>
      </div>
    </div>
    <div class="col-lg-12 col-md-12">
        <div class="p-1 p-md-3">
          <p class="p-3 bg-light">
            {% blocktrans trimmed %}
              First, enter a username and password. Then, you’ll be able to edit more user options.
            {% endblocktrans %}
          </p>
          <div>
            <ul class="list-unstyled">
              {% for message in messages %}
              <li>{{message}}</li>
              {% endfor %}
            </ul>
          </div>
          <!-- form error messages -->
            {% if form.errors %}
              <ul class='form-errors text-danger list-unstyled'>
                {% for field in form %}
                    {% for error in field.errors %}
                      <li><i class="fa fa-exclamation-triangle m-2"></i>{{ error|escape }}</li>
                    {% endfor %}
                {% endfor %}
                {% for error in form.non_field_errors %}
                    <li>{{ error|escape }}</li>
                {% endfor %}
              </ul>
            {% endif %}
            <!-- form error messages -->
            <form class="change_password" method="POST" action="{% url 'core:user' %}">
              {% csrf_token %}
              <div class="form-group">
               <label class="mb-10" for="id_username">{% trans "Username" %}</label>
                 <input id="id_username" class="form-control" type="text" placeholder='{% trans "username" %}...' name="username" required>
              </div>

                <div class="form-group">
                  {{ form.password1.errors }}
                 <label class="mb-10" for="id_password1">{% trans "Password" %}</label>
                   <input id="id_password1" class="form-control" type="password" placeholder='{% trans "password" %}...' name="password1" required>
                </div>
                <div class="form-group">
                  {{ form.password2.errors }}
                 <label class="mb-10" for="id_login">{% trans "Password confirmation" %}</label>
                   <input id="id_email" class="form-control" type="password" placeholder='{% trans "password (confirmation)" %}...' name="password2" required>
                </div>
                <button class="button btn btn-success" type="submit">
                  <i class="fa fa-check"></i>
                  {% trans 'Continue' %}
                </button>
            </form>
        </div>
        <div class="p-1 p-md-3 bg-light text-dark">
          <ul class="list-unstyled">
            <li>
              <i class="fa fa-info-circle text-success m-2"></i>
              {% trans "Your password can’t be too similar to your other personal information." %}
            </li>
            <li>
              <i class="fa fa-info-circle text-success m-2"></i>
              {% trans "Your password must contain at least 8 characters." %}
            </li>
            <li>
              <i class="fa fa-info-circle text-success m-2"></i>
              {% trans "Your password can’t be a commonly used password." %}
            </li>
            <li>
              <i class="fa fa-info-circle text-success m-2"></i>
              {% trans "Your password can’t be entirely numeric." %}
            </li>
          </ul>
        </div>
    </div>
{% endblock %}