<!doctype html>
{% load static %}
{% load i18n %}

<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    {% block bulma %}
            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css">
        {% endblock %}
    {% block favicon %}<link rel="shortcut icon" type="image/png" href="{% static 'icons/accrete.svg' %}"/>{% endblock %}
    <title>{% block title %}Registration | Accrete{% endblock %}</title>
</head>
<body>
<section class="hero is-primary is-medium is-bold is-fullheight">
    <div class="hero-body">
        <div class="container">
            <div class="columns">
                <div class="column box is-8-tablet is-offset-2-tablet is-6-desktop is-offset-3-desktop is-4-fullhd is-offset-4-fullhd">
                    {% block form %}
                        <form method="POST" action="" id="customer-form">
                            {% csrf_token %}
                            <span class="has-text-danger is-size-7">{{ form.non_field_errors }}</span>
    
                            <label class="label">{{ form.email.label_tag }}
                                {{ form.email }}
                                <span class="has-text-danger is-size-7">{{ form.email.errors }}</span>
                            </label>
    
                            <label class="label">{{ form.password1.label_tag }}
                                {{ form.password1 }}
                                <span class="has-text-danger is-size-7">{{ form.password1.errors }}</span>
                            </label>
    
    
                            <label class="label">{{ form.password2.label_tag }}
                                {{ form.password2 }}
                                <span class="has-text-danger is-size-7">{{ form.password2.errors }}</span>
                            </label>
    
                            <input type="submit" class="button is-fullwidth is-success is-medium" value="{% trans 'Register' %}">
                        </form>
                    {% endblock %}
                </div>
            </div>
        </div>
    </div>
</section>
</body>
