moanos/Notfellchen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add edit buttons to animal

Browse Source
This commit is contained in:
moanos [he/him] 2024-05-31 14:40:35 +02:00
parent 5f13736753
commit 26b16586b8
2 changed files with 24 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/fellchensammlung/static/fellchensammlung/css/styles.css
View File

@ -190,6 +190,14 @@ h1, h2 {
border: none; border: none;
} }
.container-edit-buttons {
display: flex;
flex-wrap: wrap;
.btn {
margin: 5px;
}
}
.form-button:hover, .link-button a:hover, .link-button a:active { .form-button:hover, .link-button a:hover, .link-button a:active {
background-color: #4090b6; background-color: #4090b6;
} }
@ -308,6 +316,7 @@ h1, h2 {
border-radius: 5px; border-radius: 5px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
} }
.tag { .tag {
@ -348,7 +357,7 @@ h1, h2 {
} }
.card { .card {
flex: 1 16%; flex: 1 25%;
margin: 10px; margin: 10px;
border-radius: 8px; border-radius: 8px;
padding: 5px; padding: 5px;
@ -369,7 +378,9 @@ h1, h2 {
.header-card-adoption-notice { .header-card-adoption-notice {
display: flex; display: flex;
justify-content: space-evenly;
align-items: center; align-items: center;
flex-wrap: wrap;
} }
@ -402,7 +413,7 @@ h1, h2 {
} }
.tags { .tags {
margin-left: auto; margin-right: auto;
padding: 5px; padding: 5px;
} }

18
src/fellchensammlung/templates/fellchensammlung/partials/partial-animal-card.html
View File

@ -1,20 +1,24 @@
{% load i18n %} {% load i18n %}
<div class="card"> <div class="card">
<div class="detail-animal-header"> <div class="detail-animal-header">
<h1>{{ animal.name }}</h1> <h1><a href="{% url 'animal-detail' animal_id=animal.pk %}">{{ animal.name }}</a></h1>
<div class="tags"> <div class="tags">
<div class="tag species">{{ animal.species }}</div> <div class="tag species">{{ animal.species }}</div>
<div class="tag sex">{{ animal.get_sex_display }}</div> <div class="tag sex">{{ animal.get_sex_display }}</div>
</div> </div>
<div class="container-edit-buttons">
<a class="btn" href="{% url 'animal-edit' animal_id=animal.pk %}">{% translate 'Bearbeiten' %}</a>
<a class="btn" href="{% url 'animal-add-photo' animal_id=animal.pk %}">{% translate 'Foto hinzufügen' %}</a>
</div>
</div> </div>
{% if animal.description %} {% if animal.description %}
<p>{{ animal.description }}</p> <p>{{ animal.description }}</p>
{% endif %} {% endif %}
{% if animal.get_photo %} {% for photo in animal.get_photos %}
<img src="{{ MEDIA_URL }}/{{ animal.get_photo.image }}" alt="{{ animal.get_photo.alt_text }}"> <img src="{{ MEDIA_URL }}/{{ photo.image }}" alt="{{ photo.alt_text }}">
</div> {% endfor %}
{% else %}
{% translate "Keine Foto" %}
{% endif %}
</div> </div>