{% extends 'authbase' %} 
{% block title_name %}Sign Up {% endblock %}
{% block login %}
<h2>Sign Up</h2>
<form action="{{ page.auth.register }}" method="POST" class="auth-form" accept-charset="utf-8">
	{% include "error_comp" %}
  <label class="auth-form__label" for="username">
    Username
    <input
      class="auth-form__input"
      autofocus
      name="username"
      required
      id="username"
      type="text"
	  {% if payload.username %}
          value={{ payload.username }}
      {% endif %}
    />
  </label>

  <label class="auth-form__label" for="email">
    Email
    <input
		class="auth-form__input"
		name="email"
		id="email"
		type="email"
	  {% if payload.email %}
          value={{ payload.email }}
      {% endif %}

	/>
  </label>

  <label class="auth-form__label" for="password">
    password
    <input
      class="auth-form__input"
      name="password"
      required
      id="password"
      type="password"
	  {% if payload.password %}
          value={{ payload.password }}
      {% endif %}
    />
  </label>

  <label class="auth-form__label" for="confirm_password">
    Re-enter Password
    <input
      class="auth-form__input"
      name="confirm_password"
      required
      id="confirm_password"
      type="password"
	  {% if payload.confirm_password %}
          value={{ payload.confirm_password }}
      {% endif %}
    />
  </label>
  <div class="auth-form__action-container">
    <a href="/forgot-password">Forgot password?</a>
    <button class="auth-form__submit" type="submit">Sign Up</button>
  </div>
</form>

<p class="auth-form__alt-action">
  Already have an account?
  <a href="{{ page.auth.login }}"> Login </a>
</p>
{% endblock %}