Add modal for viewing photos by clicking thumbnail.

This commit is contained in:
Yaro Kasear 2025-07-11 12:06:59 -05:00
parent 7bdbb4ea2a
commit 84db8592cb

View file

@ -4,8 +4,17 @@
<!-- Image fragment --> <!-- Image fragment -->
<div class="image-slot text-center"> <div class="image-slot text-center">
{% if image %} {% if image %}
<img src="{{ url_for('static', filename=image.filename) }}" alt="Photo of ID {{ id }}" class="img-thumbnail" <img src="{{ url_for('static', filename=image.filename) }}" alt="Image of ID {{ id }}" class="img-thumbnail"
style="max-height: 256px;"> style="max-height: 256px;" data-bs-toggle="modal" data-bs-target="#imageModal-{{ id }}">
<div class="modal fade" id="imageModal-{{ id }}" tabindex="-1">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-body text-center">
<img src="{{ url_for('static', filename=image.filename) }}" alt="Image of ID {{ id }}" class="img-fluid">
</div>
</div>
</div>
</div>
{% else %} {% else %}
<a href="#" class="link-secondary" onclick="document.getElementById('image-upload-input-{{ id }}').click(); return false;"> <a href="#" class="link-secondary" onclick="document.getElementById('image-upload-input-{{ id }}').click(); return false;">
{{ icons.render_icon('image', 256) }} {{ icons.render_icon('image', 256) }}