---
layout: main_layout.njk
pagination:
  data: collections.miniImages
  size: 1
  alias: albumName
  reverse: true
permalink: "/gallery/{{ albumName | slugify }}/index.html"
---
    <nav class="breadcrumbs">
        <a href="/gallery">Gallery</a>
        {% for crumb in collections.miniImages %}
        <span> / </span>
        <span class="crumb">{{ crumb | capitalize }}</span>
        {% endfor %}
    </nav>

<hr>

<h2>Album: {{ albumName }}</h2>
<div class="gallery-grid">
  {% for photo in collections.miniImages[albumName] | sort(attribute='date') | reverse %}
    <div class="mini-card">
      <img src="{{ photo.path }}" alt="photo_{{ loop.index }}" loading="lazy">
      <div class="meta">
        <span>{{ photo.date | date('YYYY-MM-DD') }}</span>
      </div>
    </div>
  {% else %}
    <p>No photos found in this album.</p>
  {% endfor %}
</div>

        <p class="pagination">
            {% if page.url != pagination.href.last %}
            <a href="{{ pagination.href.next }}">⬅️ Prev Page</a>{% endif %} -
            {% if page.url != pagination.href.first %}
            <a href="{{ pagination.href.previous }}">Next Page ➡️</a>{% endif %}
        </p>
<!--
<p>Debug Info:</p>
<ul>
  <li>Current Page: {{ pagination.pageNumber }}</li>
  <li>Next Link: {{ pagination.href.next }}</li>
  <li>Previous Link: {{ pagination.href.previous }}</li>
  <li>Total Pages: {{ pagination.pages.length }}</li>
</ul>
<h3>Total posts found in collection: {{ collections.postlist.length }}</h3>
<ul>
{% for p in collections.postlist %}
  <li>{{ p.inputPath }}</li>
{% endfor %}
</ul>
-->