templates/bundles/SyliusShopBundle/Product/Show/rightside_images.html.twig line 1

Open in your IDE?
  1. {#{% if product.imagesByType('main') is not empty %}#}
  2. {#    {% set source_path = product.imagesByType('main').first.path %}#}
  3. {#    {% set original_path = source_path|imagine_filter('sylius_shop_product_original') %}#}
  4. {#    {% set path = source_path|imagine_filter(filter|default('sylius_shop_product_large_thumbnail')) %}#}
  5. {#{% elseif product.images.first %}#}
  6. {#    {% set source_path = product.images.first.path %}#}
  7. {#    {% set original_path = source_path|imagine_filter('sylius_shop_product_original') %}#}
  8. {#    {% set path = source_path|imagine_filter(filter|default('sylius_shop_product_large_thumbnail')) %}#}
  9. {#{% else %}#}
  10. {#    {% set original_path = asset('assets/shop/img/400x300.png') %}#}
  11. {#    {% set path = original_path %}#}
  12. {#{% endif %}#}
  14. {#<div data-product-image="{{ path }}" data-product-link="{{ original_path }}"></div>#}
  15. {#<a href="{{ original_path }}" class="ui fluid image" data-lightbox="sylius-product-image">#}
  16. {#    <img src="{{ path }}" id="main-image" alt="{{ product.name }}" {{ sylius_test_html_attribute('main-image') }} />#}
  17. {#</a>#}
  18. {% if product.images|length > 1 %}
  19.     {# <div class="ui divider"></div> #}
  21.     {{ sylius_template_event('sylius.shop.product.show.before_thumbnails', {'product': product}) }}
  23.     <div id="gallery-right-images">
  24.         {% set imageCount = 0 %}
  25.         {% for image in product.images %}
  26.             {% if loop.index > 1 and imageCount < 4 %}
  27.                 {% set path = image.path is not null ? image.path|imagine_filter('sylius_shop_product_large_thumbnail') : asset('assets/shop/img/200x200.png') %}
  28.                 <div id="card-product-show-right">
  29.                     {% if product.isConfigurable() and product.enabledVariants|length > 0 %}
  30.                         {% include '@SyliusShop/Product/Show/_imageVariants.html.twig' %}
  31.                     {% endif %}
  32.                     <a href="{{ image.path|imagine_filter('sylius_shop_product_original') }}" data-lightbox="sylius-product-image">
  33.                         <img src="{{ path }}" data-large-thumbnail="{{ image.path|imagine_filter('sylius_shop_product_large_thumbnail') }}" alt="{{ product.name }}" />
  34.                     </a>
  35.                 </div>
  36.                 {% set imageCount = imageCount + 1 %}
  37.             {% endif %}
  38.         {% endfor %}
  39.     </div>
  40. {% endif %}
  43. <style>
  44.     /*#card-product-show-right {*/
  45.     /*    width: calc(50% - 1rem);*/
  46.     /*}*/
  47.     /*#card-product-show-right img {*/
  48.     /*    width: 100% ;*/
  49.     /*    height: 100%;*/
  50.     /*}*/
  51.     /*#card-product-show-right a{*/
  52.     /*    display: block;*/
  53.     /*    width: 100%;*/
  54.     /*    height: 100%;*/
  55.     /*}*/
  56.     /*#gallery-right-images{*/
  57.     /*    display: inline-flex;*/
  58.     /*    flex-wrap: wrap;*/
  59.     /*    gap: 1rem;*/
  60.     /*}*/
  61. </style>