{% extends "base.html" %}
{% block content %}

<div id="signup" class="container-fluid block-center">
    <div class="row">

        <div class="col-md-3"></div>

        <div class="form-group col-md-6">
            <form action="/user/signup" method="POST" role="form">
                <input name="__anti-forgery-token" type="hidden" value="{{af-token}}"/>
                <h3>Please create your account</h3>

                <div class="form-group">
                    <label for="email">Email</label>
                    {% if email-error %}
                    <div id="email-error" class="alert alert-danger">{{email-error}}</div>
                    {% endif %}
                    <p><input class="form-control" id="email" name="email" tabindex="1" type="text" autocomplete="off"
                              {% if email %} value="{{email}}" {% endif %}/></p>
                </div>

                <div class="form-group">
                    <label for="password">Password</label>
                    {% if pass-error %}
                    <div id="pass-error" class="alert alert-danger">{{pass-error}}</div>
                    {% endif %}
                    <p>
                        <input class="form-control" id="password" name="password" tabindex="2" type="password" autocomplete="off"/>
                    </p>
                </div>

                <div class="form-group">
                    <label for="confirm">Confirm Password</label>

                    {% if confirm-error %}
                    <div id="confirm-error" class="alert alert-danger">{{confirm-error}}</div>
                    {% endif %}
                    <p>
                        <input class="form-control" id="confirm" name="confirm" tabindex="3" type="password" autocomplete="off"/>
                    </p>
                </div>

                <div class="form-group">
                    <input class="btn btn-primary" tabindex="4" type="submit" value="Create Account">
                </div>
            </form>
        </div>

        <div class="col-md-3"></div>


    </div>
</div>

{% endblock %}