{% extends "auth/base.html" %}
{% block title %}WLAN Pi: Change Password{% endblock %}
{% block subtitle %}Your password has expired. Set a new one to continue.{% endblock %}
{% block content %}
{% if error %}
<div class="uk-alert-danger" uk-alert><p>{{ error }}</p></div>
{% endif %}
<form method="post" action="{{ url_for('auth.change_password') }}">
  <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
  <div class="uk-margin">
    <div class="uk-inline uk-width-1-1">
      <span class="uk-form-icon" uk-icon="icon: user"></span>
      <input class="uk-input" type="text" name="username" placeholder="Username" autocomplete="username" required
        autofocus{% if username %} value="{{ username }}"{% endif %}>
    </div>
  </div>
  <div class="uk-margin">
    <div class="uk-inline uk-width-1-1">
      <span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: lock"></span>
      <input class="uk-input" type="password" name="current_password" placeholder="Current password"
        autocomplete="current-password" required>
    </div>
  </div>
  <div class="uk-margin">
    <div class="uk-inline uk-width-1-1">
      <span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: lock"></span>
      <input class="uk-input" type="password" name="new_password" placeholder="New password"
        autocomplete="new-password" required>
    </div>
  </div>
  <div class="uk-margin">
    <div class="uk-inline uk-width-1-1">
      <span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: lock"></span>
      <input class="uk-input" type="password" name="new_password_confirm" placeholder="Confirm new password"
        autocomplete="new-password" required>
    </div>
  </div>
  <div class="uk-margin">
    <button class="uk-button uk-button-primary uk-width-1-1" type="submit">Change password</button>
  </div>
</form>
{% endblock %}