templates/front/product/index.html.twig line 1

Open in your IDE?
  1. {% extends 'front/base.html.twig' %}
  2. {% block title %}Sunshine Elegance | {{ productName }} {% endblock %}
  3. {% block meta_description %}
  4.     {% if product.metaDescription %}
  5.         {{ product.metaDescription|striptags|u.truncate(155, '…') }}
  6.     {% else %}
  7.         {{ product.description|striptags|u.truncate(155, '…') }}
  8.     {% endif %}
  9. {% endblock %}
  10. {% block meta %}
  11.     <meta name="keywords" content="">
  12.     <meta name="description" content="{{ product.description|striptags}}">
  13.     <meta name="author" content="Sunshine-Elegance">
  14.     <!-- Facebook OG -->
  15. {#    get the picture from a collection #}
  17.     <meta property="og:image" content="{{ absolute_url(asset('images/300-400/' ~ productImg)) }}">
  18.     <meta property="og:url" content="https://www.sunshineelegance.tn/">
  19.     <meta property="og:type" content="article">
  20.     <meta property="og:title" content="Sunshine Elegance | {{ productName }} ">
  21.     <meta property="og:description" content="{{ product.description|striptags}}">
  22.     <!-- Twitter OG -->
  23.     <meta name="twitter:title" content="Sunshine Elegance | {{ productName }} ">
  24.     <meta name="twitter:description" content="{{ product.description|striptags}} ">
  25.     <meta name="twitter:image" content="{{ absolute_url(asset('images/300-400/' ~ productImg)) }}">
  26.     <meta name="twitter:card" content="summary_large_image">
  27. {% endblock %}
  28. {% block stylesheets %}
  29.     {{ parent() }}
  30.     <script>
  31.         var ID = '{{ id }}';
  32.     </script>
  33. {% endblock %}
  34. {% block body %}
  35.     {# {% verbatim %} #}
  36.     <main class="main" id="app" v-cloak>
  37.         <div class="page-header breadcrumb-wrap">
  38.             <div class="container">
  39.                 <div class="breadcrumb">
  40.                     <a href="{{ path('home') }}" rel="nofollow">Acceuil</a>
  41.                     {% if categorie.parent.parent is defined and  categorie.parent.parent is not null %}
  42.                         <span></span> <a href="{{ path('category_new', {id: categorie.parent.parent.id , name :categorie.parent.parent.name|slug}) }}"
  43.                                          rel="nofollow">{{ categorie.parent.parent.name }}</a>
  44.                     {% endif %}
  45.                     {% if categorie.parent is not empty and  categorie.parent is not null  %}
  46.                         <span></span> <a href="{{ path('category_new', {id: categorie.parent.id, name :categorie.parent.name|slug}) }}"
  47.                                          rel="nofollow">{{ categorie.parent.name }}</a>
  48.                     {% endif %}
  49.                     <span></span> <a
  50.                             href="{{ path('category_new', {id: categorie.getId(), name :categorie.name|slug}) }}" rel="nofollow">{{ categorie.getName() }}</a>
  51.                     <span></span> {{ productName }}
  52.                 </div>
  53.             </div>
  54.         </div>
  55.         <section class="mt-50 mb-50">
  56.             <div class="container">
  57.                 <div class="row flex-row-reverse">
  58.                     <div class="col-lg-12">
  59.                         <div class="product-detail accordion-detail">
  60.                             <div class="row mb-50">
  61.                                 <div class="col-md-5 col-sm-12 col-xs-12">
  62.                                     <div class="detail-gallery">
  63.                                         <span class="zoom-icon"><i class="fi-rs-search"></i></span>
  64.                                         <!-- MAIN SLIDES -->
  65.                                         <div class="product-image-slider">
  66.                                             <figure class="border-radius-10" v-for="entry in produit.picture">
  67.                                                 <img :src="'{{ APP_URL }}/images/'+produit.fichePicture"
  68.                                                      :alt="produit.name">
  69.                                             </figure>
  71.                                             <!--<figure class="border-radius-10">
  72.                                                 <img src="../front/assets/imgs/shop/product-16-1.jpg" alt="product image">
  73.                                             </figure>
  74.                                             <figure class="border-radius-10">
  75.                                                 <img src="../front/assets/imgs/shop/product-16-3.jpg" alt="product image">
  76.                                             </figure>
  77.                                             <figure class="border-radius-10">
  78.                                                 <img src="../front/assets/imgs/shop/product-16-4.jpg" alt="product image">
  79.                                             </figure>
  80.                                             <figure class="border-radius-10">
  81.                                                 <img src="../front/assets/imgs/shop/product-16-5.jpg" alt="product image">
  82.                                             </figure>
  83.                                             <figure class="border-radius-10">
  84.                                                 <img src="../front/assets/imgs/shop/product-16-6.jpg" alt="product image">
  85.                                             </figure>
  86.                                             <figure class="border-radius-10">
  87.                                                 <img src="../front/assets/imgs/shop/product-16-7.jpg') }}" alt="product image">
  88.                                             </figure>-->
  89.                                         </div>
  90.                                         <!-- THUMBNAILS -->
  91.                                         <div class="slider-nav-thumbnails pl-15 pr-15">
  92. {#                                            <div>#}
  93. {#                                                <img :src="'{{ APP_URL }}/images/300-400/'+selectedDeclinaison.picture" alt="product image">#}
  94. {#                                            </div>#}
  95.                                             <div :class="entry==produit.fichePicture ? 'slick-slide slick-current slick-active' : 'slick-slide slick-active'" v-for="(entry,index) in produit.picture" @click="getThumbs(entry)">
  96.                                                 <img :src="'{{ APP_URL }}/images/300-400/'+entry" :alt="produit.name">
  97.                                             </div>
  98.                                         </div>
  99.                                     </div>
  100.                                     <!-- End Gallery -->
  101.                                     <div class="social-icons single-share">
  102.                                         <ul class="text-grey-5 d-inline-block">
  103.                                             <li><strong class="mr-10">Partage ça:</strong></li>
  104.                                             <li class="social-facebook"><a href="#"><img src="{{ APP_URL }}/front/assets/imgs/theme/icons/icon-facebook.svg" alt="Sunshine Elegance"></a></li>
  105.                                             {#<li class="social-twitter"> <a href="#"><img src="{{ APP_URL }}/front/assets/imgs/theme/icons/icon-twitter.svg" alt="Sunshine Elegance"></a></li>#}
  106.                                             <li class="social-instagram"><a href="#"><img src="{{ APP_URL }}/front/assets/imgs/theme/icons/icon-instagram.svg" alt="Sunshine Elegance"></a></li>
  107.                                             {#<li class="social-linkedin"><a href="#"><img src="{{ APP_URL }}/front/assets/imgs/theme/icons/icon-pinterest.svg" alt="Sunshine Elegance"></a></li>#}
  108.                                         </ul>
  109.                                     </div>
  110.                                 </div>
  111.                                 <div class="col-md-7 col-sm-12 col-xs-12">
  112.                                     <div class="detail-info p-15">
  113.                                         <h2 class="title-detail">${ produit.name }</h2>
  114.                                         <!--<div class="product-detail-rating">
  115.                                             <div class="pro-details-brand">
  116.                                                 <span> Brands: <a href="shop-grid-right.html">Bootstrap</a></span>
  117.                                             </div>
  118.                                             <div class="product-rate-cover text-end">
  119.                                                 <div class="product-rate d-inline-block">
  120.                                                     <div class="product-rating" style="width:90%">
  121.                                                     </div>
  122.                                                 </div>
  123.                                                 <span class="font-small ml-5 text-muted"> (25 reviews)</span>
  124.                                             </div>
  125.                                         </div>-->
  126.                                         <div class="clearfix product-price-cover" >
  127.                                             <div class="product-price primary-color float-left">
  128.                                                 {# <ins><span class="text-brand" v-if="!produit.promo">${ selectedDeclinaison.price_ttc } <sup class="currency-style">TND</sup></span></ins> #}
  129.                                                 {# <ins><span class="text-brand" v-if="produit.promo && produit.promo.discountType=='amount'">${ (selectedDeclinaison.price_ttc-produit.promo.discountValue).toFixed(3) } <sup class="currency-style">TND</sup></span></ins>
  130.                                                 <ins><span class="text-brand"  v-if="produit.promo && produit.promo.discountType=='percent'">${ (selectedDeclinaison.price_ttc-(selectedDeclinaison.price_ttc*produit.promo.discountValue/100)).toFixed(3) } <sup class="currency-style">TND</sup></span></ins> #}
  131.                                                 <ins><span class="text-brand">${ selectedDeclinaison.price_ttc } <sup
  132.                                                                 class="currency-style">TND</sup></span></ins>
  135.                                                 {# <ins><span class="old-price font-md ml-15" v-if="produit.promo">${ selectedDeclinaison.price_ttc } <sup class="currency-style">TND</sup></span></ins> #}
  136.                                                 <ins><span class="old-price font-md ml-15"
  137.                                                            v-if="selectedDeclinaison.in_promo">${ selectedDeclinaison.price_ht } <sup
  138.                                                                 class="currency-style">TND</sup></span></ins>
  140.                                                 <span class="save-price font-md color3 ml-15"
  141.                                                       v-if="selectedDeclinaison.in_promo && produit.promo.discountType=='amount'">-${ produit.promo.discountValue.toFixed(3) } <sup
  142.                                                             class="currency-style">TND</sup> Remise</span>
  143.                                                 <span class="save-price font-md color3 ml-15"
  144.                                                       v-if="selectedDeclinaison.in_promo && produit.promo.discountType=='percent'">-${ produit.promo.discountValue } % Remise</span>
  145.                                             </div>
  146.                                         </div>
  147.                                         <div class="bt-1 border-color-1 mt-15 mb-15"></div>
  148.                                         <div class="short-desc mb-15" id="article">
  149.                                             <p>${ produit.description }</p>
  150.                                         </div>
  151.                                         <div class="short-desc mb-30">
  152.                                             <p v-html="produit.specification"></p>
  153.                                         </div>
  155.                                         <!-- Liste des couleurs -->
  156.                                         {# <div class="attr-detail attr-size mb-15">
  157.                                             <strong class="mr-10">Couleurs</strong>
  158.                                             <ul class="list-filter size-filter font-small">
  159.                                                 <li v-for="(entry,key) in produit.couleurs" :class="entry==selectedDeclinaison.couleur ? 'active' : ''" style="margin-right:3px;margin-bottom:3px" @click="getTailles(entry,produit.declinaisons_produit)"><a href="#&">${ entry }</a></li>
  161.                                             </ul>
  162.                                         </div> #}
  163.                                         <div class="attr-detail attr-size mb-15">
  164.                                             <strong class="mr-10">Couleurs</strong>
  165.                                             <ul class="list-filter color-filter multi">
  166.                                                 <li :class="entry.name==selectedDeclinaison.couleur.name ? 'active' : ''"
  167.                                                     v-for="entry in produit.couleurs"
  168.                                                     @click="getTailles(entry.name,produit.declinaisons_produit)">
  169.                                                     <a href="#&" :title="entry.name">
  170.                                                         <span :style="{ 'background-color': entry.code ? entry.code :'#fff','border': '1px solid #ddd' }"></span>
  171.                                                     </a>
  172.                                                 </li>
  173.                                             </ul>
  174.                                         </div>
  175.                                         <!-- Liste des tailles -->
  176.                                         <div class="attr-detail attr-size">
  177.                                             <strong class="mr-10">Tailles</strong>
  178.                                             <ul class="list-filter size-filter font-small">
  179.                                                 <li v-for="(entry,key) in produit.tailles"
  180.                                                     :class="[(entry.taille==selectedDeclinaison.taille ? 'active' : ''), (entry.qty<=0 ? 'disabled-123' : '')]"
  181.                                                     style="margin-right:3px;margin-bottom:3px"
  182.                                                     @click="selectTaille(entry)"><a href="#&">${ entry.taille }</a></li>
  184.                                             </ul>
  185.                                         </div>
  186.                                         <div class="bt-1 border-color-1 mt-30 mb-30"></div>
  187.                                         <div class="detail-extralink">
  188.                                             <div class="detail-qty border radius">
  189.                                                 <a href="#&" class="qty-down-123" @click="incrementQty('-',selectedDeclinaison.id)"><i class="fi-rs-angle-small-down"></i></a>
  190.                                                 <span>${ qty }</span>
  191.                                                 <a href="#&" class="qty-up-123"
  192.                                                    @click="incrementQty('+',selectedDeclinaison.id)"><i
  193.                                                             class="fi-rs-angle-small-up"></i></a>
  194.                                                 <!--<input type="number" :max="selectedDeclinaison.qty" min="0">-->
  195.                                             </div>
  196.                                             <div class="product-extra-link2">
  197.                                                 <button :class="['button button-add-to-cart', (selectedDeclinaison.qty<=0 ? 'disabled' : '')]"
  198.                                                         @click="addProduct(qty)">Ajouter au panier
  199.                                                 </button>
  200.                                                 <!--<a aria-label="Add To Wishlist" class="action-btn hover-up" href="shop-wishlist.html"><i class="fi-rs-heart"></i></a>
  201.                                                 <a aria-label="Compare" class="action-btn hover-up" href="shop-compare.html"><i class="fi-rs-shuffle"></i></a>-->
  202.                                             </div>
  203.                                         </div>
  204.                                         <ul class="product-meta font-xs color-grey mt-50">
  205.                                             <li class="mb-5">Référence: <a href="#">${ selectedDeclinaison.ref }</a>
  206.                                             </li>
  207.                                             <!--<li class="mb-5">Tags: <a href="#" rel="tag">Cloth</a>, <a href="#" rel="tag">Women</a>, <a href="#" rel="tag">Dress</a> </li>-->
  208.                                             <li>
  209.                                                 Disponibilité:
  210.                                                 <!--<span class="in-stock text-success ml-5" v-if="selectedDeclinaison.qty>0">${ selectedDeclinaison.qty } articles restants</span>-->
  211.                                                 <span class="in-stock text-danger ml-5"
  212.                                                       v-if="selectedDeclinaison.qty<=0">Produit en rupture de stock</span>
  213.                                                 <span class="in-stock text-danger ml-5"
  214.                                                       v-if="selectedDeclinaison.qty<=5 && selectedDeclinaison.qty>0">Risque de rupture de stock</span>
  215.                                                 <span class="in-stock text-success ml-5"
  216.                                                       v-if="selectedDeclinaison.qty>5">Produit en stock</span>
  217.                                             </li>
  218.                                         </ul>
  219.                                         <div class="product_sort_info font-xs mb-30  mt-10">
  220.                                             <ul>
  221.                                                 <!--<li class="mb-10"><i class="fi-rs-crown mr-5"></i> 1 Year AL Jazeera Brand Warranty</li>-->
  222.                                                 <li class="mb-10"><i class="fi-rs-refresh mr-5"></i> Politique de retour de 3 jours</li>
  223.                                                 <li><i class="fi-rs-credit-card mr-5"></i> Paiement à la livraison</li>
  224.                                             </ul>
  225.                                         </div>
  226.                                     </div>
  227.                                     <!-- Detail Info -->
  228.                                 </div>
  229.                             </div>
  230.                             <div class="tab-style3">
  231.                                 <ul class="nav nav-tabs text-uppercase">
  232.                                     <li class="nav-item">
  233.                                         <a class="nav-link active" id="Additional-info-tab" data-bs-toggle="tab"
  234.                                            href="#Additional-info"><span style="color: #f7971e">Informations additionnelles</span></a>
  235.                                     </li>
  236.                                 </ul>
  237.                                 <div class="tab-content shop_info_tab entry-main-content">
  239.                                     <div class="tab-pane fade show active" id="Additional-info">
  240.                                         <table class="font-md">
  241.                                             <tbody>
  243.                                             <tr class="pa_color">
  244.                                                 <th>Couleurs</th>
  245.                                                 <td>
  246.                                                     <ul class="list-filter color-filter multi">
  247.                                                         <li v-for="entry in produit.couleurs">
  248.                                                             <a href="#&" :title="entry.name">
  249.                                                                 <span :style="{ 'background-color': entry.code ? entry.code :'#fff','border': '1px solid #ddd' }"></span>
  250.                                                             </a>
  251.                                                         </li>
  252.                                                     </ul>
  253.                                                 </td>
  254.                                             </tr>
  255.                                             <tr class="pa_size">
  256.                                                 <th>Tailles</th>
  257.                                                 <td>
  258.                                                     <p v-for="entry in produit.tailles">${ entry.taille }</p>
  259.                                                 </td>
  260.                                             </tr>
  261.                                             </tbody>
  262.                                         </table>
  263.                                     </div>
  264.                                 </div>
  265.                             </div>
  266. {#                            <div class="row mt-60" v-if="tags.length">#}
  267. {#                                <div class="col-12">#}
  268. {#                                    <h3 class="section-title style-1 mb-30">Autres produits dans la même catégorie</h3>#}
  269. {#                                </div>#}
  270. {#                                <div class="col-12">#}
  271. {#                                    <div class="row related-products">#}
  272. {#                                        <div v-for="entry in tags" class="col-lg-3 col-md-4 col-12 col-sm-6 row-product"#}
  273. {#                                             @click="openProduct(entry.id,entry.name)">#}
  274. {#                                            <div class="product-cart-wrap small hover-up col-product">#}
  275. {#                                                <div class="product-img-action-wrap">#}
  276. {#                                                    <div class="product-img product-img-zoom">#}
  277. {#                                                        <a href="#&" tabindex="0">#}
  278. {#                                                            #}{# <img class="default-img" src="{{ asset('front/assets/imgs/shop/product-2-1.jpg') }}" alt="Sunshine Elegance"> #}
  279. {#                                                            <img class="default-img product-img"#}
  280. {#                                                                 :src="'{{ APP_URL }}/images/300-400/'+entry.image" alt="Sunshine Elegance">#}
  281. {#                                                        </a>#}
  282. {#                                                    </div>#}
  283. {#                                                    <div class="product-action-1" @click="openProduct(entry.id,entry.name)">#}
  284. {#                                                        <a aria-label="Ajouter au panier"#}
  285. {#                                                           class="action-btn small hover-up" href="#&"><i#}
  286. {#                                                                    class="fi-rs-shopping-bag-add"></i></a>#}
  287. {#                                                    </div>#}
  288. {#                                                    <div class="product-badges product-badges-position product-badges-mrg"#}
  289. {#                                                         v-if="entry.promo">#}
  290. {#                                                        <span class="hot"#}
  291. {#                                                              v-if="entry.promo && entry.promo.discountType=='amount'">-${ entry.promo.discountValue.toFixed(3) } <sup#}
  292. {#                                                                    class="currency-style">TND</sup></span>#}
  293. {#                                                        <span class="hot"#}
  294. {#                                                              v-if="entry.promo && entry.promo.discountType=='percent'">-${ entry.promo.discountValue } %</span>#}
  295. {#                                                    </div>#}
  296. {#                                                </div>#}
  297. {#                                                <div class="product-content-wrap">#}
  298. {#                                                    <h2><a href="#&" tabindex="0">${ entry.name }</a></h2>#}
  300. {#                                                    <div class="product-price">#}
  301. {#                                                        <span v-if="!entry.promo">${ entry.priceTTC.toFixed(3) } <sup#}
  302. {#                                                                    class="currency-style">TND</sup></span>#}
  303. {#                                                        <span v-if="entry.promo && entry.promo.discountType=='amount'">${ (entry.priceTTC-entry.promo.discountValue).toFixed(3) } <sup#}
  304. {#                                                                    class="currency-style">TND</sup></span>#}
  305. {#                                                        <span v-if="entry.promo && entry.promo.discountType=='percent'">${ (entry.priceTTC-(entry.priceTTC*entry.promo.discountValue/100)).toFixed(3) } <sup#}
  306. {#                                                                    class="currency-style">TND</sup></span>#}
  307. {#                                                        <span class="old-price" v-if="entry.promo">${ entry.priceTTC.toFixed(3) } <sup#}
  308. {#                                                                    class="currency-style">TND</sup></span>#}
  309. {#                                                    </div>#}
  310. {#                                                </div>#}
  311. {#                                            </div>#}
  312. {#                                        </div>#}
  314. {#                                    </div>#}
  315. {#                                </div>#}
  316. {#                            </div>#}
  317.                         </div>
  318.                     </div>
  319.                     {#<div class="col-lg-3 primary-sidebar sticky-sidebar">
  320.                         <div class="widget-category mb-30">
  321.                             <h5 class="section-title style-1 mb-30 wow fadeIn animated">Catégories</h5>
  322.                             <ul class="categories">
  323.                                 {% for entry in Globals.getCategories() %}
  324.                                     <li class="category-list"><a href="{{ path('category_new', {id: entry.id}) }}">{{ entry.name }}</a></li>
  325.                                 {% endfor %}
  326.                             </ul>
  327.                         </div>#}
  328.                     </div>
  329.                 <div class="row mt-60">
  330.                     <div class="col-12">
  331.                         <h3 class="section-title style-1 mb-30">Produits dans la même catégorie</h3>
  332.                     </div>
  333.                     <div class="col-12">
  334.                         <div class="row related-products">
  335.                             {% for product in relatedProduct %}
  336.                                 <div class="col-lg-3 col-md-4 col-12 col-sm-6">
  337.                                     <div class="product-cart-wrap small hover-up">
  338.                                         <div class="product-img-action-wrap">
  339.                                             <div class="product-img product-img-zoom">
  340.                                                 <a href="{{ path('product_new', {id: product.id,name:product.name|slug}) }}" style="height: 100%">
  341.                                                     <img class="default-img" src="{{ absolute_url(asset('/images/300-400/' ~ product.image)) }}" alt="{{  product.name }}"
  342.                                                          style="width: 100%">
  343.                                                     {# <img class="hover-img" src="{{ asset('images/' ~ product.image) }}"  alt="Sunshine Elegance"> #}
  344.                                                 </a>
  345.                                             </div>
  346.                                             {# <div class="product-action-1">
  347.                                         <a aria-label="Quick view" class="action-btn small hover-up" data-bs-toggle="modal" data-bs-target="#quickViewModal">
  348.                                             <i class="fi-rs-eye"></i></a>
  349.                                         <a aria-label="Add To Wishlist" class="action-btn small hover-up" href="shop-wishlist.html" tabindex="0"><i class="fi-rs-heart"></i></a>
  350.                                         <a aria-label="Compare" class="action-btn small hover-up" href="shop-compare.html" tabindex="0"><i class="fi-rs-shuffle"></i></a>
  351.                                     </div> #}
  352.                                             {% if( product.promotion and product.promotion.isValid) or product.stock == 0 or product.isNew %}
  353.                                                 <div class="product-badges product-badges-position product-badges-mrg">
  354.                                                     {% if product.stock == 0 %}
  355.                                                         <span class="hot mr-1"
  356.                                                               style="margin-right: 2px;font-size: 10px;">Rupture de stock</span>
  357.                                                     {% endif %}
  358.                                                     {% if product.isNew %}
  359.                                                         <span  class="new mr-1"
  360.                                                               style="margin-right: 2px;font-size: 10px;">Nouveau</span>
  361.                                                     {% endif %}
  362.                                                     {% if product.promotion and product.promotion.isValid and product.promotion.discountType=='amount' %}
  363.                                                         <span class="best"
  364.                                                               style="font-size: 10px;">-{{ product.promotion.discountValue }} <sup
  365.                                                                     class="currency-style">TND</sup></span>
  366.                                                     {% endif %}
  367.                                                     {% if product.promotion and product.promotion.isValid and product.promotion.discountType=='percent' %}
  368.                                                         <span class="best"
  369.                                                               style="font-size: 10px;">-{{ product.promotion.discountValue }} %</span>
  370.                                                     {% endif %}
  371.                                                 </div>
  372.                                             {% endif %}
  373.                                         </div>
  374.                                         <div class="product-content-wrap">
  375.                                             <h2><a href="{{ path('product_new', {id: product.id,name:product.name|slug}) }}">{{ product.name }}</a></h2>
  376.                                             {# <div class="rating-result" title="90%">
  377.                                         <span>
  378.                                         </span>
  379.                                     </div> #}
  380.                                             <div class="product-price">
  381.                                                 {% if product.promotion == null or (product.promotion and product.promotion.isValid == false) %}
  382.                                                     <span>{{ product.getPriceTtc() }} <sup
  383.                                                                 class="currency-style">TND</sup></span>
  384.                                                 {% endif %}
  385.                                                 {% if product.promotion and product.promotion.isValid and product.promotion.discountType=='amount' %}
  386.                                                     <span>{{ (product.getPriceTtc()-product.promotion.discountValue) }} <sup
  387.                                                                 class="currency-style">TND</sup></span>
  388.                                                 {% endif %}
  389.                                                 {% if product.promotion and product.promotion.isValid and product.promotion.discountType=='percent' %}
  390.                                                     <span>{{ (product.getPriceTtc()-(product.getPriceTtc()*product.promotion.discountValue/100)) }} <sup
  391.                                                                 class="currency-style">TND</sup></span>
  392.                                                 {% endif %}
  393.                                                 {% if product.promotion and product.promotion.isValid %}
  394.                                                     <span class="old-price">{{ product.getPriceTtc() }} <sup
  395.                                                                 class="currency-style">TND</sup></span>
  396.                                                 {% endif %}
  397.                                             </div>
  398.                                         </div>
  399.                                     </div>
  400.                                 </div>
  401.                             {% endfor %}
  402.                         </div>
  403.                     </div>
  404.                 </div>
  405.                 </div>
  406.             </div>
  407.         </section>
  410.     </main>
  411.     {#{% endverbatim %}#}
  412. {% endblock %}
  413. {% block javascripts %}
  414.     {{ parent() }}
  415.     <script src="{{ asset('front/assets/scripts/product/index.js') }}"></script>
  416.     <script>
  417.         $( document ).ready(function() {
  418.             window.scrollTo(0,200);
  419.         });
  420.     </script>
  422. {% endblock %}