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

{% block title %}Connexion{% endblock %}

{% block stylesheet %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('assets/vendor/circle-flip-slideshow/css/component.css') }}">
{% endblock %}

{% block url %}connexion{% endblock %}
{% block m_url %}connexion{% endblock %}

{% block loading %}{% endblock %}

{% block main %}
<div role="main" class="main">
    <section class="page-header page-header-modern bg-color-light-scale-1 page-header-lg">
        <div class="container">
            <div class="row">
                <div class="col-md-12 align-self-center p-static order-2 text-center">
                    <h1 class="font-weight-bold text-dark">Connexion</h1>
                </div>
                <div class="col-md-12 align-self-center order-1">
                    <ul class="breadcrumb d-block text-center">
                        <li><a href="{{ path('app_home') }}">Accueil</a></li>
                        <li class="active">Connexion</li>
                    </ul>
                </div>
            </div>
        </div>
    </section>

    <div class="container py-4">

        <div class="row justify-content-center">
            <div class="col-md-6 col-lg-5">
                <form method="post" class="needs-validation">
                    {% if error %}
                        <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
                    {% endif %}

                    {% if app.user %}
                        <div class="mb-3">
                            Vous êtes connecté en tant que {{ app.user.userIdentifier }}, <a href="{{ path('app_logout') }}">Logout</a>
                        </div>
                    {% endif %}

{#                    <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>#}
                    <div class="row">
                        <div class="form-group col">
                            <label class="form-label text-color-light text-3" for="inputEmail">Email</label>
                            <input type="email" placeholder="Votre adresse mail" value="{{ last_username }}" name="email" id="inputEmail" class="form-control form-control-lg text-light text-4" autocomplete="email" required autofocus>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group col">
                            <label class="form-label text-color-light text-3" for="inputPassword">Mot de passe</label>
                            <input type="password" placeholder="Votre mot de passe" name="password" id="inputPassword" class="form-control form-control-lg text-light text-4" autocomplete="current-password" required>
                        </div>
                    </div>

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

                    <div class="row">
                        <div class="form-group col">
                            <button class="btn btn-light btn-modern w-100 text-uppercase rounded-0 font-weight-bold text-3 py-3" type="submit">
                                Connexion
                            </button>
                        </div>
                    </div>
                </form>
                <div class="d-flex flex-column align-items-end">
                    <a href="{{ path('app_forgot_password_request') }}">Mot de passe oublié ?</a>
                    <a href="{{ path('app_register') }}">Pas encore de compte ?</a>
                </div>

            </div>
        </div>

    </div>

</div>
{% endblock %}

{% block scripts %}
    {{ parent() }}
{% endblock %}