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

<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="{% static "css/bulma.min.css" %}">
    <link rel="shortcut icon" type="image/png" href="{% static 'icons/accrete.svg' %}"/>
    <title>Login | Accrete</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">
                    <form method="POST" action="">
                        {% csrf_token %}
                        <span class="has-text-danger is-size-7">{{ form.non_field_errors }}</span>

                        <label class="label">{{ form.username.label_tag }}
                            {{ form.username }}
                            <span class="has-text-danger is-size-7">{{ form.username.errors }}</span>
                        </label>

                        <label class="label">{{ form.password.label_tag }}
                            {{form.password}}
                            <span class="has-text-danger is-size-7">{{ form.password.errors }}</span>
                        </label>

                        <input type="submit" class="button is-fullwidth is-success is-medium" value="{% translate 'Login' %}">
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
</body>
