{% extends 'base.html.twig' %}
{% block title %}{% trans from 'meta' %}cuvee.title{% endtrans %}{% endblock %}
{% block meta %}
    <meta name="robots" content="index,follow">
    <meta name="description" lang="{{ app.request.locale }}"
          content="{% trans from 'meta' %}cuvee.description{% endtrans %}">
    <meta property="og:site_name" content="{% trans from 'meta' %}cuvee.title{% endtrans %}">
    <meta property="og:title" content="{% trans from 'meta' %}cuvee.title{% endtrans %}">
    <meta property="og:type" content="website">
    <meta property="og:url" content="{{ app.request.uri }}">
    <meta property="og:image" content="{{ absolute_url('bundles/cpcreationtheme1/images/logo.jpg') }}">
    <meta property="og:locale" content="{{ app.request.locale }}">
    <meta property="og:image:type" content="image/jpeg">
    <meta property="og:image:width" content="600">
    <meta property="og:image:height" content="450">
    <meta property="og:description"
          content="{% trans from 'meta' %}cuvee.description{% endtrans %}">
    <link rel="canonical" href="{{  absolute_url(path('cuvees')) }}" />
{% endblock meta %}
{% block submenu %}
    <div class="swiper-container swiper-sub-menu">
        <div class="swiper-wrapper">
            {% for cuvee in cuvees %}
                <div class="swiper-slide"><a href="#{{ cuvee.slug }}">{{ cuvee.name }}</a></div>
            {% endfor %}
        </div>
        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
    </div>
{% endblock %}
{% block header_bottom %}
    <div class="grid-container title">
        <h1>{{ 'cuvees'|trans([],'menu') }}</h1>
        <div class="container">
            <p class="text-center">{% trans %}cuvee.subtitle{% endtrans %}</p>
        </div>
    </div>
{% endblock %}
{% block content %}
    <section id="les-cuvees">
        {% for cuvee in cuvees %}
            {% if loop.first and cuvee.category is not null %}
                {% set prevCategory = cuvee.category.slug %}
            {% endif %}
            {% if cuvee.category %}
                {% if prevCategory != cuvee.category.slug %}
                    {% set prevCategory = cuvee.category.slug %}
                    <div class="separator">
                        <div class="grid-container">
                            <div class="line-picto text-center">
                                <img src="{{ asset('bundles/cpcreationtheme1/images/picto_blc.svg') }}"
                                     alt="Picto {% trans from 'meta' %}company_name{% endtrans %}">
                            </div>
                        </div>
                    </div>
                {% endif %}
            {% endif %}
            <div class="grid-container">
                <article id="{{ cuvee.slug }}" data-index="{{ loop.index - 1 }}"
                         class="grid-x grid-margin-x grid-padding-x align-middle">
                    <div class="medium-12 large-6 cuvee-image {% if loop.index is odd %}large-order-1{% else %}large-order-2{% endif %} text-center">
                        <img src="{{ asset(cuvee.image.path)|imagine_filter('relative_heighten_638_filter') }}"
                             alt="{{ cuvee.name }} - {{ cuvee.quality }}">
                        <div class="arrow-white"></div>
                    </div>
                    <div class="medium-12 large-6 cuvee-content {% if loop.index is odd %}large-order-2{% else %}large-order-1{% endif %}">
                        <div class="cuvee-text">
                            <h2 {% if cuvee.enableColor %}style="--color-cuvee:{{ cuvee.color }};"{% endif %}>{{ cuvee.name }}</h2>
                            <span class="cuvee-header" {% if cuvee.enableColorQuality %}style="--color-border:{{ cuvee.color }};"{% endif %}>{{ cuvee.quality }}</span>
                            <div class="cuvee-description">
                                {{ cuvee.description | raw }}
                                {% if cuvee.file is not null %}
                                    <p><i class="fas fa-file-pdf"></i>
                                        <a href="{{ asset(cuvee.file.path) | file_path }}" target="_blank">{% trans %}cuvee.technical{% endtrans %}</a></p>
                                {% endif %}
                                {% if cuvee.awards is not null %}
                                    <ul class="awards">
                                        {% for award in cuvee.awards %}
                                            <li>
                                                <img src="{{ asset(award.image.path)|imagine_filter('relative_heighten_60_filter') }}"
                                                     alt="{{ award.title }}" data-tooltip-js
                                                     title="{{ award.title }} - {{ award.description }}"></li>
                                        {% endfor %}
                                    </ul>
                                {% endif %}
                            </div>
                        </div>
                    </div>
                </article>
            </div>
        {% endfor %}
    </section>
{% endblock %}
