<div class="image-container">
    <ul class="image-list">
    {% for image in images %}
        <li>
            <a href="{{ url_for('event_images.image_display', image) }}" class="js-lightbox">
                <img src="{{ url_for('event_images.image_display', image) }}" alt="{% trans %}Image{% endtrans %}">
            </a>
            <span class="menu">
                <a class="icon-link js-copy-to-clipboard" title="{% trans %}Get link to image{% endtrans %}"
                   href="{{ url_for('event_images.image_display', image, _external=true) }}"
                   data-clipboard-text="{{ url_for('event_images.image_display', image, _external=true) }}"
                   data-clipboard-action="copy"></a>
                <a class="icon-remove danger delete hide-if-locked"
                   title="{% trans %}Delete image{% endtrans %}"
                   data-href="{{ url_for('event_layout.image_delete', image) }}"
                   data-method="DELETE"
                   data-confirm="{% trans filename=image.filename %}Are you sure you want to delete '{{ filename }}'? {% endtrans %}">
                </a>
            </span>
        </li>
    {% endfor %}
    </ul>

    {% if not images %}
        <div class="info-message-box">
            <div class="message-text">
                {% trans %}There are no images in this event. You can upload some using the form above.{% endtrans %}
            </div>
        </div>
    {% endif %}
</div>
