{% extends 'base.html.twig' %}
{% block title %}{% trans from 'meta' %}season.title{% endtrans %}{% endblock %}
{% block meta %}
    <meta name="robots" content="index,follow">
    <meta name="description" lang="{{ app.request.locale }}"
          content="{% trans from 'meta' %}season.description{% endtrans %}">
    <meta property="og:site_name" content="{% trans from 'meta' %}season.title{% endtrans %}">
    <meta property="og:title" content="{% trans from 'meta' %}season.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' %}season.description{% endtrans %}">
    <link rel="canonical" href="{{ absolute_url(path('seasons')) }}" >
{% endblock meta %}
{% block submenu %}
    <ul class="sub-menu">
        {% for season in seasons %}
            <li><a href="#{{ season.slug }}">{{ season.title|upper }}</a></li>
        {% endfor %}
    </ul>
{% endblock %}
{% block header_bottom %}
    <div class="grid-container title">
        <h1>{{ 'seasons'|trans([],'menu') }}</h1>
        <div class="container">
            <p class="text-center">{{ 'season.subtitle'|trans|nl2br }}</p>
        </div>
    </div>
{% endblock %}
{% block content %}
    <section class="season">
        {% for season in seasons %}
            <article id="{{ season.slug }}"
                     class="season background-{% if loop.index is odd %}odd{% else %}even{% endif %}">
                <div class="grid-container season-img">
                    <div class="arrow-center {% if loop.index is odd %}odd{% else %}even{% endif %}"></div>
                    {% if (season.images | length) > 0 and (season.images | length) <= 1 %}
                        <img src="{{ asset(season.images[0].image.path)|imagine_filter('thumbnail_1170_550_filter') }}"
                             alt="{{ season.title }}"/>
                    {% elseif (season.images | length) > 0 %}
                        <div class="slide-images align-center swiper-container">
                            <div class="swiper-wrapper">
                                {% for imageItem in season.images %}
                                    <div class="swiper-slide">
                                        <img src="{{ asset(imageItem.image.path) | imagine_filter('thumbnail_1170_550_filter') }}"
                                             alt="{{ season.title }}">
                                    </div>
                                {% endfor %}
                            </div>
                            <div class="swiper-button-next"></div>
                            <div class="swiper-button-prev"></div>
                        </div>
                    {% elseif season.video is not null %}
                        <iframe width="100% " height="550"
                                src="https://www.youtube.com/embed/{{ season.video.path }}">
                        </iframe>
                    {% endif %}
                </div>
                <div class="grid-container">
                    <div class="season-title text-center"><h2
                                class="background-{% if loop.index is odd %}odd{% else %}even{% endif %}">{{ season.title }}</h2>
                        <br/> <span
                                class="month">{{ season.subtitle }}</span></div>
                    <div class="season-content grid-x grid-margin-x">
                        <div class="cell small-12 medium-6">
                           {{ season.firstText|raw }}
                        </div>
                        <div class="cell small-12 medium-6">
                            {{ season.secondText|raw }}
                        </div>
                    </div>
                </div>
            </article>
        {% endfor %}
    </section>
{% endblock %}
