refactor(bulma): use main-thumbnail view for AN photos

This commit is contained in:
2025-05-18 14:27:00 +02:00
parent bbc8732112
commit fdf4e79a69

View File

@@ -38,16 +38,32 @@
<div class="column block"> <div class="column block">
<div class="card"> <div class="card">
<div class="grid card-content"> <div class="grid card-content">
<div class="cell gallery"> <div class="gallery">
{% for photo in adoption_notice.get_photos %} {% with photo=adoption_notice.get_photos.0 %}
<a href="{{ MEDIA_URL }}{{ photo.image }}" <div class="main-photo">
data-pswp-width="{{ photo.image.width }}" <a href="{{ MEDIA_URL }}{{ photo.image }}"
data-pswp-height="{{ photo.image.height }}" data-pswp-width="{{ photo.image.width }}"
target="_blank"> data-pswp-height="{{ photo.image.height }}"
<img style="height: 12rem" src="{{ MEDIA_URL }}{{ photo.image }}" target="_blank">
alt="{ photo.alt_text }}"/> <img src="{{ MEDIA_URL }}{{ photo.image }}"
</a> alt="{{ photo.alt_text }}">
{% endfor %} </a>
</div>
{% endwith %}
<div class="thumbnail-row">
{% for photo in adoption_notice.get_photos|slice:"1:4" %}
<div class="thumbnail">
<a href="{{ MEDIA_URL }}{{ photo.image }}"
data-pswp-width="{{ photo.image.width }}"
data-pswp-height="{{ photo.image.height }}"
target="_blank">
<img src="{{ MEDIA_URL }}{{ photo.image }}"
alt="{{ photo.alt_text }}">
</a>
</div>
{% endfor %}
</div>
</div> </div>
</div> </div>
</div> </div>