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

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

{% block body %}
    
    <div class="container-fluid bg-success">
        <div class="row">
            
            <div class="offset-md-4 col-md-4 position-relative padding-0" style="height:100vh">
                 
                 <div class="position-absolute top-50 start-50 translate-middle w-100">
                    <div class="card">
                        <div class="card-body">
                            <form action="{{ path('app_login') }}" method="post">
                                {% 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') }}">Deconnexion</a>
                                    </div>
                                {% endif %}
                                <p class="text-center">
                                    <img src="{{ asset('public/img/logo.png') }}" style="width:150px;" alt="logo">
                                </p>
                                <h1 class="h3 mb-3 font-weight-normal text-center">Connexion</h1>

                                <label for="inputEmail">Email</label>
                                <input type="email" value="{{ last_username }}" name="_username" id="inputEmail" class="form-control" autocomplete="email" required autofocus>
                                <label for="inputPassword">Mot de passe</label>
                                <input type="password" name="_password" id="inputPassword" class="form-control" autocomplete="current-password" required>

                                <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
                                <div class="checkbox mb-3">
                                    <label>
                                        <input type="checkbox" name="_remember_me"> Se souvenir de moi
                                    </label>
                                </div>

                                <div class="d-grid  mx-auto">
                                    <button class="btn btn-success" type="submit" style="background:orange;border: 1px solid orange"> Se connecter</button>
                                </div>
                            </form>
                                
                            <p class="text-center mt-3">
                                Pas encore de compte <a href="{{ path('app_register') }}" style="color:green;text-decoration: none;">
                                    inscrivez-vous ici</a> ?
                            </p>
                        </div>
                   </div>
                 </div>
                 
                 
            </div>
        </div>
    </div>

            
      

{% endblock %}