{% extends 'front.html.twig' %}
{% block title %} Evénements {% endblock %}
{% block stytesheets %}
    {{ parent() }}
{% endblock %}
{% block body %}
<!-- Start Main Banner -->
<div class="page-title">
    <div class="d-table">
        <div class="d-table-cell">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12 col-md-12">
                        <h3 style="font-size:25px;">Evénements</h3>
                        <ul>
                            <li><a href="">Home</a></li>
                            <li>/</li>
                            <li>Evénements</li>
                            <li>/</li>
                            <li class="active">{{ category }}</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Main Banner -->

    <!-- Start Blog Area -->
    <section class="blog-section ptb-80">
        <div class="container">
            <div class="row">

                <div class="col-lg-4 col-md-5">
                    <div class="side-bar">
                        <div class="widget services-list">
                            <h3 class="title">Categories</h3>
                            <ul>
                                {% for cat in cats %}
                                    <li><a href="{{ path('event_list',{'id_category': cat.id}) }}"><i class="fa fa-angle-double-right"></i> {{ cat.title }}</a></li>
                                {% endfor %}
                            </ul>
                        </div>
                        <div class="widget sidebar-testimonials mb-0">
                            <div class="sidebar-testimonial-slider">
                                {% for event in events %}
                                <div class="feedback" style="height: 180px;">
                                    <span><i class="fa fa-calendar"></i></span>
                                    <a href=""><p>{{ event.title }}</p></a>
                                </div>
                                {%  endfor %}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-8 col-md-8">
                    <div class="row">
                    {%  if events_category is empty %}
                        <div class="error" align="center">
                            <p align="center"><h4>Oops! Empty Events</h4></p>
                        </div>
                    {%  else %}
                        {% for event in events_category %}
                        <div class="col-lg-12 col-md-12">
                            <div class="single-blog-post">
                                <div class="post-content" style="margin-top: -50px;">
                                    <h3><a href="{{ path('event_detail', {'id': event.id }) }}">{{ event.title }}</a></h3>
                                    <div align="justify">{{ event.description | 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>
                                        En Savoir Plus
                                        <span class="right"><i class="fa fa-chevron-circle-right"></i></span>
                                    </a>
                                </div>
                            </div>
                        </div>
                        {%  endfor %}
                        <div class="col-lg-12 col-md-12">
                            <div  class="pagination-area">
                                <nav aria-label="Page navigation">
                            {{ knp_pagination_render(events_category) }}
                                </nav>
                            </div>
                        </div>
                    {%  endif %}
                    </div>
                </div>

            </div>
        </div>
    </section>
    <!-- End Blog Area -->

{% endblock %}

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