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

{% block title %} = {{title}}{% endblock %}

{% block body %}
    <h1>{{title}}</h1>

    {% include('include/error.html.twig') %}

    {{ form_start(form) }}
        {{ form_widget(form.submit) }}
        <a href="{{ path(routecancel,{id:project.id}) }}" class="btn btn-secondary me-5">Annuler</a>

        <div class="row">
            <!-- Colonne VOTE -->
            <div class="col-md-4 ms-auto d-flex flex-column">
                <div class="card mt-3 flex-fill d-flex flex-column">
                    <div class="card-header">Vote</div>
                    <div class="card-body flex-fill">
                        <div class="list-group h-100">
                            {% for optionForm in form.options %}
                                <div class="list-group-item d-flex justify-content-between align-items-center">
                                    <span class="fw-bold">{{ optionForm.title.vars.value }}</span>
                                    <div style="width:120px;">
                                        {{ form_widget(optionForm.nbVote, {'attr': {'class': 'form-control form-control-sm'}}) }}
                                    </div>
                                </div>
                            {% endfor %}

                            <div class="list-group-item d-flex justify-content-between align-items-center">
                                <span class="fw-bold">{{ form.nbVoteWhite.vars.label }}</span>
                                <div style="width:120px;">
                                    {{ form_widget(form.nbVoteWhite, {'attr': {'class': 'form-control form-control-sm'}}) }}
                                </div>
                            </div>

                            <div class="list-group-item d-flex justify-content-between align-items-center">
                                <span class="fw-bold">{{ form.nbVoteNull.vars.label }}</span>
                                <div style="width:120px;">
                                    {{ form_widget(form.nbVoteNull, {'attr': {'class': 'form-control form-control-sm'}}) }}
                                </div>
                            </div>                
                        </div>
                    </div>
                </div>
            </div>

            <!-- Colonne RESULT -->
            <div class="col-md-4 me-auto d-flex flex-column">
                <div class="card mt-3 flex-fill d-flex flex-column">
                    <div class="card-header">Résultat</div>
                    <div class="card-body flex-fill d-flex flex-column">
                        {{ form_widget(form.resultVote, { 'attr': { 'class': 'flex-fill w-100' } }) }}
                    </div>  
                </div>
            </div>
        </div>
        
        <div style="display:none;">
            {{ form_rest(form) }}
        </div>
    {{ form_end(form, { render_rest: false }) }}
{% endblock %}