dani/django-ram
1
0
Fork 0
mirror of https://github.com/daniviga/django-ram.git synced 2025-08-04 13:17:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add modal for pictures

Browse Source
This commit is contained in:
Daniele Viganò
2022-07-23 11:58:17 +02:00
parent e023edbeeb
commit b8aa34ce1d
2 changed files with 19 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
ram/portal/templates/page.html
View File

@@ -15,7 +15,24 @@
{% block cards %}
{% for t in rolling_stock.image.all %}
<div class="col">
<img class="img-thumbnail" src="{{ t.image.url }}" alt="Rolling stock image">
<a href="" data-bs-toggle="modal" data-bs-target="#pictureModal{{ forloop.counter }}"><img class="img-thumbnail" src="{{ t.image.url }}" alt="Rolling stock image"></a>
</div>
<!-- Modal -->
<div class="modal fade" id="pictureModal{{ forloop.counter }}" tabindex="-1" aria-labelledby="pictureModalLabel{{ forloop.counter }}" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="pictureModalLabel{{ forloop.counter }}">{{ rolling_stock }}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body text-center">
<img class="roundedi img-fluid" src="{{ t.image.url }}" alt="Rolling stock image">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
{% endfor %}
{% endblock %}