{% extends "base.html" %}

{% set active_page = "Login" %}

{% block body %}

{% from "security/_macros.html" import render_errors %}
{{ render_errors(login_user_form.email) }}
{{ render_errors(login_user_form.password) }}

<div class="row justify-content-center"></div>
    <div class="col-sm-6 mx-auto">
        <h3 class="mx-3 mt-4">Login</h3>

        <div class="card {% if login_user_form.password.errors or login_user_form.email.errors %}border-danger{% else %}border-white{% endif %} p-3">

            <form action="{{ url_for_security('login') }}" method="POST" name="login_user_form">

                {{ login_user_form.hidden_tag() }}

                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text"><i class="fas fa-user"></i></span>
                    </div>
                    <input id="email" type="text" class="form-control" name="email" value="" placeholder="username" autofocus="autofocus" required>
                </div>

                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text"><i class="fas fa-lock"></i></span>
                    </div>
                    <input id="password" type="password" class="form-control" name="password" placeholder="password" required>
                </div>

                <input id="next" name="next" type="hidden" value="/">

                <button class="btn btn-primary" id="submit" name="submit" type="submit">Login</button>

            </form>

        </div>
    </div>
</div>

{% endblock %}