{% extends "base_short.html" %}
{% load i18n staticfiles bootstrap3 %}

{% block title %}
    <title> Register an user at ungleich </title>
{% endblock %}

{% block content %}
    <div class="auth-container">
        <div class="auth-bg"></div>
        <div class="auth-center">
            <div class="auth-content">
                <div class="auth-box">
                    <h1 class="section-heading allcaps">{% trans "Sign Up" %}</h1>
                    {% include 'includes/_messages.html' %}
                    <form action="{% url 'register' %}" method="post" class="form" novalidated>
                        {% csrf_token %}
                        <div class="form-group">
                            <label class="sr-only control-label" for="username">Username</label>
                            <input type="text" name="username" class="form-control" placeholder="Username (alphanumeric)" title="" required="" id="username">
                        </div>
                        <div class="form-group">
                            <label class="sr-only control-label" for="password1">password1</label>
                            <input type="password" name="password1" class="form-control" placeholder="Password (at least 8 characters):" title="" required="" id="password1">
                        </div>
                        <div class="form-group">
                            <label class="sr-only control-label" for="password2">password2</label>
                            <input type="password" name="password2" class="form-control" placeholder="Please confirm your Password:" title="" required="" id="password2">
                        </div>
                        <div class="form-group">
                            <label class="sr-only control-label" for="firstname">First Name</label>
                            <input type="text" name="firstname" class="form-control" placeholder="firstname" title="" required="" id="firstname">
                        </div>
                        <div class="form-group">
                            <label class="sr-only control-label" for="lastname">Last Name</label>
                            <input type="text" name="lastname" class="form-control" placeholder="lastname" title="" required="" id="lastname">
                        </div>
                        <div class="form-group">
                            <label class="sr-only control-label" for="id_email">Email</label>
                            <input type="text" name="email" class="form-control" placeholder="Email" title="" required="" id="email">
                        </div>


                        <p class="red">{{form.non_field_errors|striptags}}</p>
                        <div class="text-center">
                            <button type="submit" class="btn choice-btn btn-block">
                                {% trans "Register" %}
                            </button>
                        </div>
                    </form>
                    <div class="auth-footer">
                        <div>
                            {% trans "If you already have an account" %}&nbsp;<a href="{% url 'index' %}">{% trans "Sign In" %}</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}