gallery.njk 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. ---
  2. layout: main_layout.njk
  3. pagination:
  4. data: collections.miniImages
  5. size: 1
  6. alias: albumName
  7. reverse: true
  8. permalink: "/gallery/{{ albumName | slugify }}/index.html"
  9. ---
  10. <nav class="breadcrumbs">
  11. <a href="/gallery">Gallery</a>
  12. {% set pathAccu = "" %}
  13. {% for part in albumName.split('/') %}
  14. {% if part %}
  15. {% set pathAccu = (pathAccu + "/" + part) if pathAccu else part %}
  16. <span> / </span>
  17. <a href="/gallery/{{ pathAccu | slugify }}/">{{ part | capitalize }}</a>
  18. {% endif %}
  19. {% endfor %}
  20. {# 1. List Subfolders #}
  21. {% set currentData = collections.miniImages[albumName] %}
  22. {% if currentData.subfolders.length > 0 %}
  23. <ul class="subfolder-list">
  24. {% for sub in currentData.subfolders %}
  25. <li>
  26. <a href="/gallery/{{ sub | slugify }}/">📁 {{ sub }}</a>
  27. </li>
  28. {% endfor %}
  29. </ul>
  30. {% endif %}
  31. </nav>
  32. {# 2. List Images #}
  33. <div class="gallery-grid">
  34. {% for photo in currentData.images | reverse %}
  35. <a href="/gallery/single/{{ photo.path | slugify }}/index.html" class="gallery-item">
  36. <img src="{{ photo.path }}" alt="photo_{{ loop.index }}" loading="lazy">
  37. <div class="meta-overlay">
  38. {{ photo.date.toLocaleDateString("en-GB") }}<br>
  39. {{ photo.date.toLocaleTimeString("en-GB", { hour: '2-digit', minute: '2-digit' }) }}
  40. </div>
  41. </a>
  42. {% else %}
  43. <p>No photos found in this album.</p>
  44. {% endfor %}
  45. </div>
  46. <!--
  47. <p class="pagination">
  48. {% if page.url != pagination.href.last %}
  49. <a href="{{ pagination.href.next }}">⬅️ Prev Page</a>
  50. {% endif %} -
  51. {% if page.url != pagination.href.first %}
  52. <a href="{{ pagination.href.previous }}">Next Page ➡️</a>
  53. {% endif %}
  54. </p>
  55. -->