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

{% block title %}{{ parent() }}-Registo de usuario{% endblock %}


{% block body %}
    <style>
        #message{
            display: none;
        }
        #password{
            display: none;
        }
    </style>
    <script>
          var pass= document.getElementById("password");
          var mess= document.getElementById("message");
          var st= document.getElementById("strenght");

        pass.addEventListener('input',()=>{
            if (pass.value.length > 0){
                mess.style.display = "block";
            }else{
                mess.style.display = "none";
            }
        });
    </script>

    {% for flash_error in app.flashes('verify_email_error') %}
        <div class="alert alert-danger" role="alert">{{ flash_error }}</div>
    {% endfor %}


    <div class="login-user-register">
        <div class="login-bemvindo-register">
            <h2>Seja bem vindo!</h2>
            <h4>ao portal do SIGAP</h4>
            <img src="{{ asset('img/governo-de-angola.png') }}">
        </div>
        <div class="form-login unic-login form-reg">
            <h1 style="font-size: 23px ; text-align: center;
            color:var(--bgColor-1); margin-top: 15px;
            ">Criar conta no SIGAP</h1>

            {{ form_start(registrationForm) }}
            <div class="col-lg-12">
                {{ form_label(registrationForm.nome,'Nome*') }}
                {{ form_widget(registrationForm.nome,{attr:{'placeholder':'Digite seu nome ou da empresa','class':'caixa shadow-none'}}) }}
            </div>
            <div class="col-lg-12">
                {{ form_label(registrationForm.nome,'NIF*') }}
                {{ form_widget(registrationForm.nif,{attr:{'placeholder':'Digite o número de identificação fiscal','class':'caixa shadow-none'}}) }}
            </div>
            <div class="col-lg-12">
                {{ form_label(registrationForm.email,'Email*') }}
                {{ form_widget(registrationForm.email,{attr:{'placeholder':'exemplo@dominio.com','class':'caixa shadow-none'}}) }}
            </div>
            <div class="col-lg-12">
                {{ form_label(registrationForm.plainPassword,'Senha*') }}
                {{ form_widget(registrationForm.plainPassword,{attr:{'placeholder':'Deve digitar no mínimo 6 digitos','class':'caixa shadow-none','id':'password'}}) }}
                <p id="message">password é <span id="strenght"></span></p>
            </div>
            <div class="col-lg-12 my-3">
                {{ form_widget(registrationForm.agreeTerms) }}
            </div>

            <div class="col-lg-12 my-3">
                <button type="submit" class="btn  col-12 shadow-none border-0"
                        style="background-color: var(--bgColor-2);
                        color: #fff;">Registar-se</button>
            </div>


           {# <p style="font-size: 18px;" class="my-2">Se já estas registado faça
           <a href="{{ path('app_login')  }}">Login</a></p>#}
            {{ form_end(registrationForm) }}

        </div>

    </div>




    {#<h1>Register</h1>

    {{ form_start(registrationForm) }}
        {{ form_row(registrationForm.email) }}
        {{ form_row(registrationForm.plainPassword, {
            label: 'Password'
        }) }}
        {{ form_row(registrationForm.agreeTerms) }}

        <button type="submit" class="btn">Register</button>
    {{ form_end(registrationForm) }}
    #}
{% endblock %}