templates/product/rivestimenti.html.twig line 1

Open in your IDE?
  1. <div class="row coatings-panel">
  2.     <div class="sidebar py-40 pe-30">
  3.         <div class="accordion" id="mobileAccordionRivestimenti">
  4.             <div class="accordion-item rounded-0 border-0">
  5.                 <div class="accordion-header">
  6.                     <button class="accordion-button rounded-0 bg-transparent shadow-none px-0 collapsed d-flex d-lg-none fs-25 fw-bold" type="button" data-bs-toggle="collapse" data-bs-target="#parentRivestimenti" aria-expanded="false" aria-controls="parentRivestimenti">
  7.                         {{ 'FILTERS'|trans }}
  8.                     </button>
  9.                 </div>
  10.                 <div class="sticky-lg-top pt-20 accordion" id="parentRivestimenti"></div>
  11.             </div>
  12.         </div>
  13.     </div>
  14.     <div class="col-12 col-lg coatings">
  15.         <div class="filters-active d-flex gap-10 mt-20 mb-10 ms-lg-55"></div>
  16.         <div class="row py-20 py-lg-40 gx-10 gy-30 g-lg-40 ms-lg-35 list" data-loc="{{ app.request.locale }}"></div>
  17.     </div>
  18. </div>
  22. <!-- Modal -->
  23. <div class="popupDetails modal modal-xl fade" id="popupCoating" tabindex="-1" aria-labelledby="popupCoatingLabel" aria-hidden="true">
  24.     <div class="modal-dialog modal-dialog-centered">
  25.         <div class="modal-content rounded-0">
  26.             <div class="modal-body p-5 p-lg-30">
  27.                 <!--<div class="d-flex flex-column flex-lg-row">
  28.                     <div class="col-12 col-lg-6">
  29.                         <figure class="zoomImage" onmousemove="zoom(event)" style="background-image: url(assets/images/temp/coatings/616080-zoom.jpg)">
  30.                             <img src="assets/images/temp/coatings/616080-zoom.jpg" alt="" class="w-100" />
  31.                         </figure>
  32.                     </div>
  33.                     <div class="col-12 col-lg-6 pt-30 pt-lg-0 ps-lg-30">
  34.                         <div class="d-flex justify-content-between position-lg-relative">
  35.                             <h4 class="modal-title fs-5" id="popupCoatingLabel">616080</h4>
  36.                             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  37.                         </div>
  38.                         <div class="table fs-16">
  39.                             <div class="d-flex">
  40.                                 <div class="col-6 border-bottom border-gray px-0 py-5">TIPOLOGIA</div>
  41.                                 <div class="col-6 border-bottom border-gray px-0 py-5">Ecopelle</div>
  42.                             </div>
  43.                             <div class="d-flex">
  44.                                 <div class="col-6 border-bottom border-gray px-0 py-5">CATEGORIA</div>
  45.                                 <div class="col-6 border-bottom border-gray px-0 py-5">A</div>
  46.                             </div>
  47.                             <div class="d-flex">
  48.                                 <div class="col-6 border-bottom border-gray px-0 py-5">COMPOSIZIONE</div>
  49.                                 <div class="col-6 border-bottom border-gray px-0 py-5">85% PVC - 15% PL</div>
  50.                             </div>
  51.                             <div class="d-flex">
  52.                                 <div class="col-6 border-bottom border-gray px-0 py-5">RESISTENZA ALL'ABRAZIONE</div>
  53.                                 <div class="col-6 border-bottom border-gray px-0 py-5">> 100.000 cicli</div>
  54.                             </div>
  55.                             <div class="d-flex">
  56.                                 <div class="col-6 border-bottom border-gray px-0 py-5">ALTEZZA</div>
  57.                                 <div class="col-6 border-bottom border-gray px-0 py-5">140 cm</div>
  58.                             </div>
  59.                             <div class="d-flex">
  60.                                 <div class="col-6 border-bottom border-gray px-0 py-5">TRATTAMENTO</div>
  61.                                 <div class="col-6 border-bottom border-gray px-0 py-5"></div>
  62.                             </div>
  63.                             <div class="d-flex">
  64.                                 <div class="col-6 border-bottom border-gray px-0 py-5">CALO AL LAVAGGIO IN ACQUA</div>
  65.                                 <div class="col-6 border-bottom border-gray px-0 py-5"></div>
  66.                             </div>
  67.                             <div class="d-flex">
  68.                                 <div class="col-6 border-bottom border-gray px-0 py-5">INFIAMMABILITÀ</div>
  69.                                 <div class="col-6 border-bottom border-gray px-0 py-5">Europe - EN 1021/1+2; UK - BS 5852-1(1979)<br> (Section,4 sources 0+1); California test (USA)</div>
  70.                             </div>
  71.                             <div class="d-flex">
  72.                                 <div class="col-6 border-bottom border-gray px-0 py-5">NORME DI MANUTENZIONE</div>
  73.                                 <div class="col-6 border-bottom border-gray px-0 py-5 d-flex flex-wrap">
  74.                                     <img src="assets/images/icons/ico-non-candeggiabile.jpg" alt="" />
  75.                                     <img src="assets/images/icons/ico-no-lavaggio-acqua.jpg" alt="" />
  76.                                     <img src="assets/images/icons/ico-no-asciugatura.jpg" alt="" />
  77.                                     <img src="assets/images/icons/ico-no-pulitura-secco.jpg" alt="" />
  78.                                     <img src="assets/images/icons/ico-no-stiratura.jpg" alt="" />
  79.                                 </div>
  80.                             </div>
  81.                             <div class="d-flex">
  82.                                 <div class="col-6 border-bottom border-gray px-0 py-5">ATTENZIONE</div>
  83.                                 <div class="col-6 border-bottom border-gray px-0 py-5">le tonalità colore sono indicative e possono differire dall'originale.</div>
  84.                             </div>
  85.                             <div class="d-flex">
  86.                                 <div class="col-6 border-bottom border-gray px-0 py-5">DECORO</div>
  87.                                 <div class="col-6 border-bottom border-gray px-0 py-5">proporzione decoro su 50 cm di tessuto</div>
  88.                             </div>
  89.                         </div>
  90.                     </div>
  91.                 </div>-->
  92.             </div>
  93.         </div>
  94.     </div>
  95. </div>
  97. <script>
  98.     function zoom(e){
  99.         var zoomer = e.currentTarget;
  100.         e.offsetX ? offsetX = e.offsetX : offsetX = e.touches[0].pageX
  101.         e.offsetY ? offsetY = e.offsetY : offsetX = e.touches[0].pageX
  102.         x = offsetX/zoomer.offsetWidth*100
  103.         y = offsetY/zoomer.offsetHeight*100
  104.         zoomer.style.backgroundPosition = x + '% ' + y + '%';
  105.     }
  106. </script>