feat: Move tags to content and only show gallery when there are pictures

This commit is contained in:
2025-06-15 20:43:39 +02:00
parent 975c962025
commit 9253fde2e5

View File

@@ -5,35 +5,27 @@
<h1 class="card-header-title">
<a href="{% url 'animal-detail' animal_id=animal.pk %}">{{ animal.name }}</a>
</h1>
<div class="tags">
<div class="tag species">{{ animal.species }}</div>
<div class="tag sex">{{ animal.get_sex_display }}</div>
</div>
</div>
<div class="card-content">
<div class="grid">
<div class="tag cell">{{ animal.species }}</div>
<div class="tag cell">{{ animal.get_sex_display }}</div>
</div>
<div class="block">
<strong>{% trans 'Alter' %}</strong> {{ animal.hr_age }}
<strong>{% trans 'Alter' %}</strong> {{ animal.hr_age }}
</div>
{% if animal.description %}
<div class="content">
<p>{{ animal.description | render_markdown }}</p>
</div>
{% endif %}
<div class="gallery">
{% with photo=animal.get_photos.0 %}
<div class="main-photo">
<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>
{% endwith %}
{% if animal.get_photos %}
<div class="thumbnail-row">
{% for photo in animal.get_photos|slice:"1:4" %}
<div class="thumbnail">
<div class="gallery">
{% with photo=animal.get_photos.0 %}
<div class="main-photo">
<a href="{{ MEDIA_URL }}{{ photo.image }}"
data-pswp-width="{{ photo.image.width }}"
data-pswp-height="{{ photo.image.height }}"
@@ -42,11 +34,26 @@
alt="{{ photo.alt_text }}">
</a>
</div>
{% endfor %}
{% endwith %}
<div class="thumbnail-row">
{% for photo in animal.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>
{% endif %}
</div>
<!--- Assume a user does not have edit permissions on animal if they have no other edit permission --->
{% if has_edit_permission %}
<div class="card-footer">