{% extends '_layout/base' %}
{% import '_helpers/_image_webp' as media %}
{% set body_classes = 'gallery-page' %}
{% set category = craft.app.request.getParam('category') %}
{% paginate craft.entries.section('galleryItems')
    .limit(12)
    .orderBy('title asc')
    as
    pageInfo,
    pageEntries %}

{% block content %}

    <div id="page-header" class="m-has-breadcrumbs">
        <div class="page-title">
            <h1>{{ entry.title }}</h1>
        </div>
        {% include '_components/breadcrumbs' with {
            class: 'black no-top-margin'
        } %}
    </div>
    <div id="page-content">
        <div class="page-content-inner">
            {% if pageEntries|length %}
                <div class="gallery-list-page gallery-page">
                    <div class="c-gallery">
                        <ul class="gallery-images m-layout-masonry m-3-columns">
                            {% for entry in pageEntries %}
                                <li class="gallery-image">
                                    <div class="gallery-image-inner">
                                        <a href="{{ entry.url }}">
                                            {{ media.getImage(entry.image.one, 'gallery-item-image') }}
                                        </a>
                                        <h2 class="gallery-title"><a href="{{ entry.url }}">{{ entry.title }}</a>
                                        </h2>
                                    </div>
                                </li>
                            {% endfor %}

                        </ul>
                    </div>
                </div>
                {% include '_components/pagination' with {
                    pageInfo: pageInfo
                } %}
            {% else %}
                <p>{{ 'Sem itens da galeria para mostrar'|t }}</p>
            {% endif %}
        </div>
    </div>


{% endblock %}