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

{% block content %}

<!-- ============================================== HEADER : END ============================================== -->
<div class="breadcrumb">
	<div class="container">
		<div class="breadcrumb-inner">
			<ul class="list-inline list-unstyled">
				<li><a href="{{ path('frontend_home_index') }}">Accueil</a></li>
				<li class='active'>Inscription</li>
			</ul>
		</div><!-- /.breadcrumb-inner -->
	</div><!-- /.container -->
</div><!-- /.breadcrumb -->
<style>
    
</style>
<div class="body-content ">
	<div class="container">
		<div class="sign-in-page">
			<div class="row">
				<!-- create a new account -->
                <div class="col-md-offset-2 col-md-7 col-sm-7 create-new-account">
                    
                    {{ form_start(form, {'attr': {'class': 'register-form outer-top-xs'}}) }}
                        
                        
                        {% set formErrors = form.vars.errors.form.getErrors(true) %}
                        {% if formErrors|length %}
                            <div class="alert alert-danger">
                                <ul>
                                    {% for key,error in formErrors %}
                                        <li><strong>{{ error.message }}</strong></li>
                                    {% endfor %}
                                </ul>
                            </div>
                        {% endif %}

                        <h3 class="checkout-subtitle">Vos informations personnelles</h3>
                            <div class="row">
                                <div class="col-md-4 col-sm-4">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.gender) }} <span>*</span></label>
                                        {{ form_widget(form.gender, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.gender) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-4 col-sm-4">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.firstname) }} <span>*</span></label>
                                        {{ form_widget(form.firstname, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.firstname) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-4 col-sm-4">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.lastname) }} <span>*</span></label>
                                        {{ form_widget(form.lastname, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.lastname) }}</span>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 col-sm-4">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.birthdate) }} <span>*</span></label>
                                        {{ form_widget(form.birthdate, {'attr': {'placeholder': 'dd/mm/yyyy'}}) }} 
                                        <span class="help-block">{{ form_errors(form.birthdate) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-4 col-sm-4">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.phoneNumber) }} <span>*</span></label>
                                        {{ form_widget(form.phoneNumber, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.phoneNumber) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-4 col-sm-4">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.pseudo) }}</label>
                                        {{ form_widget(form.pseudo, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.pseudo) }}</span>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 col-sm-3">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.country) }}<span>*</span></label>
                                        {{ form_widget(form.country, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.country) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-2 col-sm-2">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.zip) }}<span>*</span></label>
                                        {{ form_widget(form.zip, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.zip) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-6">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.adresse) }}<span>*</span></label>
                                        {{ form_widget(form.adresse, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.adresse) }}</span>
                                    </div>
                                </div>
                            </div>    
                            <h3 class="checkout-subtitle">Vos informations de connexion au site</h3>
                            
                            <div class="form-group">
                                <label class="info-title">{{ form_label(form.email) }} <span>*</span></label>
                                {{ form_widget(form.email, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                <span class="help-block">{{ form_errors(form.email) }}</span>
                            </div>

                            <div class="row">
                                <div class="col-md-6 col-sm-6">
                                   
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.password.first) }} <span>*</span></label>
                                        {{ form_widget(form.password.first, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                         <span class="help-block">{{ form_errors(form.password.first) }}</span>
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-6">
                                    <div class="form-group">
                                        <label class="info-title">{{ form_label(form.password.second) }} <span>*</span></label>
                                        {{ form_widget(form.password.second, {'attr': {'class': 'form-control unicase-form-control text-input'}}) }}
                                        <span class="help-block">{{ form_errors(form.password.second) }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="form-check">    
                                    {{ form_widget(form.newsletter, {'attr': {'class': 'form-check-input'}}) }}    
                                    <label class="form-check-label" for="user_registration_newsletter">{{ form_label(form.newsletter) }}</label>
                                </div>
                            </div>

                            <div class="form-group">    
                                <div class="form-check">                              
                                    <label class="required">
                                        {{ form_widget(form.cgu, {'attr': {'class': 'form-check-input'}}) }}
                                        <label class="form-check-label">J’ai lu et j’accepte les <a href="#" target="_blank">conditions générales d’utilisation</a></label>
                                    </label>
                                </div>
                            </div>

                            {{ form_row(form.save, { 'label': "Finaliser l'inscription", 'attr': {'class': 'btn btn-primary'} }) }}
                            
                    {{ form_end(form) }}
                        
                </div>	
                <!-- create a new account -->	
            </div><!-- /.row -->
		</div><!-- /.sigin-in-->
        <br><br><br><br>
    </div>
</div>
{% endblock %}