feat: Move tags to content and only show gallery when there are pictures
This commit is contained in:
@@ -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">
|
||||
|
Reference in New Issue
Block a user