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


{% block body %}
<section class='article'>

    <article>
        <h2>{{ proposition.title }}</h2>
        <div class="metadata"> Ecrit le {{ proposition.createdAt | date ('d/m/Y') }} à {{ proposition.createdAt |
            date('H:i')}} dans la catégorie {{ proposition.category.title }}</div>
        <div class="content">
            <img id="image_proposition" src="/SiteDemocratie2/public/{{ vich_uploader_asset(proposition) }}" alt="{{ proposition.title }}" /> <br>
            {{ proposition.content | raw }}
        </div>
    </article>

    <br>
    <div class="progress">
        <div class="progress-bar progress-bar-striped bg-info progress-bar-animated" role="progressbar" aria-valuenow=""
            aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
    </div>
    <br>

    <section id="commentaires">
        <h1>({{ proposition.comments | length }}) Commetaires : </h1>
        {% for comment in proposition.comments %}
        <div class="comment">
            <div class="row">
                <div class="col-3">
                    {{comment.author}} ( <small>{{comment.createdAt | date ('d/m/Y à H:i')}}</small> )
                </div>
                <div class="col">
                    {{comment.content | raw}}
                </div>
            </div>
        </div>
        {% endfor %}

        <br>
        <div class="progress">
            <div class="progress-bar progress-bar-striped bg-warning progress-bar-animated" role="progressbar"
                aria-valuenow="" aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
        </div>
        <br>

        {% if app.user %}
        <h1>Commenté !</h1>
        {{ form_start(commentForm) }}

        {{ form_row(commentForm.author, {'attr': {'placeholder': "Votre nom"}})}} <br>
        {{ form_row(commentForm.content, {'attr': {'placeholder': "Votre Commentaire"}})}} <br>

        <button type="submit" class="btn btn-success">Commenter !</button>
        {{form_end(commentForm)}}

        {% else %}
        <h2>Connectez-vous pour pouvoir commenter </h2> <br>
        <a href="{{path('security_login')}}" class="btn btn-outline-info">Connexion</a> <br><br>
        {% endif %}



    </section>
    {% endblock %}