{% extends 'security.html.twig' %}

{% block style %}
<style>
    #formDiv {
        align-content:center;
        color:#05070D;
    }

    form {
        background-color:#081B26;
        color:white;
        display: flex;
        flex-direction: column;
        padding: 60px;
        padding-top: 40px;
        padding-bottom: 40px;
        border-radius: 20px;
    }

    form h1 {
        margin-top: 0px;
        margin-bottom: 40px;
    }

    form label {
        margin-bottom: 10px;
    }

    form input {
        margin-bottom: 20px;
        border: solid 1px #05070D;
        border-radius: 20px;
        padding: 10px;
    }

    form button {
        margin-top:20px;
        background-color: #05070D;
        border: solid 1px #05070D;
        border-radius: 10px;
        color: white;
        font-size: 20px;
        padding: 10px;
    }

    .alert {
        margin-top:40px;
    }
</style>
{% endblock %}

{% block nav %}
    <div>
        <a href="{{ path('app_register') }}">Inscription</a>
    </div>
{% endblock %}

{% block body %}
    <div id="formDiv">
        <form method="post">

        {% if app.user %}
            <div class="mb-3">
                Vous êtes déjà connecté en tant que {{ app.user.userIdentifier }}, <a href="{{ path('app_logout') }}">se déconnecter</a>
            </div>
        {% else %}
            <h1 class="h3 mb-3 font-weight-normal">Connectez-vous</h1>
            <label for="username">Nom d'utilisateur</label>
            <input type="text" value="{{ last_username }}" name="_username" id="username" class="form-control" autocomplete="username" required autofocus>
            <label for="password">Mot de passe</label>
            <input type="password" name="_password" id="password" class="form-control" autocomplete="current-password" required>

            <input type="hidden" name="_csrf_token"
                value="{{ csrf_token('authenticate') }}"
            >

            {#
                Uncomment this section and add a remember_me option below your firewall to activate remember me functionality.
                See https://symfony.com/doc/current/security/remember_me.html

                <div class="checkbox mb-3">
                    <label>
                        <input type="checkbox" name="_remember_me"> Remember me
                    </label>
                </div>
            #}

            <button class="btn btn-lg btn-primary" type="submit">
                Connexion
            </button>
        {% endif %}

        {% if error %}
            <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
        {% endif %}

        </form>
    </div>
{% endblock %}