<div id="media" class="ui styled fluid accordion">
    <div class="title">
        <i class="dropdown icon"></i>
        {{ 'sylius.ui.media'|trans }}
    </div>
    <div class="content">
        {% if product.images|length >= 1 %}
            <div class="ui small images">
                {% for image in product.images %}
                    {% set path = image.path is not null ? image.path|imagine_filter('sylius_admin_product_small_thumbnail') : '//placehold.it/200x200' %}
                    <div class="ui image">
                        {% if product.isConfigurable() and product.variants|length > 0 %}
                            {% include '@SyliusAdmin/Product/Show/_imageVariants.html.twig' %}
                        {% endif %}
                        <a href="{{ image.path|imagine_filter('sylius_admin_product_original') }}" data-lightbox="sylius-product-image">
                            <img src="{{ path }}" data-large-thumbnail="{{ image.path|imagine_filter('sylius_admin_product_large_thumbnail') }}" alt="{{ product.name }}" />
                        </a>
                    </div>
                {% endfor %}
            </div>
        {% endif %}
    </div>
</div>
