{% extends "base.twig" %}

{% block content %}

<main>
    <section class="hero-page bg-dark-arrows">
        <div class="container">
            <h1 class="hero-page__main-title text-left text-align-left text-uppercase">{{ post.title }}</h1>
            <p class="hero-page__subtitle text-left h2">{{ post.post_date|date("F d Y") }}</p>
        </div>

    </section>
    <section class="page-content small-top-padding">
        <div class="container page-content__single">
            <article class="post-narrow single-post">
                {% if post.post_type=="post" %}<a href="{{ news_page_template }}" class="h3 page_back">Back to news</a>{% endif %}
                {% if post.meta('gallery') is not empty %}
                    <div class="gallery-slider">
                        <div class="navigation-wrapper">
                            <div id="js-keen-slider" class="keen-slider">
                                {% for item in post.meta('gallery') %}
                                    <div class="keen-slider__slide">
                                <img class="" src="{{ Image(item.image).src }}" alt="alt">
                                    </div>
                                {% endfor %}
                            </div>     
                            <svg  id="arrow-left"  class="arrow arrow--left"><use href="{{ site.theme.link }}/frontend/img/icons.svg#arrow-left"></use></svg>        
                            <svg id="arrow-right"  class="arrow arrow--right"><use href="{{ site.theme.link }}/frontend/img/icons.svg#arrow-right"></use></svg>
                        </div>
                        <div id="dots" class="dots"></div>
                    </div>
                    
                {% endif %}
                <div class="single-post__content">
                    {{ post.content }}
                </div>
            </article>
        </div>
    </section>

{% endblock %}