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