onders.org_zola_theme/templates/shortcodes/gallery.html

68 lines
2 KiB
HTML

<div class="gallery is-flex is-flex-wrap-wrap">
{% for path in images %}
{% if section %}
{% set full_path = section.path ~ path %}
{% endif %}
{% if page %}
{% set full_path = page.path ~ path %}
{% endif %}
{% set thumb = resize_image(path=full_path, width=120, height=120) %}
<div class="gallery-item">
<a href="#{{ path }}">
<img src="{{ thumb.url }}" class="thumbnail" />
</a>
<div class="lightbox has-text-centered" id="{{ path }}">
{% if images | length > 1 %}
<span class="spacer"></span>
{% if loop.first %}
<a href="#{{ images | nth(n=images | length - 1) }}" class="lightbox-nav-previous">
</a>
{% else %}
<a href="#{{ images | nth(n=loop.index0 - 1) }}" class="lightbox-nav-previous">
&lt;
</a>
{% endif %}
<img src="{{ path }}" />
<a class="delete is-large" href="#"></a>
{% if loop.last %}
<a href="#{{ images | nth(n=0) }}" class="lightbox-nav-next">
</a>
{% else %}
<a href="#{{ images | nth(n=loop.index) }}" class="lightbox-nav-next">
&gt;
</a>
{% endif %}
{% else %}
<a href="#" class="close">
<span class="spacer"></span>
<img src="{{ path }}" />
</a>
{% endif %}
{% if images | length > 1 %}
{% if loop.first %}
<a href="#{{ images | nth(n=images | length - 1) }}" class="is-desktop">
<span class="lightbox-previous"></span>
</a>
{% else %}
<a href="#{{ images | nth(n=loop.index0 - 1) }}" class="is-desktop">
<span class="lightbox-previous"></span>
</a>
{% endif %}
{% if loop.last %}
<a href="#{{ images | nth(n=0) }}" class="is-desktop">
<span class="lightbox-next"></span>
</a>
{% else %}
<a href="#{{ images | nth(n=loop.index) }}" class="is-desktop">
<span class="lightbox-next"></span>
</a>
{% endif %}
{% endif %}
</div>
</div>
{% endfor %}
</div>