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

{% block title %}Actus & stages!{% endblock %}

{% block body %}
    <div class="v-page-wrap">

        <div class="container pull-bottom-big pull-top">
            {% for evenement in evenements %}
                <article class="portfolio-article">
                    <div class="row">
                        {% if evenement.photo %}
                            <div class="col-sm-6">
                                <figure class="media-wrap no-margin-bottom">
                                    <img class="v-animation"
                                         src="https://www.kiwicloudcms.com/content/picture/id/{{ evenement.photo }}/ql/600x600"
                                         data-animation="fade-from-bottom"
                                         data-delay="200"/>

                                    <div class="v-spacer col-sm-12 v-height-standard"></div>
                                </figure>
                            </div>
                        {% endif %}

                        <div class="col-sm-{{ evenement.photo ? '6':'12' }}">
                            <section class="article-body-wrap">

                                <section class="portfolio-detail-description">
                                    <div class="body-text clearfix">
                                        <div class="v-heading-v3">
                                            <h2 class="v-smash-text-large">{{ evenement.titre }}</h2>
                                            <div class="horizontal-break"></div>
                                        </div>
                                        <ul class="list-unstyled mb-0">
                                            <li class="media mb-1">
                                                <div class="d-flex w-40 w-sm-30">
                                                    <h4 class="mt-0 mb-1">Date</h4>
                                                </div>
                                                <div class="media-body">
                                                    <p class="text-muted mb-1">
                                                        {{ evenement.date }}
                                                    </p>
                                                </div>
                                            </li>

                                            <li class="media mb-1">
                                                <div class="d-flex w-40 w-sm-30">
                                                    <h4 class="mt-0 mb-1">Heure</h4>
                                                </div>
                                                <div class="media-body">
                                                    <p class="text-muted mb-1">
                                                        {{ evenement.heure|raw }}
                                                    </p>
                                                </div>
                                            </li>
                                        </ul>
                                        <p>
                                            {{ evenement.description|raw }}
                                        </p>
                                    </div>
                                </section>

                            </section>

                            {% if evenement.contact %}
                                <div class="portfolio-options-bar">

                                    <div class="share-links clearfix">
                                        <a class="btn v-btn v-btn-default v-small-button"
                                           href="{{ path('contact') }}">Contactez-nous</a>
                                    </div>
                                </div>
                            {% endif %}
                        </div>
                    </div>
                </article>
                {% if not loop.last %}
                    <div class="v-divider v-up-v1 col-sm-12"><a class="animate-top" href="#"><i
                                    class="fa fa-arrow-up"></i></a></div>
                {% endif %}
            {% endfor %}
        </div>
    </div>
{% endblock %}