{% extends 'front.html.twig' %}
{% block title %}  STH  {% endblock %}
{% block stytesheets %}
    {{ parent() }}
{% endblock %}
{% block body %}

<!-- Start Main Banner -->
{% include 'contents/slider/slider.html.twig' %}
<!-- End Main Banner -->

<!-- Start Welcome Area -->
<section class="welcome-area ptb-80">
    <div class="container">
        <div class="row">
            <div class="col-lg-6 col-md-12">
                <div class="welcome-text">
                    <h4>{{ post.title }}</h4>
                    <p align="justify">{{ post.content[:495] | raw}}</p>

                    <div class="gq-au-btn">
                        <a href="{{ path('about') }}" class="btn btn-primary mr-20">En savoir plus</a>
                    </div>
                </div>
            </div>

            <div class="col-lg-6 col-md-12">
                <div class="welcome-video">
                    <a class="popup-youtube" href="https://www.youtube.com/watch?v=_qa4hdEwqFY"><img src="{{ asset('assets/img/play.png') }}" alt="play"></a>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- End Welcome Area -->

<!-- Start Services Area -->
<section class="about-area ptb-80 bg">
    <div class="section-title">
        <h3>Derniers Evénements</h3>
    </div>
        <div class="container">
            <div class="shorting">
                <div class="row">
                    {% for event in events %}
                        <div class="col-lg-4 col-md-6">
                            <div class="single-services" style="background: #fff;">
                                <div class="img">
                                    <img src="{{ asset('assets/img/event02.png') }}" alt="event">
                                </div>
                                <div class="content" style="height: 300px;">
                                    <h4 style="line-height:20px;font-size: 14px !important; font-weight: 600;"><i class="fa fa-calendar"></i> <a href="{{ path('event_detail', {'id': event.id }) }}">{{ event.title }}</a></h4>
                                    <div align="left" style="font-size: 10px !important;">{{ event.description[:135] | raw }}</div>
                                    <a href="{{ path('event_detail', {'id': event.id }) }}" class="read-more-btn">
                                        <span class="left"><i class="fa fa-chevron-circle-right"></i></span>
                                        Read More
                                        <span class="right"><i class="fa fa-chevron-circle-right"></i></span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    {%  endfor %}
                </div>
            </div>
        </div>
</section>
    <!-- End Services Area -->

    <!-- Start CTR Area -->
<section class="ctr-area ptb-80">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 col-md-12">
                <h3>Demande d'adhésion</h3>
                <a href="{{ path('register') }}" class="btn btn-primary">inscrivez vous</a>
            </div>
        </div>
    </div>
</section>
<!-- End CTR Area -->

<!-- Start Testimonial Area -->
<section class="testimonial-area ptb-80">
    <div class="container">
        <div class="row">
            <div class="testimonial-slider">
             {% for event in events %}
                <div class="single-feedback">
                    <div class="row m-0">
                        <div class="col-lg-4 col-md-4 p-0">
                            <div class="client-img">
                                <img src="{{ asset('assets/img/event02.png')}}" alt="event">
                            </div>
                        </div>
                        <div class="col-lg-8 col-md-8 p-0">
                            <div class="client-feedback">
                                <h3 style="font-size: 20px;">{{ event.title }}</h3>
                                <p>{{ event.description | raw }}</p>
                            </div>
                            <a href="{{ path('event_detail', {'id': event.id }) }}" class="read-more-btn" style="margin-left: 25px;">
                                <span class="left"><i class="fa fa-chevron-circle-right"></i></span>
                                Read More
                                <span class="right"><i class="fa fa-chevron-circle-right"></i></span>
                            </a>
                        </div>
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>
    </div>
</section>
<!-- End Testimonial Area -->

{% endblock %}

{% block javascripts %}
    {{ parent() }}
{% endblock %}