templates/website/page/hertiage-product.html.twig line 1

  1. {% extends '@web/base.html.twig' %}
  2. {% block body %}
  3.     <section class="main-products-section">
  4.         <div class="container-fluid">
  5.             <div class="row">
  6.                 <div class="col-lg-10 m-auto">
  7.                     <ul class="wrapper-navigation">
  8.                         <li>
  9.                             <a href="{{ path('page_index') }}">
  10.                                 {{ 'Home'|trans }}
  11.                             </a>
  12.                         </li>
  13.                         <li>
  14.                             <a href="{{ path('page_heritage_products') }}">
  15.                                 {{ 'Products'|trans }}
  16.                             </a>
  17.                         </li>
  18.                         <li>
  19.                             <span>{{ product.title }}</span>
  20.                         </li>
  21.                     </ul>
  22.                     <div class="section-product-view">
  23.                         <div class="wrapper-product-view-content">
  24.                             <div class="wrapper-image">
  25.                                 {# 1️⃣ Build safe images array (skip null automatically) #}
  26.                                 {% set images = [] %}
  27.                                 {% if product.image %}
  28.                                     {% set images = images|merge([product.image]) %}
  29.                                 {% endif %}
  30.                                 {% if product.minImage %}
  31.                                     {% set images = images|merge([product.minImage]) %}
  32.                                 {% endif %}
  33.                                 {% if product.miniSecondImage %}
  34.                                     {% set images = images|merge([product.miniSecondImage]) %}
  35.                                 {% endif %}
  36.                                 {# 2️⃣ If all images are null → show placeholder #}
  37.                                 {% if images is empty %}
  38.                                     {% set images = ['images/no-image.png'] %}
  39.                                 {% endif %}
  40.                                 {# MAIN SLIDER #}
  41.                                 <div class="swiper product-main-slider">
  42.                                     <div class="swiper-wrapper">
  43.                                         {% for img in images %}
  44.                                             <div class="swiper-slide">
  45.                                                 <img src="{{ asset(img) }}" alt="product image">
  46.                                             </div>
  47.                                         {% endfor %}
  48.                                     </div>
  49.                                 </div>
  50.                                 {# THUMB SLIDER #}
  51.                                 <div class="swiper product-thumb-slider">
  52.                                     <div class="swiper-wrapper">
  53.                                         {% for img in images %}
  54.                                             <div class="swiper-slide">
  55.                                                 <img src="{{ asset(img) }}" alt="product thumbnail">
  56.                                             </div>
  57.                                         {% endfor %}
  58.                                     </div>
  59.                                 </div>
  60.                             </div>
  61.                             <div class="wrapper-description">
  62.                                 <h2>
  63.                                     {{ product.title }}
  64.                                 </h2>
  65.                                 <ul>
  66.                                     <li>
  67.                                         <span>{{ 'Category'|trans }}:</span>
  68.                                         <strong>{{ product.category.title }}</strong>
  69.                                     </li>
  70.                                     <li>
  71.                                         <span>{{ 'Collection'|trans }}:</span>
  72.                                         <strong>{{ product.collection.title }}</strong>
  73.                                     </li>
  74.                                     <li>
  75.                                         <span>{{ 'Weight'|trans }}:</span>
  76.                                         <strong>{{ product.weight }}</strong>
  77.                                     </li>
  78.                                     <li>
  79.                                         <span>{{ 'Material'|trans }}:</span>
  80.                                         <strong>{{ product.type }}</strong>
  81.                                     </li>
  82.                                     {% if product.stone %}
  83.                                     <li>
  84.                                         <span>{{ 'Stones'|trans }}:</span>
  85.                                         <strong> {{ product.stone }}</strong>
  86.                                     </li>
  87.                                     {% endif %}
  88.                                 </ul>
  89.                                 <div class="wrapper-bottom">
  90.                                     <h4>
  91.                                         {{ product.price|number_format ~ ' դրամ' }}
  92.                                     </h4>
  93.                                     <button class="main-shop-btn">
  94.                                         {{ 'ADD TO CARD'|trans }}
  95.                                         <svg width="20" height="17" viewBox="0 0 20 17" fill="none"
  96.                                              xmlns="http://www.w3.org/2000/svg">
  97.                                             <path d="M15.9987 11.8333H5.16536L3.08203 3.5H18.082L15.9987 11.8333Z"
  98.                                                   fill="#0F0F0F"></path>
  99.                                             <path d="M1 1H2.45833L3.08333 3.5M3.08333 3.5L5.16667 11.8333H16L18.0833 3.5H3.08333Z"
  100.                                                   stroke="#0F0F0F" stroke-width="2" stroke-linecap="round"
  101.                                                   stroke-linejoin="round"></path>
  102.                                             <path d="M5.16797 16C5.85832 16 6.41797 15.4404 6.41797 14.75C6.41797 14.0596 5.85832 13.5 5.16797 13.5C4.47761 13.5 3.91797 14.0596 3.91797 14.75C3.91797 15.4404 4.47761 16 5.16797 16Z"
  103.                                                   stroke="#0F0F0F" stroke-width="2" stroke-linecap="round"
  104.                                                   stroke-linejoin="round"></path>
  105.                                             <path d="M16 16C16.6904 16 17.25 15.4404 17.25 14.75C17.25 14.0596 16.6904 13.5 16 13.5C15.3096 13.5 14.75 14.0596 14.75 14.75C14.75 15.4404 15.3096 16 16 16Z"
  106.                                                   stroke="#0F0F0F" stroke-width="2" stroke-linecap="round"
  107.                                                   stroke-linejoin="round"></path>
  108.                                         </svg>
  109.                                     </button>
  110.                                 </div>
  111.                             </div>
  112.                         </div>
  113.                         {% if product.productDescription %}
  114.                         <div class="wrapper-additional-information">
  115.                             <h3>
  116.                                 {{ 'Description'|trans }}
  117.                             </h3>
  118.                             {{ product.productDescription }}
  119.                         </div>
  120.                         {% endif %}
  121.                         <div class="wrapper-additional-information">
  122.                             <h3>
  123.                                 {{ delivery.title }}
  124.                             </h3>
  125.                            {{ delivery.description|raw }}
  126.                         </div>
  127.                     </div>
  128.                     <div class="wrapper-recent-products">
  129.                         <h5>
  130.                             {{ 'YOU MIGHT ALSO LIKE'|trans }}
  131.                         </h5>
  132.                         <div class="swiper mySwiper">
  133.                             <div class="swiper-wrapper">
  134.                                 {% for item in products %}
  135.                                     <div class="swiper-slide">
  136.                                         <a href="{{ path('page_heritage_product_view',{'id':item.id}) }}"
  137.                                            class="wrapper-item">
  138.                                             <div class="wrapper-image">
  139.                                                 <img src="{{ item.image }}" alt="">
  140.                                             </div>
  141.                                             <span class="wrapper-description">
  142.                                             <strong>
  143.                                                 {{ item.title }}
  144.                                             </strong>
  145.                                             <span>
  146.                                                {{ item.price|number_format ~ ' դրամ' }}
  147.                                             </span>
  148.                                         </span>
  149.                                         </a>
  150.                                     </div>
  151.                                 {% endfor %}
  152.                             </div>
  153.                         </div>
  154.                     </div>
  155.                 </div>
  156.             </div>
  157.         </div>
  158.     </section>
  159. {% endblock %}