templates/produit/show.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %} 
  5.         {% set lang = app.session.get('_locale') %}
  6.         {{ ('title' ~ lang ) |trans({}, 'messages') }}
  7.  {% endblock %}
  9. {% block body %}
  10. <div class="cards">
  11.         
  12.         
  14.         <div class="label-text">
  15.                 {{ ('produit' ~ lang ) |trans({}, 'messages') }}
  16.                    {{ app.session.get('srv_msg') }}
  17.                 <strong class="biggold label-text-green">  {{produit.productName}} </strong>
  18.         </div>
  21.     <div class="cardflexrow cardflexrowastart">
  22.         
  23.         <div class="col-prd-2 col-prd-3 col-prd-5 col-prd-6">
  24.                 <div class="cards">
  25.                         {% if produit.images|length > 0 %}
  26.                         <div class="cardbody">
  27.                                       
  28.                                 <div class="parent-container">
  29.                                         <div class="navigation-button">
  30.                                                 <div class="previous nav-btn"><</div>
  31.                                                 <div class="slider-carousel">
  32.                                                 {% for image in produit.images%}
  33.                                                         <div class="images {{( loop.first ) ?  'main' : '' }}">
  35.                                                                 <img class="cardimg" src="{{asset('assets/uploads/products/' ~ image.fileName)}}" class="cardimg" alt="...">
  36.                                                         </div>
  37.                                                 {%endfor%}
  38.                                                 </div>
  39.                                                 <div class="next nav-btn">></div>
  40.                                         </div>
  41.                                                    
  42.                                             
  43.                                                    
  44.                                 </div>
  45.                         </div>  
  46.                         {% endif %}
  47.                                 
  48.                 </div>
  49.         </div>
  50.         {%  if produit.produitVariants | length > 0  %}
  52.         <div class="col-prd-2 col-prd-3 col-prd-5 col-prd-6">
  54.                 <div class="cards product-options">
  55.                         
  56.                         <!-- Color Options -->
  57.                         <div class="color-selection">
  58.                             <div class="colors" id="colors">
  59.        
  60.                                 <div id="hiddenData" style="display: none;">{{ variants|json_encode() }}</div>
  61.                                 {% if groupedVariantscolor|length > 0 %}
  62.                                         <label for="color">Color:</label>
  64.                                         {% for color, variants in groupedVariantscolor %}
  66.                                         
  67.                                         <div class="colors" id="colors">
  69.                                                 <div class="color-option" data-color={{color}}
  70.                                                 data-pid= {{produit.id}}
  71.                                                 style="background-color: {{color}}"></div>
  72.                                         </div>
  73.                                         
  74.                                         {% endfor %}
  75.                                 {% endif %}
  77.                         </div>
  78.                         </div>
  79.                     
  80.                         <!-- Size Options -->
  81.                         <div class="size-selection">
  83.                             <div class="sizes" id="sizes">
  84.                 {% if  groupedVariantssize|length > 0 %}
  85.                         <label for="size">Size:</label>
  86.                         {% for size, variants in groupedVariantssize %}
  88.                                 <button class="size-option" data-size={{size}} disabled>{{size}}</button>
  89.                         {% endfor %}
  90.                 {% endif %}
  92.                         </div>
  93.                         </div>
  94.                     </div>
  96.         </div>
  98.         {% endif  %}  
  99.         <div class="col-prd-2 col-prd-3 col-prd-5 col-prd-6">
  100.                 <div class="cards">
  101.                         <!--<div class="cardtitle"> {{produit.productName}}</div>-->
  102.                         <div class="cardflexspace ">
  104.                                 
  106.                                 {%  if produit.promo %}
  107.                                         <div class="label-text label-text-promo">
  108.                                         {{produit.salePrice | number_format(2, '.', ',') }} $
  109.                                         </div>
  110.                                         <div class="label-text"> {{ ('promo' ~ lang ) |trans({}, 'messages') }} </div>
  111.                                 {%else %}
  112.                                         <div class="label-text">
  113.                                         {{produit.prix | number_format(2, '.', ',') }} $
  114.                                         </div>
  115.                   
  116.                                 {% endif  %}  
  117.                               
  119.                         </div>
  120.                          <div class="cardfooter">
  121.                                 <div class="cardflexrow">
  122.                                 <form method="post">
  123.                                 <input type="hidden" id="chosenColor" name="chosenColor">
  124.                                 <input type="hidden" id="chosenSize" name="chosenSize">
  125.                                 <input type="hidden" name="productid"  value={{produit.id}}/>
  126.                                 <input id="qttprdid" class="qtyinput" name="qttprdid"  type="number" min="1" value=1 ></input>
  127.                                 <input type="hidden" name="_csrf_token"
  128.                                 value="{{ csrf_token('authenticate') }}">
  129.                                 
  130.                                 <button  class=" btn btn-light " type="submit"  id="add-button"
  131.                                 formaction="{{ path('panier_add',{'id':produit.id,'idVariante':'notdefined','option':'continue'}) }}">
  132.                                         <!--<i class="fa-solid fa-check"></i>-->
  133.                                         <i class="fa-solid fa-cart-plus"></i>
  134.                                 </button>
  136.                                 <button  class=" btn btn-light" type="submit" id="checkout-button"
  137.                                 formaction="{{ path('panier_add',{'id':produit.id,'idVariante': 'notdefined' ,'option':'done'}) }}">
  138.                                 <i class="fa-solid fa-cart-arrow-down"> Checkout </i>
  139.                                 </button>
  140.                                 </form>
  141.                                         
  142.                                 </div>
  144.                                         
  145.                                 </div>
  146.                                 
  147.                         <p class="text text-muted">{{produit.description}}</p>
  149.                         </div>
  150.                 </div>
  152.                
  153.         </div>
  154. </div>
  155. </div>
  157. {% endblock %}