templates/Components/product-item.html.twig line 1

Open in your IDE?
  1. <!-- This template require [index, id, name, href, image, shortDescription, fallbackImage] -->
  2. <div class="col-xl-3  col-lg-3 col-md-4 col-sm-6 mb-5 mb-lg-5 mb-md-5 d-flex flex-column justify-content-center align-items-center text-center">
  3.     <div class="position-relative">
  4.         <a href="{{ product.href }}" class="d-flex flex-column align-items-center" style="max-width: fit-content;">
  5.             <div class="productCircle" style="background-image: url({{ image ? image.getThumbnail('Stoelting_neuroscience_circle') }}), url({{ image ? '' : fallbackImage }});">
  7.             </div>
  9.             <h5 class="font-weight-bold text-navyBlue mt-4 mt-lg-4 mt-md-4 mb-0 mb-0">{{ product.name }}</h5>
  10.         </a>
  11.         <div class="productCircle__info"
  12.              {# 'modal' thumbnail needs to be configured #}
  13.                     data-thumbnail="{{ product.image ? product.image.getThumbnail('modal') : product.fallbackImage }}"
  14.                     data-title="{{ product.name }}"
  15.                     data-text="{{ product.shortDescription }}"
  16.                     data-toggle="modal"
  17.                     data-target="#productInfo-{{product.id}}">
  18.                 </div>
  19.     </div>
  21. </div>
  24. {% include "Components/productInfoModal.html.twig" with {
  25.     image: product.image,
  26.     name: product.name,
  27.     shortDescription: product.shortDescription,
  28.     link: product.href,
  29.     price: product.minPrice,
  30.     id: product.id
  31. } %}