templates/front/product-option/new_index2.html.twig line 1

Open in your IDE?
  1. {% extends 'front/layout.html.twig' %}
  3. {% if product.metaTitle %}
  4.     {% block title %}
  5.         {{ product.metaTitle | trans({}, "pageCmsTranslate") }}
  6.     {% endblock %}
  7. {% endif %}
  8. {% if product.metaDescription %}
  9.     {% block metaDescription %}
  10.         <meta name="description" content="{{ product.metaDescription | trans({}, "pageCmsTranslate") }}">
  11.     {% endblock %}
  12. {% endif %}
  14. {% block googleTagManagerDataLayer %}
  15.     {% include 'google_tag.html.twig' with {'titlePage':'product option','categoryPage':'product-details','navigation_category1':'','navigation_category2':'','navigation_category3':'' }   %}
  16. {% endblock %}
  17. {% block stylesheets %}
  18.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.5.5/css/simple-line-icons.min.css">
  19.     {{ encore_entry_link_tags('color_lab_product') }}
  20.     {{ parent() }}
  21. {% endblock %}
  22. {% macro value(cart,object,name) %}
  23.     {% if object %}
  24.         {% if cart|access(object) %}
  25.             {% set obj = cart|access(object) %}
  26.             value="{% if obj|access(name) %}{{ obj|access(name) }}{% endif %}"
  27.         {% else %}
  28.             value=""
  29.         {% endif %}
  30.     {% else %}
  31.         value="{% if cart|access(name) %}{{ cart|access(name) }}{% endif %}"
  32.     {% endif %}
  33. {% endmacro %}
  34. {% block body %}
  35.     {% include 'front/header.html.twig' %}
  36.     {% set currentPath = app.request.requesturi %}
  37.     <script>
  38.         var isMobile = "{{ app.request.get('isMobile') }}";
  39.         var str1 = '?';
  40.         var str2 = '{{ currentPath }}';
  41.         str2 = str2.replace(/&amp;/g, '&');
  42.         if(str2.indexOf('isMobile') != -1){
  43.             var str2 = str2.substring(0 ,str2.indexOf('isMobile') - 1);
  44.         }
  45.         var str3 = '?';
  46.         if(str2.indexOf(str1) != -1){
  47.             str3 = '&';
  48.         }
  49.         if($( window ).width() > 768 ) {
  50.             if(isMobile == '1'){
  51.                 window.location.replace(str2+str3+"isMobile=0");
  52.             }
  53.         }else {
  54.             if(isMobile != '1') {
  55.                 window.location.replace(str2+str3+"isMobile=1");
  56.             }
  57.         }
  58.     </script>
  59.     <input type="hidden" id="newPage" value="1">
  60.     <input type="hidden" id="designId" value="{% if cartDetail  %}{{ cartDetail.templateIdCrello }}{% endif %}">
  61.     <input type="hidden" name="tokenDetail" id="tokenDetail" value="{% if cartDetail  %}{{ cartDetail.token }}{% endif %}">
  62.     {% set productObject = null %}
  63.     {% if cartDetail and cartDetail.product %}
  64.         {% set productObject = cartDetail.product %}
  65.     {% elseif  app.request.get('product') %}
  66.          {% set productObject =  getProductById(app.request.get('product')) %}
  67.     {% endif %}
  68.     {% set isMobileInterface = false %}
  69.     {% if app.request.get('isMobile') == '1' %}
  70.         {#mobile#}
  71.         {% set isMobileInterface = true %}
  72.         <input type="hidden" value="1" id="isMobileInterface">
  73.         <div class="productIndexOptionNewMobile">
  74.             {% if cartDetail %}
  75.                 {% set idProduct = cartDetail.product.id %}
  76.             {% else %}
  77.                 {% if app.request.get('product') %}
  78.                     {% set idProduct = app.request.get('product') %}
  79.                 {% endif %}
  80.             {% endif %}
  81.             <input value="{{ idProduct }}" checked="checked" data-new-page="1" style="display: none" data-url="{{ path('product_option') }}?product={{ idProduct }}" type="radio" name="productOption" >
  83.             <div class="col-12 pl-0 pr-0 linkTitreFirstProduct" >
  84.                 <a href="{{ path('besoin_produits') }}" class="paddingMobileOptionProduct">
  85.                     <svg xmlns="http://www.w3.org/2000/svg" width="11" height="18" viewBox="0 0 11 18" fill="none">
  86.                         <path d="M9 2L2 9L9 16" stroke="#211E1D" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
  87.                     </svg>
  88.                     <span class="">{{ product.getTypeProductName() }}</span>
  89.                 </a>
  90.             </div>
  91.             {% set dataLivraisonArray2 = getDataLivraisonWithOrNotImprimeur() %}
  92.             <div class="blocLivraisonBesoinProduct">
  93.                 <div class="bloc1LivraisonBesoinProduct">
  94.                     <p style="display: flex;margin-bottom:0px">
  95.                     <span>
  96.                         đŸš€
  97.                     </span>
  98.                         <span class="bloc1LivraisonBesoinProductText">
  99.                         {{ 'Commandez avant 17h, livrĂ© aujourd’hui chez vous !' | trans({}, "productTranslate") }}
  100.                     </span>
  101.                     </p>
  102.                 </div>
  103.                 {% if dataLivraisonArray2.addresse.addresseAdresse %}
  104.                     <div class="bloc2LivraisonBesoinProduct">
  105.                         <p style="">
  106.                         <span>
  107.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  108.                               <g clip-path="url(#clip0_39_1752)">
  109.                                 <path d="M12 2C8.13 2 5 5.13 5 9C5 14.25 12 22 12 22C12 22 19 14.25 19 9C19 5.13 15.87 2 12 2ZM12 11.5C10.62 11.5 9.5 10.38 9.5 9C9.5 7.62 10.62 6.5 12 6.5C13.38 6.5 14.5 7.62 14.5 9C14.5 10.38 13.38 11.5 12 11.5Z" fill="#323232"/>
  110.                               </g>
  111.                               <defs>
  112.                                 <clipPath id="clip0_39_1752">
  113.                                   <rect width="24" height="24" fill="white"/>
  114.                                 </clipPath>
  115.                               </defs>
  116.                             </svg>
  117.                         </span>
  118.                             <span class="bloc1LivraisonBesoinProductText">
  119.                             {{ dataLivraisonArray2.addresse.addresseAdresse }}
  120.                         </span>
  121.                         </p>
  122.                         {% if dataLivraisonArray2.time %}
  123.                             <p style="border-top: 0.5px solid #DDD;">
  124.                         <span>
  125.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  126.                               <g clip-path="url(#clip0_39_1755)">
  127.                                 <path d="M7 2V13H10V22L17 10H13L17 2H7Z" fill="#323232"/>
  128.                               </g>
  129.                               <defs>
  130.                                 <clipPath id="clip0_39_1755">
  131.                                   <rect width="24" height="24" fill="white"/>
  132.                                 </clipPath>
  133.                               </defs>
  134.                             </svg>
  135.                         </span>
  136.                                 <span class="bloc1LivraisonBesoinProductText">
  137.                             Livraison aujourd’hui : {{ dataLivraisonArray2.time }}
  138.                         </span>
  139.                             </p>
  140.                         {% endif %}
  141.                     </div>
  142.                 {% endif %}
  143.                 <div class="bloc3LivraisonBesoinProduct">
  144.                     <div class="bloc3LivraisonBesoinProductStr">
  145.                         <h4 class="mt-0">{{ 'Voici les options disponible Ă  cette adresse' | trans({}, "productTranslate") }} :</h4>
  146.                         <div class="bloc3LivraisonBesoinProductStrDispo">
  147.                             {% if dataLivraisonArray2.dataLivraison is defined and dataLivraisonArray2.dataLivraison.imprimeurZoneChalandise %}
  148.                                 <p style="">
  149.                                 <span class="livStatusNew2Green">
  150.                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  151.                                         <rect width="20" height="20" rx="10" fill="#8CC378"/>
  152.                                         <path d="M6 10.2L8.86364 13L15 7" stroke="white" stroke-width="2.5" stroke-linecap="round"/>
  153.                                     </svg>
  154.                                 </span>
  155.                                     <span>Livraison 30 min</span>
  156.                                 </p>
  157.                             {% endif %}
  158.                             {% if dataLivraisonArray2.dataLivraison is defined and dataLivraisonArray2.dataLivraison.imprimeurPointRetrait %}
  159.                                 <p style="">
  160.                                 <span class="livStatusNew2Green">
  161.                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  162.                                         <rect width="20" height="20" rx="10" fill="#8CC378"/>
  163.                                         <path d="M6 10.2L8.86364 13L15 7" stroke="white" stroke-width="2.5" stroke-linecap="round"/>
  164.                                     </svg>
  165.                                 </span>
  166.                                     <span>Point retrait 1h</span>
  167.                                 </p>
  168.                             {% endif %}
  169.                             {% if dataLivraisonArray2.dataLivraison is defined and (dataLivraisonArray2.dataLivraison.imprimeurLivraisonNationalJ5 or dataLivraisonArray2.dataLivraison.imprimeurLivraisonNational) %}
  170.                                 <p style="">
  171.                                 <span class="livStatusNew2Green">
  172.                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  173.                                         <rect width="20" height="20" rx="10" fill="#8CC378"/>
  174.                                         <path d="M6 10.2L8.86364 13L15 7" stroke="white" stroke-width="2.5" stroke-linecap="round"/>
  175.                                     </svg>
  176.                                 </span>
  177.                                     <span>Livraison 48h/J+5</span>
  178.                                 </p>
  179.                             {% endif %}
  181.                         </div>
  182.                     </div>
  183.                 </div>
  184.                 <div class="bloc4LivraisonBesoinProduct">
  185.                     <p> â­ïž {{ getRatingCopees() }}/5 sur Google</p>
  186.                 </div>
  187.             </div>
  189.             <div class="col-12 paddingMobileOptionProduct" >
  190.                 <h3 class="productTitreMobile">{{ product.productTitreMobile|trans({}, "productTranslate") }}</h3>
  191.             </div>
  192.             <div class="col-12">
  193.                 <div class="imageOptionProductMobile">
  194.                     <div id="custCarousel" class="carousel slide" data-ride="carousel" align="center">
  195.                         <div class="carousel-inner">
  196.                             {% for item in product.productImageMobile %}
  197.                                 <div class="carousel-item {% if loop.first %}active{% endif %}">
  198.                                     <img src="{{ asset('imageSite/'~item.image) }}" alt="Hills">
  199.                                 </div>
  200.                             {% endfor %}
  201.                         </div>
  203.                         <ol class="carousel-indicators list-inline">
  204.                             {% for item in product.productImageMobile %}
  205.                                 <li class="list-inline-item {% if loop.first %}active{% endif %}">
  206.                                     <a id="carousel-selector-0"{% if loop.first %}class="selected" {% endif %}  data-slide-to="{{ loop.index0 }}" data-target="#custCarousel">
  207.                                         <img src="{{ asset('imageSite/'~item.image) }}" class="img-fluid">
  208.                                     </a>
  209.                                 </li>
  210.                             {% endfor %}
  211.                         </ol>
  212.                     </div>
  213.                 </div>
  214.             </div>
  216.             <div id="optionsBlocMobile" class="paddingMobileOptionProduct">
  218.             </div>
  220.             <div id="quantityBlocNew" class="paddingMobileOptionProduct">
  222.             </div>
  223.             <div id="optionsBlocDescriptionMobile" class="paddingMobileOptionProduct">
  224.                 <div id="nosLovesPrinter">
  226.                 </div>
  227.             </div>
  228.             <div class="paddingMobileOptionProduct row_select_ca1 oghtml5">
  229.                 <div class="Comm_adress">
  230.                     <h3>{{ 'Votre adresse' | trans({}, "productTranslate") }}</h3>
  231.                     <div role="group" class="form-group">
  232.                         <input id="addresseLiv" name="addresseLiv" type="text" class="form-control adresee-google-map" placeholder=" "
  233.                                 {% if app.session.get('addresseAdresse') %} value="{{ app.session.get('addresseAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','adresse') }} {% endif %} >
  234.                         <label for="addresseLiv" class="d-block form-control-placeholder"> {{ 'Commencez Ă  saisir la premiĂšre ligne de votre adresse' | trans({}, "productTranslate") }}</label>
  235.                         <input type="hidden" id="longLiv"  {% if app.session.get('longiAdresse') %} value="{{ app.session.get('longiAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','longi') }}{% endif %} name="longLiv">
  236.                         <input type="hidden" id="latLiv" {% if app.session.get('latAdresse') %} value="{{ app.session.get('latAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','lat') }}{% endif %} name="latLiv">
  237.                         <input type="hidden" id="codePostalLiv" {% if app.session.get('postalcodeAdresse') %} value="{{ app.session.get('postalcodeAdresse') }}" {% else %} {{ _self.value(cart,'adresseLivraison','codePostal') }}{% endif %} name="codePostalLiv">
  238.                         <input type="hidden" id="CountryLiv" value="{% if app.session.get('CountryLiv') %}{{ app.session.get('CountryLiv') }}{% else %}{% if cart.adresseLivraison.country is defined  %}{{ cart.adresseLivraison.country }}{% endif %}{% endif %}" name="CountryLiv">
  239.                         <input type="hidden" value="{% if app.session.get('CountryCodeLiv') %}{{ app.session.get('CountryCodeLiv') }}{% else %}{% if cart.adresseLivraison.countryCode is defined %}{{ cart.adresseLivraison.countryCode }}{% endif %}{% endif%}" name="CountryCodeLiv" id="CountryCodeLiv">
  240.                         <input type="hidden" id="cityLiv" {% if app.session.get('cityAdresse') %} value="{{ app.session.get('cityAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','city') }}{% endif %} name="cityLiv">
  241.                     </div>
  242.                 </div>
  243.                 <div id="modeLivraison">
  245.                 </div>
  246.                 {% if cartDetail.id is not defined  %}
  247.                     <div id="crelloButtons" class="crelloButtonsBlock crelloButtonsNew">
  249.                     </div>
  250.                 {% endif %}
  252.                 {% if cartDetail  %}
  253.                     {% include 'front/product-option/productPreviewModal.html.twig'  with {'isMobileInterface':isMobileInterface } %}
  254.                     {% if cartDetail.product.typeProduct  in [ constant('App\\Entity\\Product::PHOTOS')]%}
  255.                         <div class="txt_selectca mb-2" style=""> <a href="#" style="" class="crelloBtnImportPhotos crelloBtnImportNow" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  256.                     {% else %}
  257.                         {% if cartDetail.templateIdCrello  %}
  258.                             <div class="txt_selectca mb-2" style="min-height: 43px;"> <a href="#" style="color: #fff;" class="crelloBtn btnMobileImport" >{{ 'Vous pouvez Ă©diter votre crĂ©ation sur' | trans({}, "productTranslate") }} <img  width="130px"  src="{{ asset('/images/ininfoselectF.svg') }}" ></a></div>
  259.                             <input type="hidden" id="designUrl" value="">
  260.                             <input type="hidden" id="designType" value="{{ cartDetail.productAttribute.format.designTypeCrello }}">
  261.                             <input type="hidden" id="customDesignType" value="{{ cartDetail.productAttribute.format.designTypeCustomCrello }}">
  262.                             <input type="hidden" id="sideBarDesignType" value="{{ cartDetail.productAttribute.format.designTypeSideBarCrello }}">
  263.                         {% elseif cartDetail.colorLabTokenProduct and cartDetail.colorLabIdProduct %}
  264.                             <div class="txt_selectca" style="min-height: 43px;">
  265.                                 <a href="#" style="color: #fff;" class="crelloBtn btnMobileImport" >
  266.                                     {{ 'Vous pouvez Ă©diter votre crĂ©ation sur' | trans({}, "productTranslate") }}
  267.                                     <svg viewBox="0 0 201 60" xmlns="http://www.w3.org/2000/svg" class="c-navbar__logo" style=" width: 95px;margin-left: 10px;"><g fill-rule="nonzero" fill="none"><g id="shape" fill-rule="nonzero" fill="none"><path id="shape-1" d="M7.33 24.8A22.05 22.05 0 0 1 28.67 7.9c3.28 0 6.39.75 9.18 2.06a21.35 21.35 0 0 1 7.5 5.71c.69.79.56 2.02-.21 2.68-.78.65-1.97.57-2.67-.2a17.92 17.92 0 0 0-13.8-6.41c-8.86 0-16.43 6.4-17.9 15.13-.08.97-.9 1.75-1.88 1.75l-6.96-.04h-.21a1.92 1.92 0 0 1-1.68-2.1 29.2 29.2 0 0 1 9.59-18.2 28.7 28.7 0 0 1 40.87 2.67c.7.78.62 1.97-.16 2.67-.82.7-2 .62-2.7-.17a25.24 25.24 0 0 0-8.52-6.4 24.94 24.94 0 0 0-10.37-2.23A25.04 25.04 0 0 0 4.18 24.8h3.15Z" fill="#E65545" class="shape"></path><path id="shape-2" d="M40.02 20.07c.7.78.61 1.98-.17 2.67-.78.7-1.96.62-2.66-.16a11.4 11.4 0 0 0-3.8-2.88 11.3 11.3 0 0 0-15.53 7.48c-.3 1-1.32 1.6-2.34 1.36a1.95 1.95 0 0 1-1.35-2.3 14.94 14.94 0 0 1 14.58-11.3 15 15 0 0 1 6.19 1.31 15.2 15.2 0 0 1 5.08 3.82Z" fill="#363D40" class="shape"></path><path id="shape-3" d="M42.4 41.78a1.9 1.9 0 1 1 2.86 2.5 21.62 21.62 0 0 1-7.5 5.64 21.84 21.84 0 0 1-23.26-3.17A22.1 22.1 0 0 1 6.96 33.2c0-1.03.86-1.9 1.93-1.9h6.96c.33 0 .66.09.9.25.53.2.94.66 1.1 1.28a11.3 11.3 0 0 0 3.98 6.12 11.26 11.26 0 0 0 6.92 2.34c1.64 0 3.2-.37 4.63-.98a11.3 11.3 0 0 0 3.81-2.84 1.89 1.89 0 0 1 2.83 2.5 14.97 14.97 0 0 1-20.48 1.98 15.27 15.27 0 0 1-4.96-6.82l-3.32-.04c1.01 3.4 3 6.45 5.7 8.75A18.1 18.1 0 0 0 36.2 46.5c2.38-1.1 4.5-2.71 6.18-4.72h.02Z" fill="#2A4B8C" class="shape"></path><path id="shape-4" d="M47.63 46.59c.7-.78 1.89-.87 2.7-.2.79.69.87 1.88.17 2.66a28.8 28.8 0 0 1-40.92 2.67 29.05 29.05 0 0 1-9.54-18.2 1.9 1.9 0 1 1 3.77-.46 25.25 25.25 0 0 0 8.27 15.83 25.18 25.18 0 0 0 16.67 6.33c7.25 0 14.14-3.15 18.88-8.63Z" fill="#1196D9" class="shape"></path></g><path id="text" d="M144.54 30.97c.58-2.55 3.07-3.58 5.5-3.62 2.16-.08 2.49-2.47 1.01-3.2-.7-.34-1.96-.21-2.62-.09-1.43.2-2.74.74-3.85 1.69l-.12.08c-.02-.5-.22-1-.57-1.36-.66-.66-1.64-.57-2.3-.04-.45.37-.65.9-.65 1.48v15c0 .5.12 1.03.45 1.4.7.74 2.21.7 2.78-.12a2 2 0 0 0 .37-1.28v-9.94Zm-29.08 9.98V18.4c0-.2-.04-.41-.08-.58a1.75 1.75 0 0 0-2.87-.9 1.9 1.9 0 0 0-.57.9c-.04.17-.04.37-.04.58v22.56c-.06.58.17 1.15.61 1.52a1.8 1.8 0 0 0 2.34 0c.28-.24.45-.57.53-.94.04-.16.08-.37.08-.58v-.01ZM80.07 16.7c-1.97-.5-4-.62-6.02-.37-5.36.8-9.7 4.76-10.97 10.03-1.52 6.33 1.39 12.74 7.29 15.46a15.07 15.07 0 0 0 9.87.74 13.8 13.8 0 0 0 5.6-3.04c.17-.17.3-.3.38-.42.49-.7.45-1.52-.13-2.1a1.76 1.76 0 0 0-1.72-.53c-.4.09-.73.3-1.02.54a9.7 9.7 0 0 1-3.64 2.18c-2.46.78-5.41.7-7.79-.41-4.67-2.18-6.67-7.65-5.03-12.62a9.62 9.62 0 0 1 7.2-6.42c2.01-.37 4.3-.16 6.19.66.99.45 1.9 1.08 2.66 1.85l.45.33c.2.12.37.16.53.2.62.17 1.27 0 1.68-.4.45-.42.62-1.03.45-1.6 0-.17-.08-.3-.16-.46-.25-.37-.61-.7-.9-.99a12.99 12.99 0 0 0-4.92-2.63Zm22.94 11.84c1.8 1.64 2.34 3.54 2.09 5.92a6.25 6.25 0 0 1-1.43 3.33 6.04 6.04 0 0 1-8.6.45c-1.48-1.44-1.97-3.08-1.93-5.1a6 6 0 0 1 9.87-4.6Zm-12.2 9.9a9.95 9.95 0 0 0 4.13 3.79 10.56 10.56 0 0 0 8.85-.2 9.75 9.75 0 0 0 3.23-2.84 9.38 9.38 0 0 0 1.77-4.73 9.4 9.4 0 0 0-1.8-6.74c-3.65-4.6-10-5.35-14.38-1.44a9.5 9.5 0 0 0-3.07 6.2 9.76 9.76 0 0 0 1.26 5.97l.01-.01Zm94.4-12.49v-7.6c0-.58-.16-1.07-.57-1.44a1.85 1.85 0 0 0-2.37 0c-.41.37-.62.86-.62 1.44V40.9c0 .2.04.41.08.58.2.86.86 1.23 1.68 1.31.82-.08 1.44-.45 1.68-1.31.04-.25.08-.45.08-.7a8.59 8.59 0 0 0 3.98 2.06c2.41.4 4.5.12 6.63-1.16a9.94 9.94 0 0 0 2.79-2.91c1.82-3.2 1.9-7.09.24-10.36-1.3-2.22-2.95-3.7-5.49-4.4a9.07 9.07 0 0 0-6.22.62c-.74.4-1.23.78-1.89 1.31v.01Zm8.32 1.81c2.05 1.27 2.82 3.33 2.82 5.63-.04 1.81-.36 3.17-1.51 4.56-1 1.2-2.5 1.85-4.06 1.77a5.27 5.27 0 0 1-5.16-3.5 8.65 8.65 0 0 1-.16-5.09 5.8 5.8 0 0 1 2.05-3.08 5.78 5.78 0 0 1 6.02-.29ZM174 28.91a2 2 0 0 0-.38-.53c-1.76-1.77-5.49-1.4-7.25.04-.73.7-1.64.94-2.45.24-.45-.4-.66-.9-.54-1.52.2-1.19 1.8-2.1 2.83-2.55 3.15-1.35 7.45-1.06 9.83 1.11a7.36 7.36 0 0 1 2.05 4.32c.08.53.12 1.15.12 1.73v9.12c0 .2-.04.41-.08.58-.33 1.35-1.93 1.85-2.91.86-.2-.16-.33-.41-.45-.66a2.07 2.07 0 0 1-.08-.49 8.76 8.76 0 0 1-6.76 1.8 6.4 6.4 0 0 1-1.27-.32 5.09 5.09 0 0 1-2.05-1.2 5.74 5.74 0 0 1-1.64-6.08c1.15-3.37 4.3-4.4 7.5-4.23 1.51.04 2.99.33 4.1.5 0-.91-.09-1.9-.58-2.72h.01Zm.56 8.22v-2.3c-.86-.2-2-.37-3.19-.45-1.76-.08-4.59.04-5.04 2.14a2.65 2.65 0 0 0 1.85 3.04c2.13.7 5.12-.58 6.38-2.43Zm-42.51-8.59c1.76 1.64 2.3 3.54 2.05 5.96a6.13 6.13 0 0 1-1.44 3.29 6.04 6.04 0 0 1-8.6.45 6.52 6.52 0 0 1-1.88-5.1 6.3 6.3 0 0 1 2.09-4.6 6.05 6.05 0 0 1 7.78 0Zm-12.25 9.9a9.44 9.44 0 0 0 4.14 3.79c2.9 1.23 6.02 1.2 8.85-.2a9.58 9.58 0 0 0 5.04-7.56 9.58 9.58 0 0 0-1.85-6.71c-3.6-4.6-9.95-5.34-14.37-1.44a9.41 9.41 0 0 0-3.08 6.17c-.16 2.18.2 4.07 1.27 5.96v-.01Zm39.36 2.47V18.35c0-.25-.04-.41-.08-.62a1.48 1.48 0 0 0-.53-.86c-.66-.6-1.67-.6-2.33 0-.3.24-.5.53-.58.9-.04.17-.08.37-.08.58V40.9c0 .2.04.41.08.58.08.37.25.7.53.94.66.58 1.72.58 2.38 0 .25-.24.45-.57.53-.94.04-.17.08-.37.08-.58v.01Z" fill="#363D40"></path></g></svg>
  268.                                 </a>
  269.                             </div>
  270.                             <input type="hidden" id="designUrl" value="">
  271.                             <input type="hidden" id="designColorLabTokenProduct" value="{{ cartDetail.colorLabTokenProduct }}">
  272.                             <input type="hidden" id="designColorLabIdProduct" value="{{ cartDetail.colorLabIdProduct }}">
  273.                         {% else %}
  274.                             <div class="txt_selectca" style=""> <a href="#" style="" class="crelloBtnImport crelloBtnImportNow btnMobileImport" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  275.                             <input type="checkbox" name="isFontBlanc" class="hide" checked="checked" value="{{ cartDetail.mauvaisFormat }}" id="isFontBlanc">
  276.                             <input type="file" multiple id="fileDesign" name="fileDesign[]" style="display: none;"  accept="image/png, image/jpeg, image/jpg, application/pdf" >
  277.                             <input type="hidden" id="fileDesignUrl" value="{{ cartDetail.filePapier }}">
  278.                             <input type="hidden" id="fileDesignFirstImage" value="{{ cartDetail.filePapierFirstImage }}">
  279.                         {% endif %}
  280.                     {% endif %}
  281.                 {% endif %}
  282.             </div>
  284.             <div class="mt-3 text-center" {% if cartDetail.id is defined %}id="addToCartCrelloCartDetailMobile"{% endif %}>
  285.                 <a href="#" class="btnNoir pl-5 pr-5" id="addToCartCrello" style="{% if cartDetail.id is not defined %}display:none;{% endif %}">{{ 'Continuer' | trans({}, "productTranslate") }}</a>
  286.             </div>
  287.             <div id="blockMarginBottom"></div>
  288.             <div id="blockDetailMobile">
  290.             </div>
  291.         </div>
  292.         <div class="modal mdl1 verificationModalMobile"  id="verificationModal" tabindex="-1" role="dialog">
  293.             <div class="modal-dialog" style="margin-top: 6vw;" role="document">
  294.                 <div class="modal-content">
  295.                     <div class="modal-body">
  296.                         <div class="row">
  297.                             <div class="col-md-8 pb-3">
  298.                                 <img src="{{ asset('/images/carte_fond_perdu.png') }}">
  299.                             </div>
  300.                             <div class="col-md-4">
  301.                                 <h4 style="font-weight: 700;">{{ 'Fond perdu' | trans({}, "productTranslate") }}</h4>
  302.                                 <p style="text-align: left;font-size: 14px;color: #6a6666; line-height: 20px;">{{ "Avec le fond perdu, vous ĂȘtes certain de ne pas retrouver de blancs sur votre design imprimĂ©. Nous imprimons alors jusqu\'au bord du papier ou de la carte." | trans({}, "productTranslate") }}</p>
  303.                                 <h4 style="font-weight: 700;">{{ 'RĂ©gler le fond perdu' | trans({}, "productTranslate") }}</h4>
  304.                                 <ol style="text-align: left;font-size: 14px;color: #6a6666;padding-left: 10px;">
  305.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'Etendez votre arriĂšre-plan au-delĂ  des lignes du fond perdu.' | trans({}, "productTranslate") }}</li>
  306.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'Ne mettez aucun texte ou graphique important en dehors des lignes du fond perdu.' | trans({}, "productTranslate") }}</li>
  307.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'VĂ©rifiez chaque page que vous imprimez.' | trans({}, "productTranslate") }}</li>
  308.                                 </ol>
  309.                             </div>
  311.                         </div>
  312.                     </div>
  313.                     <div class="modal-footer" style="display: block">
  314.                         <div class="btnVerificationModalMobile" style="">
  315.                             <a class="btnVerificationModalMobile2" data-dismiss="modal" aria-label="Close" href="#" style="">{{ "J\'ai compris" | trans({}, "productTranslate") }}</a>
  316.                             <a class="btnVerificationModalMobile1" style="" href="https://blog.copees.com/2021/09/28/les-traits-de-coupe-avec-fonds-perdus-quest-ce-que-cest/" target="_blank">{{ 'Nos conseils pour les fonds perdus' | trans({}, "productTranslate") }}</a>
  317.                         </div>
  318.                     </div>
  319.                 </div>
  320.             </div>
  321.         </div>
  322.     {% else %}
  323.         <style>
  324.             header,.darkHeader {
  325.                 background-color: #fff!important;
  326.                 border-bottom: 1px solid #D9D9D9;
  327.                 position: relative;
  328.             }
  329.             input#searchProductMenu {
  330.                 width: 600px !important;
  331.                 max-width: 600px;
  332.                 border: 1px solid #D9D9D9;
  333.                 border-radius: 10px;
  334.             }
  335.         </style>
  336.         {#desctop#}
  337.         <div class="productIndexOptionNewDescktop" >
  338.             <div class="row" id="productIndexOptionNew">
  339.                 <div class="col-12" >
  340.                     <p class="pLink">
  341.                         <span><a class="spanLink" href="{{ path('accueil') }}">Copees</a></span>
  342.                         <span>
  343.                     <svg xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8" fill="none">
  344.                         <path d="M0.726562 7.06L3.7799 4L0.726562 0.94L1.66656 0L5.66656 4L1.66656 8L0.726562 7.06Z" fill="#323232"/>
  345.                     </svg>
  346.                 </span>
  347.                         <span ><a class="spanLink" href="{{ path('besoin_produits') }}">Communiquer</a></span>
  348.                         <span>
  349.                     <svg xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8" fill="none">
  350.                         <path d="M0.726562 7.06L3.7799 4L0.726562 0.94L1.66656 0L5.66656 4L1.66656 8L0.726562 7.06Z" fill="#323232"/>
  351.                     </svg>
  352.                 </span>
  353.                         <span class="spanLink2">{{ product.getTypeProductName() }}</span>
  354.                     </p>
  355.                 </div>
  356.                 <div class="leftBlock" >
  357.                     <div class="bx_select row_select_ca">
  358.                         <div class="d-flex selectProductNew">
  359.                             <div class="f_family">
  360.                                 <a aria-controls="select_row_ca_add" aria-expanded="false" role="button" href="#select_row_ca_add" data-toggle="collapse" class="btn btn-primary inputSelectProduct collapsed">
  361.                            <span style="padding:0px;display: inline;font-size: 18px;font-weight:400;" id="titreProductSpan1">
  362.                                {% if cartDetail  %}
  363.                                    {% if cartDetail.product.isColorLab %}
  364.                                    {% else %}{{ 'Impression' | trans({}, "productTranslate") }}
  365.                                    {% endif %}
  366.                                {% else %}
  367.                                    {% if app.request.get('product') %}
  368.                                        {% set productById = getProductById(app.request.get('product')) %}
  369.                                        {% if productById  and productById.isColorLab %}
  370.                                        {% else %}{{ 'Impression' | trans({}, "productTranslate") }}
  371.                                        {% endif%}
  372.                                    {% endif %}
  373.                                {% endif %}
  374.                            </span>
  375.                                     <span style="padding:0px;display: inline;font-size: 18px;font-weight:400;" id="titreProduct">{% if cartDetail  %}{{ cartDetail.product.getTypeProductName() | trans({}, "productTranslate") }} {% else %}{% if app.request.get('product') %}{{ getNameProduct(app.request.get('product')) | trans({}, "productTranslate") }}{% endif %}{% endif %}</span>
  376.                                 </a>
  377.                                 <div class="collapse" id="select_row_ca_add" style="">
  378.                                     <div class="row_select_ca02 row">
  379.                                         <div class="col-12 pl-0 pr-0">
  380.                                             <h3>{{ "CrĂ©er & communiquer" | trans({}, "productTranslate") |raw }}</h3>
  381.                                             <div class=" bx_global_radio taille_full" style="max-width: 100%;">
  382.                                                 {% for item in getProductsWithoutPapier() %}
  383.                                                     <div class="taille tailleSelect">
  384.                                                         <input value="{{ item.id }}" data-new-page="1" data-url="{{ path('product_option') }}?product={{ item.id }}" type="radio" name="productOption" class="select_ca_btn01" id="cad{{ item.id }}"{% if cartDetail  and cartDetail.product.id == item.id %} checked="checked{% else %}{% if app.request.get('product') and app.request.get('product') == item.id %} checked="checked{% endif %}{% endif %}">
  385.                                                         <label for="cad{{ item.id }}" class="block taille ">{{ item.titre | trans({}, "productTranslate") }}</label>
  386.                                                     </div>
  387.                                                 {% endfor %}
  388.                                             </div>
  389.                                         </div>
  390.                                     </div>
  391.                                 </div>
  392.                             </div>
  393.                         </div>
  394.                     </div>
  395.                     <div class="col-12 p-0">
  396.                         <p class="lienSavoirPlusP mb-2"><a href="{{ product.lienSavoirPlus }}"  {% if product.lienSavoirPlusIsExtern %} target="_blank"{% endif %}>En savoir plus</a> </p>
  397.                     </div>
  398.                     <div class="row">
  399.                         <div class="col-md-12 imageProduitNewOption"  style="margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew1 }});">
  400.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew1 }};font-size: {{ product.titreBlocOptionProductTailleNew1 }};color: {{ product.titreBlocOptionProductCouleurNew1 }};">{{ product.titreBlocOptionProductNew1 }}</p>
  401.                             <a style="font-family: {{ product.titreBtnBlocOptionProductPoliceNew1 }};font-size: {{ product.titreBtnBlocOptionProductTailleNew1 }};color: {{ product.titreBtnBlocOptionProductCouleurNew1 }}; background:{{ product.titreBtnBlocOptionProductCouleurBackgroundNew1 }};"  href="{{ product.linkBtnBlocOptionProductNew1 }}" {% if product.linkBtnBlocOptionProductNew1IsExtern %} target="_blank"{% endif %}>{{ product.titreBtnBlocOptionProductNew1 }}</a>
  402.                         </div>
  403.                         <div class="col-md-12 imageProduitNewOption"  style="margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew2 }});">
  404.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew2 }};font-size: {{ product.titreBlocOptionProductTailleNew2 }};color: {{ product.titreBlocOptionProductCouleurNew2 }};">{{ product.titreBlocOptionProductNew2 }}</p>
  405.                             <a style="font-family: {{ product.titreBtnBlocOptionProductPoliceNew2 }};font-size: {{ product.titreBtnBlocOptionProductTailleNew2 }};color: {{ product.titreBtnBlocOptionProductCouleurNew2 }};  background:{{ product.titreBtnBlocOptionProductCouleurBackgroundNew2 }};"  href="{{ product.linkBtnBlocOptionProductNew2 }}" {% if product.linkBtnBlocOptionProductNew2IsExtern %} target="_blank"{% endif %}>{{ product.titreBtnBlocOptionProductNew2 }}</a>
  406.                         </div>
  407.                         <div class="col-md-6 imageProduitNewOption"  style="margin-right:12px;margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew3 }});">
  408.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew3 }};font-size: {{ product.titreBlocOptionProductTailleNew3 }};color: {{ product.titreBlocOptionProductCouleurNew3 }};">{{ product.titreBlocOptionProductNew3 }}</p>
  409.                             <a style="font-family: {{ product.titreBtnBlocOptionProductPoliceNew3 }};font-size: {{ product.titreBtnBlocOptionProductTailleNew3 }};color: {{ product.titreBtnBlocOptionProductCouleurNew3 }}; background:{{ product.titreBtnBlocOptionProductCouleurBackgroundNew3 }};" href="{{ product.linkBtnBlocOptionProductNew3 }}" {% if product.linkBtnBlocOptionProductNew3IsExtern %} target="_blank"{% endif %}>{{ product.titreBtnBlocOptionProductNew3 }}</a>
  410.                         </div>
  411.                         <div class="col-md-5 imageProduitNewOption"  style="margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew4 }});">
  412.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew4 }};font-size: {{ product.titreBlocOptionProductTailleNew4 }};color: {{ product.titreBlocOptionProductCouleurNew4 }};">{{ product.titreBlocOptionProductNew4 }}</p>
  413.                             <a style="font-family: {{ product.titreBtnBlocOptionProductPoliceNew4 }};font-size: {{ product.titreBtnBlocOptionProductTailleNew4 }};color: {{ product.titreBtnBlocOptionProductCouleurNew4 }}; background:{{ product.titreBtnBlocOptionProductCouleurBackgroundNew4 }};" href="{{ product.linkBtnBlocOptionProductNew4 }}" {% if product.linkBtnBlocOptionProductNew4IsExtern %} target="_blank"{% endif %}>{{ product.titreBtnBlocOptionProductNew4 }}</a>
  414.                         </div>
  415.                     </div>
  416.                     <div id="optionsBloc1">
  418.                     </div>
  419.                     <div class="row">
  420.                         <div class="col-md-12 besoinProduitNewOption"  style="">
  421.                             <p>Vous ne trouvez pas votre besoin ?</p>
  422.                             <a href="{{ product.lienCDemandeDevis }}" {% if product.lienCDemandeDevisIsExtern %} target="_blank"{% endif %}>Demande de devis</a>
  423.                         </div>
  424.                     </div>
  427.                 </div>
  428.                 <div class=" centerBlock">
  429.                     <div id="optionsBloc2">
  431.                     </div>
  433.                     <div id="quantityBlocNew" class="oghtml6">
  435.                     </div>
  437.                     <div class="row_select_ca1 oghtml5">
  438.                         <div class="Comm_adress">
  439.                             <h3>{{ 'Votre adresse' | trans({}, "productTranslate") }}</h3>
  440.                             <div role="group" class="form-group">
  441.                                 <input id="addresseLiv" name="addresseLiv" type="text" class="form-control adresee-google-map" placeholder=" "
  442.                                         {% if app.session.get('addresseAdresse') %} value="{{ app.session.get('addresseAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','adresse') }} {% endif %} >
  443.                                 <label for="addresseLiv" class="d-block form-control-placeholder"> {{ 'Commencez Ă  saisir la premiĂšre ligne de votre adresse' | trans({}, "productTranslate") }}</label>
  444.                                 <input type="hidden" id="longLiv"  {% if app.session.get('longiAdresse') %} value="{{ app.session.get('longiAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','longi') }}{% endif %} name="longLiv">
  445.                                 <input type="hidden" id="latLiv" {% if app.session.get('latAdresse') %} value="{{ app.session.get('latAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','lat') }}{% endif %} name="latLiv">
  446.                                 <input type="hidden" id="codePostalLiv" {% if app.session.get('postalcodeAdresse') %} value="{{ app.session.get('postalcodeAdresse') }}" {% else %} {{ _self.value(cart,'adresseLivraison','codePostal') }}{% endif %} name="codePostalLiv">
  447.                                 <input type="hidden" id="CountryLiv" value="{% if app.session.get('CountryLiv') %}{{ app.session.get('CountryLiv') }}{% else %}{% if cart.adresseLivraison.country is defined  %}{{ cart.adresseLivraison.country }}{% endif %}{% endif %}" name="CountryLiv">
  448.                                 <input type="hidden" value="{% if app.session.get('CountryCodeLiv') %}{{ app.session.get('CountryCodeLiv') }}{% else %}{% if cart.adresseLivraison.countryCode is defined %}{{ cart.adresseLivraison.countryCode }}{% endif %}{% endif%}" name="CountryCodeLiv" id="CountryCodeLiv">
  449.                                 <input type="hidden" id="cityLiv" {% if app.session.get('cityAdresse') %} value="{{ app.session.get('cityAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','city') }}{% endif %} name="cityLiv">
  450.                             </div>
  451.                         </div>
  452.                         <div id="modeLivraison">
  454.                         </div>
  455.                         {% if cartDetail.id is not defined  %}
  456.                             <div id="crelloButtons" class="crelloButtonsBlock crelloButtonsNew">
  458.                             </div>
  459.                         {% endif %}
  461.                         {% if cartDetail  %}
  462.                             {% include 'front/product-option/productPreviewModal.html.twig'  with {'isMobileInterface':isMobileInterface } %}
  463.                             {% if cartDetail.product.typeProduct  in [ constant('App\\Entity\\Product::PHOTOS')]%}
  464.                                 <div class="txt_selectca mb-2" style=""> <a href="#" style="" class="crelloBtnImportPhotos crelloBtnImportNow" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  465.                             {% else %}
  466.                                 {% if cartDetail.templateIdCrello  %}
  467.                                     <div class="txt_selectca mb-2" style="min-height: 43px;"> <a href="#" style="color: #fff;" class="crelloBtn" >{{ 'Vous pouvez Ă©diter votre crĂ©ation sur' | trans({}, "productTranslate") }} <img  width="130px"  src="{{ asset('/images/ininfoselectF.svg') }}" ></a></div>
  468.                                     <input type="hidden" id="designUrl" value="">
  469.                                     <input type="hidden" id="designType" value="{{ cartDetail.productAttribute.format.designTypeCrello }}">
  470.                                     <input type="hidden" id="customDesignType" value="{{ cartDetail.productAttribute.format.designTypeCustomCrello }}">
  471.                                     <input type="hidden" id="sideBarDesignType" value="{{ cartDetail.productAttribute.format.designTypeSideBarCrello }}">
  472.                                 {% elseif cartDetail.colorLabTokenProduct and cartDetail.colorLabIdProduct %}
  473.                                     <div class="txt_selectca" style="min-height: 43px;">
  474.                                         <a href="#" style="color: #fff;" class="crelloBtn" >
  475.                                             {{ 'Vous pouvez Ă©diter votre crĂ©ation sur' | trans({}, "productTranslate") }}
  476.                                             <svg viewBox="0 0 201 60" xmlns="http://www.w3.org/2000/svg" class="c-navbar__logo" style=" width: 95px;margin-left: 10px;"><g fill-rule="nonzero" fill="none"><g id="shape" fill-rule="nonzero" fill="none"><path id="shape-1" d="M7.33 24.8A22.05 22.05 0 0 1 28.67 7.9c3.28 0 6.39.75 9.18 2.06a21.35 21.35 0 0 1 7.5 5.71c.69.79.56 2.02-.21 2.68-.78.65-1.97.57-2.67-.2a17.92 17.92 0 0 0-13.8-6.41c-8.86 0-16.43 6.4-17.9 15.13-.08.97-.9 1.75-1.88 1.75l-6.96-.04h-.21a1.92 1.92 0 0 1-1.68-2.1 29.2 29.2 0 0 1 9.59-18.2 28.7 28.7 0 0 1 40.87 2.67c.7.78.62 1.97-.16 2.67-.82.7-2 .62-2.7-.17a25.24 25.24 0 0 0-8.52-6.4 24.94 24.94 0 0 0-10.37-2.23A25.04 25.04 0 0 0 4.18 24.8h3.15Z" fill="#E65545" class="shape"></path><path id="shape-2" d="M40.02 20.07c.7.78.61 1.98-.17 2.67-.78.7-1.96.62-2.66-.16a11.4 11.4 0 0 0-3.8-2.88 11.3 11.3 0 0 0-15.53 7.48c-.3 1-1.32 1.6-2.34 1.36a1.95 1.95 0 0 1-1.35-2.3 14.94 14.94 0 0 1 14.58-11.3 15 15 0 0 1 6.19 1.31 15.2 15.2 0 0 1 5.08 3.82Z" fill="#363D40" class="shape"></path><path id="shape-3" d="M42.4 41.78a1.9 1.9 0 1 1 2.86 2.5 21.62 21.62 0 0 1-7.5 5.64 21.84 21.84 0 0 1-23.26-3.17A22.1 22.1 0 0 1 6.96 33.2c0-1.03.86-1.9 1.93-1.9h6.96c.33 0 .66.09.9.25.53.2.94.66 1.1 1.28a11.3 11.3 0 0 0 3.98 6.12 11.26 11.26 0 0 0 6.92 2.34c1.64 0 3.2-.37 4.63-.98a11.3 11.3 0 0 0 3.81-2.84 1.89 1.89 0 0 1 2.83 2.5 14.97 14.97 0 0 1-20.48 1.98 15.27 15.27 0 0 1-4.96-6.82l-3.32-.04c1.01 3.4 3 6.45 5.7 8.75A18.1 18.1 0 0 0 36.2 46.5c2.38-1.1 4.5-2.71 6.18-4.72h.02Z" fill="#2A4B8C" class="shape"></path><path id="shape-4" d="M47.63 46.59c.7-.78 1.89-.87 2.7-.2.79.69.87 1.88.17 2.66a28.8 28.8 0 0 1-40.92 2.67 29.05 29.05 0 0 1-9.54-18.2 1.9 1.9 0 1 1 3.77-.46 25.25 25.25 0 0 0 8.27 15.83 25.18 25.18 0 0 0 16.67 6.33c7.25 0 14.14-3.15 18.88-8.63Z" fill="#1196D9" class="shape"></path></g><path id="text" d="M144.54 30.97c.58-2.55 3.07-3.58 5.5-3.62 2.16-.08 2.49-2.47 1.01-3.2-.7-.34-1.96-.21-2.62-.09-1.43.2-2.74.74-3.85 1.69l-.12.08c-.02-.5-.22-1-.57-1.36-.66-.66-1.64-.57-2.3-.04-.45.37-.65.9-.65 1.48v15c0 .5.12 1.03.45 1.4.7.74 2.21.7 2.78-.12a2 2 0 0 0 .37-1.28v-9.94Zm-29.08 9.98V18.4c0-.2-.04-.41-.08-.58a1.75 1.75 0 0 0-2.87-.9 1.9 1.9 0 0 0-.57.9c-.04.17-.04.37-.04.58v22.56c-.06.58.17 1.15.61 1.52a1.8 1.8 0 0 0 2.34 0c.28-.24.45-.57.53-.94.04-.16.08-.37.08-.58v-.01ZM80.07 16.7c-1.97-.5-4-.62-6.02-.37-5.36.8-9.7 4.76-10.97 10.03-1.52 6.33 1.39 12.74 7.29 15.46a15.07 15.07 0 0 0 9.87.74 13.8 13.8 0 0 0 5.6-3.04c.17-.17.3-.3.38-.42.49-.7.45-1.52-.13-2.1a1.76 1.76 0 0 0-1.72-.53c-.4.09-.73.3-1.02.54a9.7 9.7 0 0 1-3.64 2.18c-2.46.78-5.41.7-7.79-.41-4.67-2.18-6.67-7.65-5.03-12.62a9.62 9.62 0 0 1 7.2-6.42c2.01-.37 4.3-.16 6.19.66.99.45 1.9 1.08 2.66 1.85l.45.33c.2.12.37.16.53.2.62.17 1.27 0 1.68-.4.45-.42.62-1.03.45-1.6 0-.17-.08-.3-.16-.46-.25-.37-.61-.7-.9-.99a12.99 12.99 0 0 0-4.92-2.63Zm22.94 11.84c1.8 1.64 2.34 3.54 2.09 5.92a6.25 6.25 0 0 1-1.43 3.33 6.04 6.04 0 0 1-8.6.45c-1.48-1.44-1.97-3.08-1.93-5.1a6 6 0 0 1 9.87-4.6Zm-12.2 9.9a9.95 9.95 0 0 0 4.13 3.79 10.56 10.56 0 0 0 8.85-.2 9.75 9.75 0 0 0 3.23-2.84 9.38 9.38 0 0 0 1.77-4.73 9.4 9.4 0 0 0-1.8-6.74c-3.65-4.6-10-5.35-14.38-1.44a9.5 9.5 0 0 0-3.07 6.2 9.76 9.76 0 0 0 1.26 5.97l.01-.01Zm94.4-12.49v-7.6c0-.58-.16-1.07-.57-1.44a1.85 1.85 0 0 0-2.37 0c-.41.37-.62.86-.62 1.44V40.9c0 .2.04.41.08.58.2.86.86 1.23 1.68 1.31.82-.08 1.44-.45 1.68-1.31.04-.25.08-.45.08-.7a8.59 8.59 0 0 0 3.98 2.06c2.41.4 4.5.12 6.63-1.16a9.94 9.94 0 0 0 2.79-2.91c1.82-3.2 1.9-7.09.24-10.36-1.3-2.22-2.95-3.7-5.49-4.4a9.07 9.07 0 0 0-6.22.62c-.74.4-1.23.78-1.89 1.31v.01Zm8.32 1.81c2.05 1.27 2.82 3.33 2.82 5.63-.04 1.81-.36 3.17-1.51 4.56-1 1.2-2.5 1.85-4.06 1.77a5.27 5.27 0 0 1-5.16-3.5 8.65 8.65 0 0 1-.16-5.09 5.8 5.8 0 0 1 2.05-3.08 5.78 5.78 0 0 1 6.02-.29ZM174 28.91a2 2 0 0 0-.38-.53c-1.76-1.77-5.49-1.4-7.25.04-.73.7-1.64.94-2.45.24-.45-.4-.66-.9-.54-1.52.2-1.19 1.8-2.1 2.83-2.55 3.15-1.35 7.45-1.06 9.83 1.11a7.36 7.36 0 0 1 2.05 4.32c.08.53.12 1.15.12 1.73v9.12c0 .2-.04.41-.08.58-.33 1.35-1.93 1.85-2.91.86-.2-.16-.33-.41-.45-.66a2.07 2.07 0 0 1-.08-.49 8.76 8.76 0 0 1-6.76 1.8 6.4 6.4 0 0 1-1.27-.32 5.09 5.09 0 0 1-2.05-1.2 5.74 5.74 0 0 1-1.64-6.08c1.15-3.37 4.3-4.4 7.5-4.23 1.51.04 2.99.33 4.1.5 0-.91-.09-1.9-.58-2.72h.01Zm.56 8.22v-2.3c-.86-.2-2-.37-3.19-.45-1.76-.08-4.59.04-5.04 2.14a2.65 2.65 0 0 0 1.85 3.04c2.13.7 5.12-.58 6.38-2.43Zm-42.51-8.59c1.76 1.64 2.3 3.54 2.05 5.96a6.13 6.13 0 0 1-1.44 3.29 6.04 6.04 0 0 1-8.6.45 6.52 6.52 0 0 1-1.88-5.1 6.3 6.3 0 0 1 2.09-4.6 6.05 6.05 0 0 1 7.78 0Zm-12.25 9.9a9.44 9.44 0 0 0 4.14 3.79c2.9 1.23 6.02 1.2 8.85-.2a9.58 9.58 0 0 0 5.04-7.56 9.58 9.58 0 0 0-1.85-6.71c-3.6-4.6-9.95-5.34-14.37-1.44a9.41 9.41 0 0 0-3.08 6.17c-.16 2.18.2 4.07 1.27 5.96v-.01Zm39.36 2.47V18.35c0-.25-.04-.41-.08-.62a1.48 1.48 0 0 0-.53-.86c-.66-.6-1.67-.6-2.33 0-.3.24-.5.53-.58.9-.04.17-.08.37-.08.58V40.9c0 .2.04.41.08.58.08.37.25.7.53.94.66.58 1.72.58 2.38 0 .25-.24.45-.57.53-.94.04-.17.08-.37.08-.58v.01Z" fill="#363D40"></path></g></svg>
  477.                                         </a>
  478.                                     </div>
  479.                                     <input type="hidden" id="designUrl" value="">
  480.                                     <input type="hidden" id="designColorLabTokenProduct" value="{{ cartDetail.colorLabTokenProduct }}">
  481.                                     <input type="hidden" id="designColorLabIdProduct" value="{{ cartDetail.colorLabIdProduct }}">
  482.                                 {% else %}
  483.                                     <div class="txt_selectca" style=""> <a href="#" style="" class="crelloBtnImport crelloBtnImportNow" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  484.                                     <input type="checkbox" name="isFontBlanc" class="hide" checked="checked" value="{{ cartDetail.mauvaisFormat }}" id="isFontBlanc">
  485.                                     <input type="file" multiple id="fileDesign" name="fileDesign[]" style="display: none;"  accept="image/png, image/jpeg, image/jpg, application/pdf" >
  486.                                     <input type="hidden" id="fileDesignUrl" value="{{ cartDetail.filePapier }}">
  487.                                     <input type="hidden" id="fileDesignFirstImage" value="{{ cartDetail.filePapierFirstImage }}">
  488.                                 {% endif %}
  489.                             {% endif %}
  490.                         {% endif %}
  491.                     </div>
  492.                 </div>
  493.                 <div class=" rightBlock">
  494.                     <div id="blockPanierNew">
  496.                     </div>
  497.                     <div class="nousContacter" style="margin-bottom: 34px;">
  498.                         <div id="nosLovesPrinter">
  500.                         </div>
  501.                         <h3>Nous contacter</h3>
  502.                         <div class="nousContacterContent">
  503.                             <a href="#"  data-toggle="modal" data-target="#contactModal" >
  504.                         <span>
  505.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  506.                                 <g clip-path="url(#clip0_64_809)">
  507.                                 <path d="M6.54 5C6.6 5.89 6.75 6.76 6.99 7.59L5.79 8.79C5.38 7.59 5.12 6.32 5.03 5H6.54ZM16.4 17.02C17.25 17.26 18.12 17.41 19 17.47V18.96C17.68 18.87 16.41 18.61 15.2 18.21L16.4 17.02ZM7.5 3H4C3.45 3 3 3.45 3 4C3 13.39 10.61 21 20 21C20.55 21 21 20.55 21 20V16.51C21 15.96 20.55 15.51 20 15.51C18.76 15.51 17.55 15.31 16.43 14.94C16.33 14.9 16.22 14.89 16.12 14.89C15.86 14.89 15.61 14.99 15.41 15.18L13.21 17.38C10.38 15.93 8.06 13.62 6.62 10.79L8.82 8.59C9.1 8.31 9.18 7.92 9.07 7.57C8.7 6.45 8.5 5.25 8.5 4C8.5 3.45 8.05 3 7.5 3Z" fill="#303030"/>
  508.                                 </g>
  509.                                 <defs>
  510.                                 <clipPath id="clip0_64_809">
  511.                                 <rect width="24" height="24" fill="white"/>
  512.                                 </clipPath>
  513.                                 </defs>
  514.                             </svg>
  515.                         </span>
  516.                                 <span>Par tĂ©lĂ©phone</span>
  517.                             </a>
  518.                             <a href="#" id="contactChat">
  519.                         <span>
  520.                             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  521.                                <path d="M13 2V9H3.17L2 10.17V2H13ZM14 0H1C0.45 0 0 0.45 0 1V15L4 11H14C14.55 11 15 10.55 15 10V1C15 0.45 14.55 0 14 0ZM19 4H17V13H4V15C4 15.55 4.45 16 5 16H16L20 20V5C20 4.45 19.55 4 19 4Z" fill="#303030"/>
  522.                             </svg>
  523.                         </span>
  524.                                 <span>Via notre chat</span>
  525.                             </a>
  526.                             <a href="{{ product.lienCalandlyOptionProduct }}"  {% if product.lienCalandlyOptionProductIsExtern %} target="_blank"{% endif %} >
  527.                                 <span>
  528.                                     <svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" viewBox="0 0 25 24" fill="none">
  529.                                         <g clip-path="url(#clip0_64_815)">
  530.                                         <path d="M21.5 12.22C21.5 6.73 17.24 3 12.5 3C7.81 3 3.5 6.65 3.5 12.28C2.9 12.62 2.5 13.26 2.5 14V16C2.5 17.1 3.4 18 4.5 18H5.5V11.9C5.5 8.03 8.63 4.9 12.5 4.9C16.37 4.9 19.5 8.03 19.5 11.9V19H11.5V21H19.5C20.6 21 21.5 20.1 21.5 19V17.78C22.09 17.47 22.5 16.86 22.5 16.14V13.84C22.5 13.14 22.09 12.53 21.5 12.22Z" fill="#303030"/>
  531.                                         <path d="M9.5 14C10.0523 14 10.5 13.5523 10.5 13C10.5 12.4477 10.0523 12 9.5 12C8.94772 12 8.5 12.4477 8.5 13C8.5 13.5523 8.94772 14 9.5 14Z" fill="#303030"/>
  532.                                         <path d="M15.5 14C16.0523 14 16.5 13.5523 16.5 13C16.5 12.4477 16.0523 12 15.5 12C14.9477 12 14.5 12.4477 14.5 13C14.5 13.5523 14.9477 14 15.5 14Z" fill="#303030"/>
  533.                                         <path d="M18.5 11.03C18.02 8.18 15.54 6 12.55 6C9.51997 6 6.25997 8.51 6.51997 12.45C8.98997 11.44 10.85 9.24 11.38 6.56C12.69 9.19 15.38 11 18.5 11.03Z" fill="#303030"/>
  534.                                         </g>
  535.                                         <defs>
  536.                                         <clipPath id="clip0_64_815">
  537.                                         <rect width="24" height="24" fill="white" transform="translate(0.5)"/>
  538.                                         </clipPath>
  539.                                         </defs>
  540.                                     </svg>
  541.                                 </span>
  542.                                 <span>Prendre RDV avec un conseiller</span>
  543.                             </a>
  544.                         </div>
  545.                     </div>
  546.                     {#<div class="nosTips">#}
  547.                         {#<h3>Nos tips</h3>#}
  548.                         {#<div class="nosTipsContent">#}
  549.                             {#{% if product.tipsProduct|length > 0 %}#}
  550.                                 {#{% for item in product.tipsProduct %}#}
  551.                                     {#<div class="nosTipsItem">#}
  552.                                         {#<h4 class="nosTipsItemTitre">#}
  553.                                             {#{{ item.titre }}#}
  554.                                             {#<a href="#" class="nosTipsItemA">#}
  555.                                                 {#<svg class="vectorPlus activeVector" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">#}
  556.                                                     {#<path d="M11.25 6.75H6.75V11.25H5.25V6.75H0.75V5.25H5.25V0.75H6.75V5.25H11.25V6.75Z" fill="#323232"/>#}
  557.                                                 {#</svg>#}
  558.                                                 {#<svg class="vectorMoins" style="margin-top: 5px;" xmlns="http://www.w3.org/2000/svg" width="12" height="2" viewBox="0 0 12 2" fill="none">#}
  559.                                                     {#<path d="M11.25 1.75H6.75H5.25H0.75V0.25H5.25H6.75H11.25V1.75Z" fill="#323232"/>#}
  560.                                                 {#</svg>#}
  561.                                             {#</a>#}
  562.                                         {#</h4>#}
  563.                                         {#<div  class="nosTipsItemDescription" style="display: none;">#}
  564.                                             {#{{ item.description|raw }}#}
  565.                                         {#</div>#}
  566.                                     {#</div>#}
  567.                                 {#{% endfor %}#}
  568.                             {#{% endif %}#}
  570.                         {#</div>#}
  571.                     {#</div>#}
  572.                 </div>
  573.             </div>
  574.             <div  id="section2OptionNew">
  575.                 <div class="row">
  576.                     <div class="col-md-12">
  577.                         <h2 class="h2productIndexOptionNew">Besoin d'un autre produit ?</h2>
  578.                     </div>
  579.                 </div>
  580.                 <div class="row" style="display: flex;justify-content: center;padding-bottom: 60px;">
  581.                     {% if product.recommendationProduct|length > 0 %}
  582.                         {% for item in  product.recommendationProduct %}
  583.                             <div class="col-6 col-md-3 col-lg-2 col-xl-2">
  584.                                 <div class="divProductImageCommande">
  585.                                     {% if item.titre %} <span>{{ item.titre }}</span>{% endif %}
  586.                                     <a style="position: relative;" class="new_option_product_a_img" href="{{ item.link }}">
  587.                                         <img class="" src="{{ asset('imageSite/'~item.image) }}">
  588.                                     </a>
  589.                                 </div>
  590.                             </div>
  591.                         {% endfor %}
  592.                     {% endif %}
  593.                 </div>
  594.             </div>
  595.             <div  id="section3OptionNew" style="background-image: url(/imageSite/{{ product.imageBloc1OptionProduct }});">
  596.                 <div class="section3OptionNewDiv">
  597.                     <h2 class="h2productIndexOptionNew h2productIndexOptionNewSection3">{{ product.titreBloc1OptionProduct }}</h2>
  598.                     <p>{{ product.descriptionBloc1OptionProduct|raw }}</p>
  599.                     {% if product.titreBtnBloc1OptionProduct %}<a href="{{ product.linkBtnBloc1OptionProduct }}" class="btnOptionNewBloc">{{ product.titreBtnBloc1OptionProduct }}</a>{% endif %}
  600.                 </div>
  601.             </div>
  602.             <div  id="section4OptionNew">
  603.                 <div class="section4OptionNewDiv">
  604.                     <h2 class="h2productIndexOptionNew h2productIndexOptionNewSection4">{{ product.titreBloc2OptionProduct }}</h2>
  605.                     <p>{{ product.descriptionBloc2OptionProduct|raw }}</p>
  606.                     <div class="" style="text-align: center ;text-align: center;margin-top: 45px;">
  607.                         {% if product.titreBtnBloc2OptionProduct %}<a href="{{ product.linkBtnBloc2OptionProduct }}" class="btnOptionNewBloc">{{ product.titreBtnBloc2OptionProduct }}</a>{% endif %}
  608.                     </div>
  609.                 </div>
  610.             </div>
  611.             <div  id="section3OptionNew" style="background-image: url(/imageSite/{{ product.imageBloc3OptionProduct }});">
  612.                 <div class="section3OptionNewDiv">
  613.                     <h2 class="h2productIndexOptionNew h2productIndexOptionNewSection3">{{ product.titreBloc3OptionProduct }}</h2>
  614.                     <p>{{ product.descriptionBloc3OptionProduct|raw }}</p>
  615.                     {% if product.titreBtnBloc3OptionProduct %}<a href="{{ product.linkBtnBloc3OptionProduct }}" class="btnOptionNewBloc">{{ product.titreBtnBloc3OptionProduct }}</a>{% endif %}
  616.                 </div>
  617.             </div>
  618.         </div>
  619.         <div class="modal mdl1"  id="verificationModal" tabindex="-1" role="dialog">
  620.             <div class="modal-dialog" style="margin-top: 6vw;" role="document">
  621.                 <div class="modal-content">
  622.                     <div class="modal-body">
  623.                         <div class="row">
  624.                             <div class="col-md-4">
  625.                                 <h4 style="font-weight: 700;">{{ 'Fond perdu' | trans({}, "productTranslate") }}</h4>
  626.                                 <p style="text-align: left;font-size: 14px;color: #6a6666; line-height: 20px;">{{ "Avec le fond perdu, vous ĂȘtes certain de ne pas retrouver de blancs sur votre design imprimĂ©. Nous imprimons alors jusqu\'au bord du papier ou de la carte." | trans({}, "productTranslate") }}</p>
  627.                                 <h4 style="font-weight: 700;">{{ 'RĂ©gler le fond perdu' | trans({}, "productTranslate") }}</h4>
  628.                                 <ol style="text-align: left;font-size: 14px;color: #6a6666;padding-left: 10px;">
  629.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'Etendez votre arriĂšre-plan au-delĂ  des lignes du fond perdu.' | trans({}, "productTranslate") }}</li>
  630.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'Ne mettez aucun texte ou graphique important en dehors des lignes du fond perdu.' | trans({}, "productTranslate") }}</li>
  631.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'VĂ©rifiez chaque page que vous imprimez.' | trans({}, "productTranslate") }}</li>
  632.                                 </ol>
  633.                             </div>
  634.                             <div class="col-md-8">
  635.                                 <img src="{{ asset('/images/carte_fond_perdu.png') }}">
  636.                             </div>
  637.                         </div>
  638.                     </div>
  639.                     <div class="modal-footer" style="display: block">
  640.                         <div class="mt-4" style="display: flex;justify-content: space-evenly">
  641.                             <a class="close" data-dismiss="modal" aria-label="Close" href="#" style="padding: 10px 60px;color: #000;font-size: 16px;background: #F2F3F5;border-radius: 7px;">{{ "J\'ai compris" | trans({}, "productTranslate") }}</a>
  642.                             <a style="padding: 10px 60px;color: #000;font-size: 16px;background: #c7d0d8;border-radius: 7px;" href="https://blog.copees.com/2021/09/28/les-traits-de-coupe-avec-fonds-perdus-quest-ce-que-cest/" target="_blank">{{ 'Nos conseils pour les fonds perdus' | trans({}, "productTranslate") }}</a>
  643.                         </div>
  644.                     </div>
  645.                 </div>
  646.             </div>
  647.         </div>
  648.         {% include 'front/footer.html.twig' %}
  650.     {% endif %}
  657.     <div class="modal fade" id="exampleModal01" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
  658.          style="display: none;" aria-hidden="true">
  659.         <div class="modal-dialog" role="document" style="margin-top: 4vw;">
  660.             <div class="modal-content nb_des nb_des_extra" style="border-radius: 0;">
  661.                 <div class="modal-header">
  662.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  663.                         <span aria-hidden="true">×</span>
  664.                     </button>
  665.                 </div>
  666.                 <div class="modal-body" id="contentModalAddToCartCrello">
  668.                 </div>
  669.             </div>
  670.         </div>
  671.     </div>
  673.     <div class="modal mdlContact"  id="contactModal" tabindex="-1" role="dialog">
  674.         <div class="modal-dialog" style="margin-top: 6vw;" role="document">
  675.             <div class="modal-content">
  676.                 <div class="modal-header">
  677.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  678.                         <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30" fill="none">
  679.                             <rect width="30" height="30" rx="10" fill="black"/>
  680.                             <path d="M22 9.41L20.59 8L15 13.59L9.41 8L8 9.41L13.59 15L8 20.59L9.41 22L15 16.41L20.59 22L22 20.59L16.41 15L22 9.41Z" fill="white"/>
  681.                         </svg>
  682.                     </button>
  683.                 </div>
  684.                 <div class="contactModalImage"  style="background-image: url(/imageSite/{{ product.imageBlocTelOptionProduct }} );"></div>
  685.                 <div class="modal-body">
  686.                     <div class="contactModalDescription">
  687.                       {{ product.descriptionBlocTelOptionProduct|raw }}
  688.                     </div>
  689.                 </div>
  691.             </div>
  692.         </div>
  693.     </div>
  694.     <div class="modal mdl1"  id="outOfStockModal" tabindex="-1" role="dialog">
  695.         <div class="modal-dialog modal-lg" style="margin-top: 3vw;">
  696.             <div class="modal-content modalProduct modalProductAtributeStock">
  698.             </div>
  699.         </div>
  700.     </div>
  701.     <div class="elfsight-app-eaf5d12e-308e-4116-bee5-690b97eaae1f" data-elfsight-app-lazy></div>
  702.     <style>
  703.         .elfsight-app-eaf5d12e-308e-4116-bee5-690b97eaae1f {
  704.             display: none;
  705.         }
  706.     </style>
  707.     <script src="https://static.elfsight.com/platform/platform.js" async></script>
  708.     <style>
  709.         footer {
  710.             padding-top: 0px;
  711.             margin-top: 0px;
  712.         }
  713.         .taille label {
  714.             padding: 0 12px;
  715.         }
  716.         .bloc_btn_crello {
  717.             margin-top: 40px;
  718.             background-color: #FDF18D;
  719.             color: #000;
  720.             min-height: 50px;
  721.             padding: 15px;
  722.             border-radius: 4px !important;
  723.             font-size: 14px;
  724.         }
  725.         .btnNoir{
  726.             color: #fff;
  727.             background-color: #000;
  728.             display: inline-block;
  729.             font-size: 12px;
  730.             padding: 15px 12px;
  731.             text-align: center;
  732.         }
  733.         .btnBlue{
  734.             color: #fff;
  735.             background-color: #5BAFF5;
  736.             display: inline-block;
  737.             font-size: 12px;
  738.             padding: 15px 12px;
  739.             text-align: center;
  740.         }
  741.         .mdl1 li::marker {
  742.             color: #6a6666;
  743.         }
  744.         .carousel-indicators li {
  745.             display: inline-block;
  746.             width: 10px;
  747.             height: 10px;
  748.             margin: 1px;
  749.             text-indent: -999px;
  750.             cursor: pointer;
  751.             background-color: #fff\9;
  752.             background-color: #fff;
  753.             border: 1px solid #000;
  754.             border-radius: 10px;
  755.         }
  756.         .carousel-indicators .active {
  757.             width: 12px;
  758.             height: 12px;
  759.             margin: 0;
  760.             background-color: #000;
  761.         }
  762.         .menu_left {
  763.             flex: 0 0 34%;
  764.             max-width: 34%;
  765.             position: initial;
  766.             padding-left: 0;
  767.             text-align: left;
  768.         }
  769.         .menu_right {
  770.             flex: 0 0 66%;
  771.             max-width: 66%;
  772.             padding-right: 40px !important;
  773.         }
  774.         .tooltip-inner h2 {
  775.             font-family: AktivGrotesk-Medium;
  776.             font-size: 16px;
  777.             font-weight: 400;
  778.             line-height: 18.91px;
  779.             text-align: center;
  780.             margin-top: 8px;
  781.             border-bottom: 1px solid #fff;
  782.             margin-bottom: 14px;
  783.         }
  784.         .tooltip-inner{
  785.             background-color: #5268ff!important;
  786.             color: #fff!important;
  787.             box-shadow: 4px 4px 10px 0px #00000040!important;
  788.             border-radius: 10px!important;
  789.             max-width:400px!important
  790.         }
  791.         .tooltip-inner. p{
  792.             font-family: AktivGrotesk-Light !important;
  793.             font-size: 9px !important;
  794.             font-weight: 400 !important;
  795.             line-height: 10.3px !important;
  796.             text-align: left !important;
  797.             background-repeat: no-repeat;
  798.             background-image: url(/images/Vector_icone_new_acceuil.png);
  799.             padding-left: 40px;
  800.             background-position: 10px top;
  801.             padding-right: 10px;
  802.         }
  803.     </style>
  804. {% endblock %}
  805. {% block javascripts %}
  806.     {{ parent() }}
  807.     <script src="{{ app.request.scheme ~'://' ~ app.request.httpHost}}/assets/pdf.js"></script>
  808.     <script>
  809.         // Loaded via <script> tag, create shortcut to access PDF.js exports.
  810.         var pdfjsLib = window['pdfjs-dist/build/pdf'];
  812.         // The workerSrc property shall be specified.
  813.         pdfjsLib.GlobalWorkerOptions.workerSrc = "{{ app.request.scheme ~'://' ~ app.request.httpHost}}/assets/pdf.worker.js";
  814.     </script>
  815.     <script src="https://maps.googleapis.com/maps/api/js?key={{ key_google_map }}&libraries=places"></script>
  816.     <script src="https://create.vista.com/js/frame_v2.min.js"></script>
  817.     <script src="https://app.colorlab.io/js/include.js"></script>
  818.     <script>
  819.         var productRequest = '{% if app.request.get('product') %}{{ app.request.get('product') }}{% else %}0{% endif %}';
  820.         var formatRequest = '{% if app.request.get('format') %}{{ app.request.get('format') }}{% else %}0{% endif %}';
  821.     </script>
  822.     {{ encore_entry_script_tags('page_product_option') }}
  823.     {{ encore_entry_script_tags('product_option_viewer') }}
  824.     {{ encore_entry_script_tags('color_lab_product') }}
  825.     <script src="https://code.jquery.com/jquery-3.4.1.js"  integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="  crossorigin="anonymous"></script>
  826. {% endblock %}