custom/plugins/AtmosTheme/src/Resources/views/storefront/component/product/card/box-list.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/component/product/card/box-standard.html.twig' %}
  2. {% block component_product_box_content %}
  3.     <div class="card-body">
  4.         <div class="row">
  5.             <div class="col-4 col-md-3 col-xl-auto">
  6.                 {% block component_product_box_image %}
  7.                     <div class="product-image-wrapper">
  8.                         {# fallback if display mode is not set #}
  9.                         {% set displayMode = displayMode ?: 'standard' %}
  10.                         {# set display mode 'cover' for box-image with standard display mode #}
  11.                         {% if layout == 'image' and displayMode == 'standard' %}
  12.                             {% set displayMode = 'cover' %}
  13.                         {% endif %}
  14.                         {% block component_product_box_image_link %}
  15.                             <a href="{{ seoUrl('frontend.detail.page', { 'productId': id }) }}"
  16.                                title="{{ name }}"
  17.                                class="product-image-link is-cover">
  18.                                 {% block component_product_box_image_link_inner %}
  19.                                     {% if cover.url %}
  20.                                         {% set attributes = {
  21.                                             'class': 'product-image is-'~displayMode,
  22.                                             'alt': (cover.translated.alt ?: name),
  23.                                             'title': (cover.translated.title ?: name),
  24.                                             'loading': 'lazy'
  25.                                         } %}
  26.                                         {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %}
  27.                                         {% block component_product_box_image_thumbnail %}
  28.                                             {% sw_thumbnails 'product-image-thumbnails' with {
  29.                                                 media: cover,
  30.                                                 sizes: sizes
  31.                                             } %}
  32.                                         {% endblock %}
  33.                                     {% else %}
  34.                                         {% block component_product_box_image_placeholder %}
  35.                                             <div class="product-image-placeholder">
  36.                                                 {% sw_icon 'placeholder' style {
  37.                                                     'size': 'fluid'
  38.                                                 } %}
  39.                                             </div>
  40.                                         {% endblock %}
  41.                                     {% endif %}
  42.                                 {% endblock %}
  43.                             </a>
  44.                         {% endblock %}
  45.                     </div>
  46.                 {% endblock %}
  47.             </div>
  48.             <div class="col-8 col-md-5 col-xl-6 product-inner">
  49.                 {% block component_product_box_name %}
  50.                     <a href="{{ seoUrl('frontend.detail.page', {'productId': id}) }}"
  51.                        class="product-name"
  52.                        title="{{ name }}">
  53.                         {{ name }}
  54.                     </a>
  55.                 {% endblock %}
  56.                 {% block component_product_box_variant_characteristics %}
  57.                     {% if product.variation %}
  58.                         <div class="product-variant-characteristics">
  59.                             <ul class="product-variant-characteristics-list">
  60.                                 <li>
  61.                                     <span class="product-variant-characteristics-label">
  62.                                         {{ "detail.productNumberLabel"|trans|sw_sanitize }}
  63.                                     </span>
  64.                                     <span class="product-variant-characteristics-option">
  65.                                         {{ product.productNumber }}
  66.                                     </span>
  67.                                 </li>
  68.                                 {% if not displayParent %}
  69.                                     {% for variation in product.variation %}
  70.                                         <li class="product-variant-characteristics-list-entry">
  71.                                             <span class="product-variant-characteristics-label">{{ variation.group }}:</span>
  72.                                             <span class="product-variant-characteristics-option">{{ variation.option }}</span>
  73.                                         </li>
  74.                                     {% endfor %}
  75.                                 {% endif %}
  76.                             </ul>
  77.                         </div>
  78.                     {% else %}
  79.                         <div class="product-variant-characteristics">
  80.                             <ul class="product-variant-characteristics-list mb-1">
  81.                                 <li>
  82.                                     <span class="product-variant-characteristics-label">
  83.                                         {{ "detail.productNumberLabel"|trans|sw_sanitize }}
  84.                                     </span>
  85.                                     <span class="product-variant-characteristics-option">
  86.                                         {{ product.productNumber }}
  87.                                     </span>
  88.                                 </li>
  89.                             </ul>  
  90.                         </div>
  91.                         <p class="product-desc">                      
  92.                             {{ product.translated.description|striptags|raw }}
  93.                         </p>
  94.                     {% endif %}
  95.                 {% endblock %}                
  96.             </div>
  97.             <div class="col-12 col-md-4 col-xl-auto flex-grow-1 product-inner">
  98.                 {% sw_include '@Storefront/storefront/component/product/card/price-unit.html.twig' %}
  99.                 {% sw_include '@Storefront/storefront/component/product/card/action.html.twig' %}
  100.                 <div class="product-actions-sub">       
  101.                     {% if config('core.cart.wishlistEnabled') %}
  102.                         {% block component_product_box_wishlist_action %}
  103.                             {% sw_include '@Storefront/storefront/component/product/card/wishlist.html.twig' with {
  104.                                 showText: true,
  105.                                 size: 'md',
  106.                                 productId: product.id
  107.                             } %}
  108.                         {% endblock %}
  109.                     {% endif %} 
  110.                     {% sw_include '@Storefront/storefront/component/product/card/compare-button.html.twig' ignore missing %}
  111.                 </div>
  112.             </div>          
  113.         </div>
  114.     </div>
  115. {% endblock %}