templates/pages/collection/section/single-collection-tablet.html.twig line 1

Open in your IDE?
  1. <div class="page--mainwrap single-collection p-0 slideJs single-collection-tablet">
  2.     <div class="page--mainwrap-header single-collection--header">
  3.         <h3 class="page--mainwrap-header-heading">
  4.             {% if collection is defined %}
  5.                 {{ collection.name }}
  6.             {% endif %}
  7.         </h3>
  8.         <hr>
  9.         {% include 'layouts/block/breadcrumbs.html.twig' %}
  10.     </div>
  11.     <div class="page--mainwrap-content single-collection--content">
  12.         <div class="single-collection--content-desc page--mainwrap-content-desc">
  13.             <div class="single-collection--content-desc-img">
  14.                 <picture>
  15.                     <source srcset="{{ collection.attachmentsFile['urls'][0]['webp']['thumb_320x280'] }}" type="image/webp">
  16.                     <source srcset="{{ collection.attachmentsFile['urls'][0]['jpg']['thumb_320x280'] }}" type="image/jpeg">
  17.                     <img src="{{ collection.attachmentsFile['urls'][0]['jpg']['thumb_320x280'] }}" alt="{{ collection.name }}" class="single-collection--content-desc-img-thumb">
  18.                 </picture>
  19.             </div>
  20.             <div class="single-collection--content-desc-txt">
  21.                 <div class="single-collection--content-desc-txt-title txt--label">
  22.                     <h3 class="txt--label">{{ 'Collection DNA'|trans|upper  }}</h3>
  23.                 </div>
  24.                 <p>{{ collection.description|raw }}</p>
  25.             </div>
  26.         </div>
  27.         <div class="single-collection--content-menus">
  28.             <div class="single-collection--content-menus-menu mobileview--menu">
  29.                 <div class="single-collection--content-menus-menu-title mobileview--toggler toggler--subtitle">
  30.                     <h3 class="txt--label">{{ 'Technical details'|trans|upper }}</h3>
  31.                     <span class="mobileview--caretdown toggler--caretdown"><i class="fas fa-caret-down"></i></span>
  32.                 </div>
  33.                 <div class="single-collection--content-menus-menu-content mobileview--toggled-content toggler--list collapse">
  34.                     <div class="single-collection--content-menus-menu-content-list">
  35.                         <ul>
  36.                             <li>{{ 'Composition description' | trans }}</li>
  37.                             <li>{{ 'Warranty 10 years' | trans }}</li>
  38.                             <li>{{ 'Level of use Class 33' | trans }}</li>
  39.                             <li>{{ 'Reaction to fire description' | trans }}</li>
  40.                             <li><a href="{{ path("pages_2tec2Play_index", { _locale: currentLocale }) }}">{{ "Sizes"|trans }}</a></li>
  41.                             <li><a href="{{ path('pages_aboutOurFloors_detail', { _locale:  currentLocale, sectionSlug: section_acoustic.slug }) }}">{{ "Acoustic Comfort Backing"|trans }}</a></li>
  42.                         </ul>
  43.                     </div>
  44.                 </div>
  45.             </div>
  46.             <div class="single-collection--content-menus-menu mobileview--menu">
  47.                 <div class="single-collection--content-menus-menu-title mobileview--toggler toggler--subtitle">
  48.                     <h3 class="txt--label">{{ 'Download'|trans|upper }}</h3>
  49.                     <span class="mobileview--caretdown toggler--caretdown"><i class="fas fa-caret-down"></i></span>
  50.                 </div>
  51.                 <div class="single-collection--content-menus-menu-content mobileview--toggled-content toggler--list collapse">
  52.                     <ul class="single-product--content-menus-menu-content-list">
  53.                         <li>
  54.                             {% if currentLocale == 'en' %}
  55.                                 {% if collection.name == 'Desert' or collection.name == 'Marble' %}
  56.                                     <a href="{{asset('uploads/pdf/technical_informations/2tec2-en-1.pdf') }}" target="_blank">
  57.                                 {% else %}
  58.                                     <a href="{{asset('uploads/pdf/technical_informations/2tec2-en-2.pdf') }}" target="_blank">
  59.                                 {% endif %}
  60.                             {% elseif currentLocale == 'ja' %}
  61.                                 {% if collection.name == 'Desert' or collection.name == 'Marble' %}
  62.                                     <a href="{{asset('uploads/pdf/technical_informations/2tec2-jp-1.pdf') }}" target="_blank">
  63.                                 {% else %}
  64.                                     <a href="{{asset('uploads/pdf/technical_informations/2tec2-jp-2.pdf') }}" target="_blank">
  65.                                 {% endif %}
  66.                                 {% elseif currentLocale == 'fr' %}
  67.                                 <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EZc8UYdORtNPvsddtJLQbpgBESOsZGeDSnkaQ8dSWbmcCg?e=TWQZYz" target="_blank">
  68.                                     {% elseif currentLocale == 'nl' %}
  69.                                     <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/ERWMm7hSLQBIiNGBAg1wLJEBXWxhJUPqtldl4NSsdKEXYg?e=qZQas2" target="_blank">
  70.                                         {% elseif currentLocale == 'de' %}
  71.                                         <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EeHjSbk4TetKg-YGl9x8y4UBhi9QV5HHmhU5hB2dF2dfDg?e=TlSBgx" target="_blank">
  72.                                             {% elseif currentLocale == 'es' %}
  73.                                             <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EfuOLvLdDv5Pgw1iEO14HuMB4Hf4wPQvI7YliIFKFURygg?e=Cacews" target="_blank">
  74.                                                 {% elseif currentLocale == 'it' %}
  75.                                                 <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EeKWBg-jJu9MrfaDTm4FLLUBm2QJIYG2fZh68iRIB7lL1w?e=bOfdPD" target="_blank">
  76.                                                     {% endif %}
  77.                                                     {{ 'Technical sheet' | trans }}
  78.                                                 </a>
  79.                         </li>
  80.                         <li><a href="https://limitededition.sharepoint.com/:f:/s/mediabank_/2tec2/EvymjjMNr3lItncIKWbcXDYBHp8t51IXqIpMOPU2kAx1HA?e=P0SgXS" target="_blank">{{ 'Installation' | trans }}</a></li>
  81.                         <li>
  82.                             {% if currentLocale == 'en' %}
  83.                             <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EUqs09pV5vVIvMGJV7RxMnsBQZt3TWHvNQbq-mdYMBDp_Q?e=UVgJBv" target="_blank">
  84.                                 {% elseif currentLocale == 'fr' %}
  85.                                 <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EUz_d0I-UM5PvMdCT3ZuNm4Bw6UOPVAHz0-cIDUPT-m13w?e=NmVm3V" target="_blank">
  86.                                     {% elseif currentLocale == 'nl' %}
  87.                                     <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/Efhflj8E2-lKh4UFIceal4sB524XIsG_gkKN2f2NI42clQ?e=E0SlKn" target="_blank">
  88.                                         {% elseif currentLocale == 'de' %}
  89.                                         <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EXkr-rJGCaJMl09Gq8CmFpQBRqbBNskwEdrtj5DIoha73A?e=czwv8z" target="_blank">
  90.                                             {% elseif currentLocale == 'es' %}
  91.                                             <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/ETlxOh88ohxOvAELZiXvaEABUDWheDlzPO36HZZIbYrZNw?e=t6HFSU" target="_blank">
  92.                                                 {% elseif currentLocale == 'it' %}
  93.                                                 <a href="https://limitededition.sharepoint.com/:b:/s/mediabank_/2tec2/EcvmL2BRTXdMvOU0n7ZijeIBAA6TJGgG5Qg_Zg0cEjiaVw?e=11yaRG" target="_blank">
  94.                                                     {% endif %}
  95.                                                     {{ 'Maintenance' | trans }}
  96.                                                 </a>
  97.                         </li>
  98. {#                        <li class="add-technical-to-download" >{{ 'Technical sheet' | trans }}</li>
  99.                         <li class="add-installation-to-download" >{{ 'Installation' | trans }}</li>
  100.                         <li class="add-maintenance-to-download" >{{ 'Maintenance' | trans }}</li>#}
  101.                     </ul>
  102.                 </div>
  103.             </div>
  104.             <div class="single-collection--content-menus-menu mobileview--menu">
  105.                 <div class="single-collection--content-menus-menu-title mobileview--toggler toggler--subtitle">
  106.                     <h3 class="txt--label">{{ collection.tile ? "Available in various shapes" | trans | upper : 'Available roll' | trans | upper }}</h3>
  107.                     <span class="mobileview--caretdown toggler--caretdown"><i class="fas fa-caret-down"></i></span>
  108.                 </div>
  110.                 {% if collection.tile %}
  111.                     <div class="single-collection--content-menus-menu-content mobileview--toggled-content toggler--list collapse">
  112.                     <div class="single-collection--content-menus-menu-content-list">
  113.                         <div class="single-product--content-menus-menu-content-list-icons d-flex justify-content-between align-items-center col-12 p-0 mt-1 mb-2">
  114.                             <span class="col-15 p-0"><img src="{{ asset('build/icon/2tec2_detailshape_triangle.svg') }}" alt="{{ "triangle shape icon"|trans }}"></span>
  115.                             <span class="col-15 p-0"><img src="{{ asset('build/icon/2tec2_detailshape_square.svg') }}" alt="{{ "square shape icon"|trans }}"></span>
  116.                             <span class="col-15 p-0"><img src="{{ asset('build/icon/2tec2_detailshape_minisquare.svg') }}" alt="{{ "mini-square shape icon"|trans }}"></span>
  117.                             <span class="col-15 p-0"><img src="{{ asset('build/icon/2tec2_detailshape_plank.svg') }}" alt="{{ "plank shape icon"|trans }}"></span>
  118.                             <span class="col-15 p-0"><img src="{{ asset('build/icon/2tec2_detailshape_diamond.svg') }}" alt="{{ "diamond shape icon"|trans }}"></span>
  119.                             <span class="col-15 p-0"><img src="{{ asset('build/icon/2tec2_detailshape_hexagon.svg') }}" alt="{{ "hexagon shape icon"|trans }}"></span>
  120.                         </div>
  121.                         <a href="{{ path("pages_2tec2Play_index", { _locale: currentLocale }) }}" class="single-collection--content-menus-menu-content-list-a cta-button btn page-btn">
  122.                             {{ include('layouts/buttons/2tec2_multi_tab.html.twig') }}
  123.                             {{ 'Read more' | trans }}
  124.                         </a>
  125.                     </div>
  126.                 </div>
  127.                 {% endif %}
  128.                 {% if not collection.tile %}
  129.                     <a href="{{ path("pages_2tec2Play_index", { _locale: currentLocale }) }}" class="single-collection--content-menus-menu-content-list-a cta-button btn page-btn">
  130.                         {{ include('layouts/buttons/2tec2_multi_tab.html.twig') }}
  131.                         {{ 'Read more' | trans }}
  132.                     </a>
  133.                 {% endif %}
  134.             </div>
  135.             {% if collection.tile %}
  136.                 <div class="single-collection--content-menus-menu mobileview--menu">
  137.                     <div class="single-collection--content-menus-menu-title mobileview--toggler toggler--subtitle">
  138.                         <h3 class="txt--label">{{ "Installation pattern tiles" | trans | upper }}</h3>
  139.                         <span class="mobileview--caretdown toggler--caretdown"><i class="fas fa-caret-down"></i></span>
  140.                     </div>
  141.                     <div class="single-collection--content-menus-menu-content mobileview--toggled-content toggler--list collapse">
  142.                         <div class="single-collection--content-menus-menu-content-list single-collection--content-menus-menu-content-list-patern">
  143.                             {% if collection.checkerboard %}
  144.                                 <img src="{{ asset('build/icon/2tec2_tiles_checkerboard.svg') }}" title="{{ 'Checkerboard'|trans }}" alt="{{ 'checkerboard installation icon'|trans }}">
  145.                             {% elseif collection.monolithic %}
  146.                                 <img src="{{ asset('build/icon/2tec2_tiles_monolithic.svg') }}" title="{{ 'Monolithic'|trans }}" alt="{{ 'monolithic installation icon'|trans }}">
  147.                             {% elseif collection.brick %}
  148.                                 <img src="{{ asset('build/icon/2tec2_tiles_brick.svg') }}" title="{{ 'Brick'|trans }}" alt="{{ 'brick installation icon'|trans }}">
  149.                             {% endif %}
  150.                         </div>
  151.                     </div>
  152.                 </div>
  153.             {% endif %}
  154.         </div>
  155.         <div class="page--mainwrap-content-button single-collection--content-button">
  156.             <a rel="canonical" href="{{ threeDSimulationUrl }}" class="cta-button btn page-btn add-collection-to-cart" data-collection="{{ collection.id }}" data-redirect="true">
  157.                 {{ "3D Simulation" | trans }}
  158.                 {{ include('layouts/buttons/2tec2_3d_simulation.html.twig') }}
  159.             </a>
  160.         </div>
  161.     </div>
  162.     <div class="page--mainwrap-arrow slideArrow">
  163.         <img src="{{ asset('build/icon/2tec2_arrow_bottom_black.svg') }}" alt="{{ 'caret down icon' | trans }}"/>
  164.     </div>
  165. </div>
  166. <div class="page--subwrap p-0 carouselLgDiv single-collection-tablet">
  167.     <div class="page--subwrap-carousel-lg carouselLg carouselDiv carouselLg-alts">
  168.     </div>
  169. </div>
  170. <div class="page--mainwrap single-collection p-0 slideJs single-collection-tablet">
  171.     <div class="page--mainwrap-header single-collection--header">
  172.         <h3 class="page--mainwrap-header-heading">
  173.             {{ collection.name }}
  174.         </h3>
  175.         <hr>
  176.         {% include 'layouts/block/breadcrumbs.html.twig' %}
  177.     </div>
  178.     <div class="page--mainwrap-content single-collection--content">
  179.         <div id="productCollectionTablet" class="page--mainwrap-content-react" data-filter="{% if filter is defined %}{{ filter }}{% endif %}"
  180.              data-filterValue="{% if filterValue is defined %}{{ filterValue }}{% endif %}"></div>
  181.         <div class="page--mainwrap-content-button single-collection--content-button">
  182.             <a rel="canonical" href="{{ threeDSimulationUrl }}" class="cta-button btn page-btn add-collection-to-cart" data-collection="{{ collection.id }}" data-redirect="true">
  183.                 {{ "3D Simulation" | trans }}
  184.                 {{ include('layouts/buttons/2tec2_3d_simulation.html.twig') }}
  185.             </a>
  186.         </div>
  187.     </div>
  188.     <div class="page--mainwrap-arrow slideArrow">
  189.         <img src="{{ asset('build/icon/2tec2_arrow_bottom_black.svg') }}" alt="{{ 'caret down icon' | trans }}">
  190.     </div>
  191. </div>
  192. <div class="page--subwrap p-0 carouselLgDiv single-collection-tablet">
  193.     <div class="page--subwrap-carousel-lg carouselLg carouselDiv carouselLg-alts">
  194.     </div>
  195. </div>