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

{% block stylesheets %}

    {{ parent() }}
        

        

        #layout
        {
            width:100%;
            /*min-height:600px;*/
            height: 75vh;
            display:flex;
            flex-direction:column;
            align-items:center;
            justify-content: center;
        }
        
        h1
        {
            width:100%;
            text-align:center;
            text-transform:uppercase;
        }




        .container {
            background-image: linear-gradient(to right,#1b2631,  #b2babb);
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            border:solid 1px;
            min-height:80%;
            min-width: 20%;
            color: #fff;
            background-color: #000;
            font-size: 1.5em;
            display: flex;
            flex-direction: column;
            box-shadow: 8px 10px 12px rgba(0, 0, 0, 0.7);
        }
        
        #container-logo 
        {
            flex:1;
            display: flex;
            flex-direction: row;
            justify-content: center;
        }

        form
        {
            margin-top: 50px; 
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            flex:3;
            font-size: 16px;
        }
        
        form span input
        {
            width: 60%;
            height:50px;
        }
        
        form span a button
        {
            width: 200px;
            height:50px;
            background-color: #f0bc26;
        }

        
{% endblock %}

{% block main_content %}

<h1>{{ title }}</h1>

<div id="layout">

    
    <div class="container">
                
        <span id="container-logo"><img src="{{ asset('img/portal/homepage/logo_160.png') }}" alt="logo"></span>        
        
        <form method="post">
         
            <span><input type="email" value="" name="email" id="inputEmail" class="form-control" autocomplete="email" required autofocus placeHolder="Email"></span>
            <span><input type="password" name="password" id="inputPassword" class="form-control" autocomplete="current-password" required placeHolder="mot de passe"></span>
            <input type="hidden" name="_csrf_token"  value="{{ csrf_token('authenticate') }}">
            <span><a><button  type="submit" id="submit">envoyer</button></a></span>
                           
                    <div id="account">
                        <p>Pas encore de compte? Créez un  <a href="{{ path('registration') }}">compte</a></p>
                    </div>      
                  
                     {% if error %}
                        <span><p class="alert">{{ error.messageKey|trans(error.messageData, 'security') }}</p></span>
                    {% endif %}
    
        </form>
                
    </div>
    
</div>

    
{% endblock %}

{% block javascript %}

{% endblock %}