{% extends 'base.html' %}

{% load i18n %}

{% block content %}

    <div class="row">
        <div class="col s12 m8 offset-m2 l6 offset-l3">
            <div class="card hoverable">
                <div class="card-content">
                    <div class="row">
                        {% if form.errors %}
                        <h5 class="red-text text-darken-1 flow-text center-align">Your username and password didn't match. Please try again.</h5>
                        {% endif %}
                        <form class="col s12" method="post" action="{% url 'login' %}">
                            {% csrf_token %}
                            <input type="hidden" name="next" value="{{ next }}">
                            <div class="row">
                                <div class="input-field col s12">
                                    <i class="material-icons prefix">account_circle</i>
                                    <input id="username" name="username" type="text" class="validate">
                                    <label for="username">{% trans 'Username' %}</label>
                                </div>
                            </div>
                            <div class="row">
                                <div class="input-field col s12">
                                    <i class="material-icons prefix">lock</i>
                                    <input id="password" name="password" type="password" class="validate">
                                    <label for="password">{% trans 'Password' %}</label>
                                </div>
                            </div>
                            <input class="waves-effect waves-light btn-large right green" type="submit" value="{% trans 'Enter' %}" />
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}