{% extends 'base.html' %}                                                                                                                      
{% load i18n %}

{% block title %}{% trans 'Create a new ivatar account' %}{% endblock title %}

{% block content %}

<h1>{% trans 'Create a new account' %}</h1>

{% if form.username.errors %}
<div class="alert alert-danger" role="alert">{{ form.username.errors }}</div>
{% endif %}
{% if form.password1.errors %}
<div class="alert alert-danger" role="alert">{{ form.password1.errors }}</div>
{% endif %}
{% if form.password2.errors %}
<div class="alert alert-danger" role="alert">{{ form.password2.errors }}</div>
{% endif %}
<form action="{% url 'new_account' %}" method="post" name="newaccount">
{% csrf_token %}
<div style="max-width:640px">
<div class="form-group">
<label for="id_username">{% trans 'Username' %}:</label>
<input type="text" name="username" autofocus required class="form-control" id="id_username">
</div>
<div class="form-group">
<label for="id_password1">{% trans 'Password' %}:</label>
<input type="password" name="password1" class="form-control" required id="id_password1">
</div>
<div class="form-group">
<label for="id_password2">{% trans 'Password confirmation' %}:</label>
<input type="password" name="password2" class="form-control" required id="id_password2">
</div>
<button type="submit" class="button">{% trans 'Create account' %}</button> or <a href="/accounts/login/" class="button">{% trans 'Login' %}</a>
</form>
</div>
<div style="height:40px"></div>
{% endblock content %}
