{% extends "base.html" %}
{% load i18n %}
{% load widget_tweaks %}

{% block title %}{% trans "Register for Peopleoo" %}{% endblock %}

{% block content %}
<section class="intro">

    <article>
        <h1>Sign up for Peopleoo</h1>
        <p>Start collecting feedback and get recognised for the amazing work you do every day!</p>
    </article>

    <form method="post" action=".">
        {% csrf_token %}

        {% if form.non_field_errors %}
            <div class="form-group">
                {% for error in form.non_field_errors %}
                    <span class="error-msg">{{ error }}</span>
                {% endfor %}
            </div>
        {% endif %}

        <div class="form-group">
            <label for="id_email" class="cursor-pointer">Enter your email</label>
            {{ form.email }}
            {% if form.email.errors %}
                {% for error in form.email.errors %}
                    {% if "already exists" in error %}
                        <span class="error-msg">A user with that email already exists. Try to sign in.</span>
                    {% else %}
                        <span class="error-msg">{{ error }}</span>
                    {% endif %}
                {% endfor %}
            {% endif %}
        </div>

        <div class="form-group">
            <label for="id_password1" class="cursor-pointer">Choose a password</label>
            {{ form.password1 }}
            {% if form.password1.errors %}
                {% for error in form.password1.errors %}
                    <span class="error-msg">{{ error }}</span>
                {% endfor %}
            {% endif %}
        </div>

        <div class="form-group">
            <label for="id_password2" class="cursor-pointer">Type your password again</label>
            {{ form.password2 }}
            {% if form.password2.errors %}
                {% for error in form.password2.errors %}
                    <span class="error-msg">{{ error }}</span>
                {% endfor %}
            {% endif %}
        </div>

        <input type="hidden" name="signup" value="{{ request.GET.signup }}">

        <button class="btn btn-primary mt-2 md:mt-3" type="submit">
            <span class="btn-text">{% trans 'Let’s go!' %}</span>
            <span class="btn-loader white"></span>
        </button>
    </form>

</section>
{% endblock %}