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

{% block title %}{% endblock %}

{% block body %}
    <section class="faq-area-02 pt-130 pb-90">
        <div class="container">
            <div class="row">
                <div class="col-xl-4 col-lg-4 col-md-12">
                    <div class="widget mb-40">
                        <div class="widget__title__box">
                            <h2 class="widget-title">{{ 'news'|trans }}</h2>
                        </div>
                        <div class="catagory-list">
                            <ul class="cat">
                                <li><a href="{{ path('save_the_date') }}">Save the date <span class="f-right"><i class="fas fa-chevron-right"></i></span></a></li>
                                <li><a href="{{ path('newsletters') }}">Newsletters <span class="f-right"><i class="fas fa-chevron-right"></i></span></a></li>
                                <li><a href="{{ path('archives') }}">Archives <span class="f-right"><i class="fas fa-chevron-right"></i></span></a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="widget mb-40">
                        <form action="{{ path('newsletter_subscribe') }}" method="POST" class="form-area form-area-02 row no-gutters pb-50">
                            <div class="col-12">
                                <div class="widget__title__box mb-30">
                                    <h2 class="widget-title-02">Newsletters</h2>
                                </div>
                                <p class="form-para">{{ 'newsletters_text_01'|trans }}</p>
                            </div>

                            <div class="col-12">
                                <div class="contact-mail pos-rel mb-15">
                                    <input type="email" id="email" name="email" class="form-control" placeholder="Email" required>
                                    <span><i class="far fa-envelope-open-text"></i></span>
                                </div>
                            </div>

                            <div class="col-12">
                                <button class="theme_btn theme_btn2 ml-40" style="border: 0;" type="submit">{{ 'subscribe'|trans }}</button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col-xl-8 col-lg-8 col-md-12">

                    <div class="row align-items-center mb-60">
                        <div class="col-6">
                            {# <h3 class="blog-list-title m-0">Actualités</h3> #}
                        </div>

                        <div class="col-6">
                            <form method="get" action="{{ path('news') }}" class="mb-4">
                                <div class="form-group d-flex justify-content-end">
                                    <select name="date" class="form-select form-control" onchange="this.form.submit()" style="width: max-content;">
                                        <option value="all" {% if app.request.get('date') == 'all' %}selected{% endif %}>{{ 'all'|trans }}</option>
                                        {% set currentYear = "now"|date("Y") %}
                                        {% for year in currentYear..(currentYear - 3) %}
                                            <option value="{{ year }}" {% if app.request.get('date') == year %}selected{% endif %}>{{ year }}</option>
                                        {% endfor %}
                                    </select>
                                </div>
                            </form>
                        </div>
                    </div>


                    {% for n in news %}
                        <div class="blog-list">
                        <span class="d-inline-block mb-20" style="font-size: 20px">
                            {{ n.title }}
                        </span>
                            <p class="mb-20">
                                {{ n.description|length > 320 ? n.description|slice(0, 320) ~ ' ...' : n.description }}
                            </p>
                            <div class="blog pr-40 mb-60">
                                <div class="blog__content">
                                    <div class="blog__content--thumb-03 mb-30">
                                        <img src="{{ n.photo }}" alt="">

                                    </div>
                                    <a href="{{ path('detail_news', { id: n.id }) }}" class="theme_btn" style="padding: 15px 19px;">{{ 'read_the_article'|trans }}</a>
                                </div>
                            </div>
                        </div>
                    {% else %}
                        <p class="text-center">{{ 'no_news_found'|trans }}</p>
                    {% endfor %}


                    {#
                    <div class="blog-list">
                        <span class="d-inline-block mb-20">
                            Rendez-vous incontournable pour tous les amateurs de roses !
                            Semaine du patrimoine rosier au shopping center la belle étoile, du 23 au 27 mai 2023
                        </span>
                        <p class="mb-20">
                            Du 23 au 27 mai 2023, la rose luxembourgeoise s'invite dans la galerie marchande du
                            Shopping Center BELLE ETOILE à Bertrange. Sur son stand de vente, l'asbl Patrimoine Roses
                            pour le Luxembourg propose une quarantaine de variétés de roses luxembourg...
                        </p>
                        <div class="blog pr-40 mb-60">
                            <div class="blog__content">
                                <div class="blog__content--thumb-03 mb-30">
                                    <img src="{{ asset('images/news_01.png') }}" alt="">

                                </div>
                                <a href="{{ path('about') }}" class="theme_btn" style="padding: 15px 19px;">Consulter l'article</a>
                            </div>
                        </div>
                    </div>
                    #}

                    <div class="d-flex justify-content-center mt-30">
                        {{ knp_pagination_render(news) }}
                    </div>
                </div>
            </div>

            <section class="blog-area blog-area-two pt-120 pb-100">
                <div class="container">
                    <div class="row">
                        <div class="col-xl-7 m-auto">
                            <div class="section-title text-center">
                                <span class="left-line mb-15 pl-20">{{ 'contact_and_membership'|trans }}</span>
                                <h2 class="mb-35" style="font-size: 46px; font-family: serif;">{{ 'join_the_association'|trans }}</h2>
                                <p class="mb-30">
                                    {{ 'join_the_association_text'|trans | nl2br  }}
                                </p>
                                <a href="{{ path('contact') }}" class="theme_btn mt-2">{{ 'join'|trans }}</a>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

        </div>
    </section>
{% endblock %}