refactor(bulma): Move animals to separate column
This commit is contained in:
@@ -6,106 +6,111 @@
|
|||||||
{% block title %}<title>{{ adoption_notice.name }}</title>{% endblock %}
|
{% block title %}<title>{{ adoption_notice.name }}</title>{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="card">
|
<div class="columns">
|
||||||
<div class="card-header">
|
<div class="column is-two-thirds">
|
||||||
<h1 class="card-header-title title is-2">{{ adoption_notice.name }}</h1>
|
<div class="card">
|
||||||
</div>
|
<div class="card-header">
|
||||||
<div class="card-content">
|
<h1 class="card-header-title title is-2">{{ adoption_notice.name }}</h1>
|
||||||
<div class="grid">
|
</div>
|
||||||
<div class="cell">
|
<div class="card-content">
|
||||||
<!--- General Information --->
|
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
|
<div class="cell">
|
||||||
|
<!--- General Information --->
|
||||||
|
<div class="grid">
|
||||||
|
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<h2><strong>{% translate "Ort" %}</strong></h2>
|
<h2><strong>{% translate "Ort" %}</strong></h2>
|
||||||
<p>{% if adoption_notice.location %}
|
<p>{% if adoption_notice.location %}
|
||||||
{{ adoption_notice.location }}
|
{{ adoption_notice.location }}
|
||||||
{% else %}
|
{% else %}
|
||||||
{{ adoption_notice.location_string }}
|
{{ adoption_notice.location_string }}
|
||||||
{% endif %}</p>
|
{% endif %}</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
{% include "fellchensammlung/partials/bulma-sex-overview.html" %}
|
{% include "fellchensammlung/partials/bulma-sex-overview.html" %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
<!--- Images --->
|
<!--- Images --->
|
||||||
<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" id="my-gallery">
|
<div class="cell" id="my-gallery">
|
||||||
{% for photo in adoption_notice.get_photos %}
|
{% for photo in adoption_notice.get_photos %}
|
||||||
<a href="{{ MEDIA_URL }}/{{ photo.image }}"
|
<a href="{{ MEDIA_URL }}/{{ photo.image }}"
|
||||||
data-pswp-width="{{ photo.image.width }}"
|
data-pswp-width="{{ photo.image.width }}"
|
||||||
data-pswp-height="{{ photo.image.height }}"
|
data-pswp-height="{{ photo.image.height }}"
|
||||||
target="_blank">
|
target="_blank">
|
||||||
<img style="height: 12rem" src="{{ MEDIA_URL }}/{{ photo.image }}"
|
<img style="height: 12rem" src="{{ MEDIA_URL }}/{{ photo.image }}"
|
||||||
alt="{ photo.alt_text }}"/>
|
alt="{ photo.alt_text }}"/>
|
||||||
</a>
|
</a>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--- Description --->
|
||||||
|
<div class="column block">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<h1 class="card-header-title title is-2">{% translate "Beschreibung" %}</h1>
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<p class="expandable">{% if adoption_notice.description %}
|
||||||
|
{{ adoption_notice.description | render_markdown }}
|
||||||
|
{% else %}
|
||||||
|
{% translate "Keine Beschreibung angegeben" %}
|
||||||
|
{% endif %}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!--- Description --->
|
<div class="card-footer">
|
||||||
<div class="column block">
|
{% if has_edit_permission %}
|
||||||
<div class="card">
|
<div class="card-footer-item">
|
||||||
<div class="card-header">
|
<div class="column">
|
||||||
<h1 class="card-header-title title is-2">{% translate "Beschreibung" %}</h1>
|
<a class="button is-primary is-light"
|
||||||
|
href="{% url 'adoption-notice-add-photo' adoption_notice_id=adoption_notice.pk %}">
|
||||||
|
{% translate 'Foto hinzufügen' %}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer-item">
|
||||||
|
<a class="button is-primary"
|
||||||
|
href="{% url 'adoption-notice-edit' adoption_notice_id=adoption_notice.pk %}">
|
||||||
|
{% translate 'Bearbeiten' %}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content">
|
{% endif %}
|
||||||
<p class="expandable">{% if adoption_notice.description %}
|
|
||||||
{{ adoption_notice.description | render_markdown }}
|
|
||||||
{% else %}
|
|
||||||
{% translate "Keine Beschreibung angegeben" %}
|
|
||||||
{% endif %}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="block">
|
||||||
<div class="card-footer">
|
{% if adoption_notice.further_information %}
|
||||||
{% if has_edit_permission %}
|
<form method="get" action="{% url 'external-site' %}">
|
||||||
<div class="card-footer-item">
|
<input type="hidden" name="url" value="{{ adoption_notice.further_information }}">
|
||||||
<div class="column">
|
<button class="button is-primary is-fullwidth" type="submit" id="submit">
|
||||||
<a class="button is-primary is-light"
|
{{ adoption_notice.further_information | domain }} <i
|
||||||
href="{% url 'adoption-notice-add-photo' adoption_notice_id=adoption_notice.pk %}">
|
class="fa-solid fa-arrow-up-right-from-square"></i>
|
||||||
{% translate 'Foto hinzufügen' %}
|
</button>
|
||||||
</a>
|
</form>
|
||||||
</div>
|
{% endif %}
|
||||||
<div class="card-footer-item">
|
|
||||||
<a class="button is-primary"
|
|
||||||
href="{% url 'adoption-notice-edit' adoption_notice_id=adoption_notice.pk %}">
|
|
||||||
{% translate 'Bearbeiten' %}
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="columns">
|
|
||||||
{% for animal in adoption_notice.animals %}
|
|
||||||
<div class="column">
|
|
||||||
{% include "fellchensammlung/partials/bulma-partial-animal-card.html" %}
|
|
||||||
</div>
|
</div>
|
||||||
{% endfor %}
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
{% for animal in adoption_notice.animals %}
|
||||||
|
<div class="block">
|
||||||
|
{% include "fellchensammlung/partials/bulma-partial-animal-card.html" %}
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="block">
|
|
||||||
{% if adoption_notice.further_information %}
|
|
||||||
<form method="get" action="{% url 'external-site' %}">
|
|
||||||
<input type="hidden" name="url" value="{{ adoption_notice.further_information }}">
|
|
||||||
<button class="button is-primary is-fullwidth" type="submit" id="submit">
|
|
||||||
{{ adoption_notice.further_information | domain }} <i
|
|
||||||
class="fa-solid fa-arrow-up-right-from-square"></i>
|
|
||||||
</button>
|
|
||||||
</form>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="block">
|
<div class="block">
|
||||||
{% include "fellchensammlung/partials/bulma-partial-comment-section.html" %}
|
{% include "fellchensammlung/partials/bulma-partial-comment-section.html" %}
|
||||||
|
@@ -4,7 +4,6 @@
|
|||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<h1 class="card-header-title">
|
<h1 class="card-header-title">
|
||||||
<a href="{% url 'animal-detail' animal_id=animal.pk %}">{{ animal.name }}</a>
|
<a href="{% url 'animal-detail' animal_id=animal.pk %}">{{ animal.name }}</a>
|
||||||
|
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<div class="tags">
|
<div class="tags">
|
||||||
@@ -57,5 +56,5 @@
|
|||||||
href="{% url 'animal-add-photo-bulma' animal_id=animal.pk %}">{% translate 'Foto hinzufügen' %}</a>
|
href="{% url 'animal-add-photo-bulma' animal_id=animal.pk %}">{% translate 'Foto hinzufügen' %}</a>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
Reference in New Issue
Block a user