{% extends "layout/immersive.html" %}
{% block content %}
<div class="immersive--content immersive--center">
  <h1>{{ _('Sign Up') }}</h1>
  <form method="POST">
    <div>
      <label class="inverse material textbox">
        {{ _('Email') }}
        <input type="text" value="{{ mail }}" disabled>
      </label>
    </div>
    <div>
      <label class="inverse material textbox">
        {{ _('Username') }}
        <input name="uname" type="text" autofocus>
      </label>
    </div>
    <div>
      <label class="inverse material textbox">
        {{ _('Password') }}
        <input name="password" type="password">
      </label>
    </div>
    <div>
      <label class="inverse material textbox">
        {{ _('Repeat Password') }}
        <input name="verifyPassword" type="password">
      </label>
    </div>
    <div class="text-center">
      <input type="hidden" name="csrfToken" value="{{ handler.csrfToken }}">
      <input type="submit" value="{{ _('user_register') }}" class="inverse expanded rounded primary button">
    </div>
  </form>
</div>
{% endblock %}