{% extends 'layout.twig' %}

{% block title %}Home{% endblock %}

{% block content %}

<!-- page header -->
<header class="row">
  <div class="columns twelve">
    <h1>Register for a new account.</h1>
  </div>
</header>

<section id="record-actions" class="row">
  <div class="three columns">
    <p>.</p>
  </div>

  <div class="six columns">
    <form class="u-full-width" action="/auth/register" method="POST">
      <div class="row">
        <div class="six columns">
          <label for="register_username">
            Username:
            <input type="text" id="register_username" class="u-full-width" name="register_username" placeholder="myuser1">
          </label>
        </div>

        <div class="six columns">
          <label for="register_password">
            Password:
            <input type="password" id="register_password" class="u-full-width" name="register_password" placeholder="Enter your password...">
          </label>
        </div>
      </div>

      <div class="row">
        <div class="twelve columns">
          <label for="register_email">
            Email address:
            <input type="email" id="register_email" class="u-full-width" name="register_email" placeholder="myemail@example.com">
          </label>
        </div>
      </div>

      <div class="row">
        <div class="six columns">
          <label for="register_first_name">
            First name:
            <input type="text" id="register_first_name" class="u-full-width" name="register_first_name" placeholder="Firstname">
          </label>
        </div>

        <div class="six columns">
          <label for="register_last_name">
            Last name:
            <input type="password" id="register_last_name" class="u-full-width" name="register_last_name" placeholder="Lastname">
          </label>
        </div>
      </div>

      <input type="submit" class="button-primary u-full-width" value="Register account">
    </form>
  </div>
</section>

{% endblock %}