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

Open in your IDE?
  1. {% extends 'front/layout.html.twig' %}
  2. {% if product.metaTitle %}
  3.     {% block title %}
  4.         {{ product.metaTitle | trans({}, "pageCmsTranslate") }}
  5.     {% endblock %}
  6. {% endif %}
  7. {% if product.metaDescription %}
  8.     {% block metaDescription %}
  9.         <meta name="description" content="{{ product.metaDescription | trans({}, "pageCmsTranslate") }}">
  10.     {% endblock %}
  11. {% endif %}
  12. {% block googleTagManagerDataLayer %}
  13.     {% include 'google_tag.html.twig' with {'titlePage':'product option','categoryPage':'product-details','navigation_category1':'','navigation_category2':'','navigation_category3':'' }   %}
  14. {% endblock %}
  15. {% block stylesheets %}
  16.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.5.5/css/simple-line-icons.min.css">
  17.     {{ encore_entry_link_tags('color_lab_product') }}
  18.     {{ parent() }}
  19. {% endblock %}
  20. {% macro value(cart,object,name) %}
  21.     {% if object %}
  22.         {% if cart|access(object) %}
  23.             {% set obj = cart|access(object) %}
  24.             value="{% if obj|access(name) %}{{ obj|access(name) }}{% endif %}"
  25.         {% else %}
  26.             value=""
  27.         {% endif %}
  28.     {% else %}
  29.         value="{% if cart|access(name) %}{{ cart|access(name) }}{% endif %}"
  30.     {% endif %}
  31. {% endmacro %}
  32. {% block body %}
  33.     {% include 'front/header.html.twig' %}
  34.     {% set currentPath = app.request.requesturi %}
  35.     <script>
  36.         var isMobile = "{{ app.request.get('isMobile') }}";
  37.         var str1 = '?';
  38.         var str2 = '{{ currentPath }}';
  39.         str2 = str2.replace(/&amp;/g, '&');
  40.         if(str2.indexOf('isMobile') != -1){
  41.             var str2 = str2.substring(0 ,str2.indexOf('isMobile') - 1);
  42.         }
  43.         var str3 = '?';
  44.         if(str2.indexOf(str1) != -1){
  45.             str3 = '&';
  46.         }
  47.         if($( window ).width() > 768 ) {
  48.             if(isMobile == '1'){
  49.                 window.location.replace(str2+str3+"isMobile=0");
  50.             }
  51.         }else {
  52.             if(isMobile != '1') {
  53.                 window.location.replace(str2+str3+"isMobile=1");
  54.             }
  55.         }
  56.     </script>
  57.     <input type="hidden" id="newPage" value="1">
  58.     <input type="hidden" id="designId" value="{% if cartDetail  %}{{ cartDetail.templateIdCrello }}{% endif %}">
  59.     <input type="hidden" name="tokenDetail" id="tokenDetail" value="{% if cartDetail  %}{{ cartDetail.token }}{% endif %}">
  60.     {% set productObject = null %}
  61.     {% if cartDetail and cartDetail.product %}
  62.         {% set productObject = cartDetail.product %}
  63.     {% elseif  app.request.get('product') %}
  64.          {% set productObject =  getProductById(app.request.get('product')) %}
  65.     {% endif %}
  66.     {% set isMobileInterface = false %}
  67.     {% if app.request.get('isMobile') == '1' %}
  68.         {#mobile#}
  69.         {% set isMobileInterface = true %}
  70.         <input type="hidden" value="1" id="isMobileInterface">
  71.         <div class="productIndexOptionNewMobile">
  72.             {% if cartDetail %}
  73.                 {% set idProduct = cartDetail.product.id %}
  74.             {% else %}
  75.                 {% if app.request.get('product') %}
  76.                     {% set idProduct = app.request.get('product') %}
  77.                 {% endif %}
  78.             {% endif %}
  79.             <input value="{{ idProduct }}" checked="checked" data-new-page="1" style="display: none" data-url="{{ path('product_option') }}?product={{ idProduct }}" type="radio" name="productOption" >
  80.             <div class="col-12 pl-0 pr-0 linkTitreFirstProduct" >
  81.                 <a href="{{ path('besoin_produits') }}" class="paddingMobileOptionProduct">
  82.                     <svg xmlns="http://www.w3.org/2000/svg" width="11" height="18" viewBox="0 0 11 18" fill="none">
  83.                         <path d="M9 2L2 9L9 16" stroke="#211E1D" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
  84.                     </svg>
  85.                     <span class="">{{ product.getTypeProductName() }}</span>
  86.                 </a>
  87.             </div>
  88.             {% set dataLivraisonArray2 = getDataLivraisonWithOrNotImprimeur() %}
  89.             <div class="blocLivraisonBesoinProduct">
  90.                 <div class="bloc1LivraisonBesoinProduct">
  91.                     <p style="display: flex;margin-bottom:0px">
  92.                     <span>
  93.                         đŸš€
  94.                     </span>
  95.                         <span class="bloc1LivraisonBesoinProductText">
  96.                         {{ 'Commandez avant 17h, livrĂ© aujourd’hui chez vous !' | trans({}, "productTranslate") }}
  97.                     </span>
  98.                     </p>
  99.                 </div>
  100.                 {% if dataLivraisonArray2.addresse.addresseAdresse %}
  101.                     <div class="bloc2LivraisonBesoinProduct">
  102.                         <p style="">
  103.                         <span>
  104.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  105.                               <g clip-path="url(#clip0_39_1752)">
  106.                                 <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"/>
  107.                               </g>
  108.                               <defs>
  109.                                 <clipPath id="clip0_39_1752">
  110.                                   <rect width="24" height="24" fill="white"/>
  111.                                 </clipPath>
  112.                               </defs>
  113.                             </svg>
  114.                         </span>
  115.                             <span class="bloc1LivraisonBesoinProductText">
  116.                             {{ dataLivraisonArray2.addresse.addresseAdresse }}
  117.                         </span>
  118.                         </p>
  119.                         {% if dataLivraisonArray2.time %}
  120.                             <p style="border-top: 0.5px solid #DDD;">
  121.                         <span>
  122.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  123.                               <g clip-path="url(#clip0_39_1755)">
  124.                                 <path d="M7 2V13H10V22L17 10H13L17 2H7Z" fill="#323232"/>
  125.                               </g>
  126.                               <defs>
  127.                                 <clipPath id="clip0_39_1755">
  128.                                   <rect width="24" height="24" fill="white"/>
  129.                                 </clipPath>
  130.                               </defs>
  131.                             </svg>
  132.                         </span>
  133.                                 <span class="bloc1LivraisonBesoinProductText">
  134.                             Livraison aujourd’hui : {{ dataLivraisonArray2.time }}
  135.                         </span>
  136.                             </p>
  137.                         {% endif %}
  138.                     </div>
  139.                 {% endif %}
  140.                 <div class="bloc3LivraisonBesoinProduct">
  141.                     <div class="bloc3LivraisonBesoinProductStr">
  142.                         <h4 class="mt-0">{{ 'Voici les options disponible Ă  cette adresse' | trans({}, "productTranslate") }} :</h4>
  143.                         <div class="bloc3LivraisonBesoinProductStrDispo">
  144.                             {% if dataLivraisonArray2.dataLivraison is defined and dataLivraisonArray2.dataLivraison.imprimeurZoneChalandise %}
  145.                                 <p style="">
  146.                                 <span class="livStatusNew2Green">
  147.                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  148.                                         <rect width="20" height="20" rx="10" fill="#8CC378"/>
  149.                                         <path d="M6 10.2L8.86364 13L15 7" stroke="white" stroke-width="2.5" stroke-linecap="round"/>
  150.                                     </svg>
  151.                                 </span>
  152.                                     <span>Livraison 30 min</span>
  153.                                 </p>
  154.                             {% endif %}
  155.                             {% if dataLivraisonArray2.dataLivraison is defined and dataLivraisonArray2.dataLivraison.imprimeurPointRetrait %}
  156.                                 <p style="">
  157.                                 <span class="livStatusNew2Green">
  158.                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  159.                                         <rect width="20" height="20" rx="10" fill="#8CC378"/>
  160.                                         <path d="M6 10.2L8.86364 13L15 7" stroke="white" stroke-width="2.5" stroke-linecap="round"/>
  161.                                     </svg>
  162.                                 </span>
  163.                                     <span>Point retrait 1h</span>
  164.                                 </p>
  165.                             {% endif %}
  166.                             {% if dataLivraisonArray2.dataLivraison is defined and (dataLivraisonArray2.dataLivraison.imprimeurLivraisonNationalJ5 or dataLivraisonArray2.dataLivraison.imprimeurLivraisonNational) %}
  167.                                 <p style="">
  168.                                 <span class="livStatusNew2Green">
  169.                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  170.                                         <rect width="20" height="20" rx="10" fill="#8CC378"/>
  171.                                         <path d="M6 10.2L8.86364 13L15 7" stroke="white" stroke-width="2.5" stroke-linecap="round"/>
  172.                                     </svg>
  173.                                 </span>
  174.                                     <span>Livraison 48h/J+5</span>
  175.                                 </p>
  176.                             {% endif %}
  177.                         </div>
  178.                     </div>
  179.                 </div>
  180.                 <div class="bloc4LivraisonBesoinProduct">
  181.                     <p> â­ïž {{ getRatingCopees() }}/5 sur Google</p>
  182.                 </div>
  183.             </div>
  184.             <div class="col-12 paddingMobileOptionProduct" >
  185.                 <h3 class="productTitreMobile">{{ product.productTitreMobile|trans({}, "productTranslate") }}</h3>
  186.             </div>
  187.             <div class="col-12">
  188.                 <div class="imageOptionProductMobile">
  189.                     <div id="custCarousel" class="carousel slide" data-ride="carousel" align="center">
  190.                         <div class="carousel-inner">
  191.                             {% for item in product.productImageMobile %}
  192.                                 <div class="carousel-item {% if loop.first %}active{% endif %}">
  193.                                     <img src="{{ asset('imageSite/'~item.image) }}" alt="Hills">
  194.                                 </div>
  195.                             {% endfor %}
  196.                         </div>
  197.                         <ol class="carousel-indicators list-inline">
  198.                             {% for item in product.productImageMobile %}
  199.                                 <li class="list-inline-item {% if loop.first %}active{% endif %}">
  200.                                     <a id="carousel-selector-0"{% if loop.first %}class="selected" {% endif %}  data-slide-to="{{ loop.index0 }}" data-target="#custCarousel">
  201.                                         <img src="{{ asset('imageSite/'~item.image) }}" class="img-fluid">
  202.                                     </a>
  203.                                 </li>
  204.                             {% endfor %}
  205.                         </ol>
  206.                     </div>
  207.                 </div>
  208.             </div>
  209.             <div id="optionsBlocMobile" class="paddingMobileOptionProduct">
  210.             </div>
  211.             <div id="quantityBlocNew" class="paddingMobileOptionProduct">
  212.             </div>
  213.             <div id="optionsBlocDescriptionMobile" class="paddingMobileOptionProduct">
  214.                 <div id="nosLovesPrinter">
  215.                 </div>
  216.             </div>
  217.             <div class="paddingMobileOptionProduct row_select_ca1 oghtml5">
  218.                 <div class="Comm_adress">
  219.                     <h3>{{ 'Votre adresse' | trans({}, "productTranslate") }}</h3>
  220.                     <div role="group" class="form-group">
  221.                         <input id="addresseLiv" name="addresseLiv" type="text" class="form-control adresee-google-map" placeholder=" "
  222.                                 {% if app.session.get('addresseAdresse') %} value="{{ app.session.get('addresseAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','adresse') }} {% endif %} >
  223.                         <label for="addresseLiv" class="d-block form-control-placeholder"> {{ 'Commencez Ă  saisir la premiĂšre ligne de votre adresse' | trans({}, "productTranslate") }}</label>
  224.                         <input type="hidden" id="longLiv"  {% if app.session.get('longiAdresse') %} value="{{ app.session.get('longiAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','longi') }}{% endif %} name="longLiv">
  225.                         <input type="hidden" id="latLiv" {% if app.session.get('latAdresse') %} value="{{ app.session.get('latAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','lat') }}{% endif %} name="latLiv">
  226.                         <input type="hidden" id="codePostalLiv" {% if app.session.get('postalcodeAdresse') %} value="{{ app.session.get('postalcodeAdresse') }}" {% else %} {{ _self.value(cart,'adresseLivraison','codePostal') }}{% endif %} name="codePostalLiv">
  227.                         <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">
  228.                         <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">
  229.                         <input type="hidden" id="cityLiv" {% if app.session.get('cityAdresse') %} value="{{ app.session.get('cityAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','city') }}{% endif %} name="cityLiv">
  230.                     </div>
  231.                 </div>
  232.                 <div id="modeLivraison">
  233.                 </div>
  234.                 {% if cartDetail.id is not defined  %}
  235.                     <div id="crelloButtons" class="crelloButtonsBlock crelloButtonsNew">
  236.                     </div>
  237.                 {% endif %}
  238.                 {% if cartDetail  %}
  239.                     {% include 'front/product-option/productPreviewModal.html.twig'  with {'isMobileInterface':isMobileInterface } %}
  240.                     {% if cartDetail.product.typeProduct  in [ constant('App\\Entity\\Product::PHOTOS')]%}
  241.                         <div class="txt_selectca mb-2" style=""> <a href="#" style="" class="crelloBtnImportPhotos crelloBtnImportNow" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  242.                     {% else %}
  243.                         {% if cartDetail.templateIdCrello  %}
  244.                             <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>
  245.                             <input type="hidden" id="designUrl" value="">
  246.                             <input type="hidden" id="designType" value="{{ cartDetail.productAttribute.format.designTypeCrello }}">
  247.                             <input type="hidden" id="customDesignType" value="{{ cartDetail.productAttribute.format.designTypeCustomCrello }}">
  248.                             <input type="hidden" id="sideBarDesignType" value="{{ cartDetail.productAttribute.format.designTypeSideBarCrello }}">
  249.                         {% elseif cartDetail.colorLabTokenProduct and cartDetail.colorLabIdProduct %}
  250.                             <div class="txt_selectca" style="min-height: 43px;">
  251.                                 <a href="#" style="color: #fff;" class="crelloBtn btnMobileImport" >
  252.                                     {{ 'Vous pouvez Ă©diter votre crĂ©ation sur' | trans({}, "productTranslate") }}
  253.                                     <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>
  254.                                 </a>
  255.                             </div>
  256.                             <input type="hidden" id="designUrl" value="">
  257.                             <input type="hidden" id="designColorLabTokenProduct" value="{{ cartDetail.colorLabTokenProduct }}">
  258.                             <input type="hidden" id="designColorLabIdProduct" value="{{ cartDetail.colorLabIdProduct }}">
  259.                         {% else %}
  260.                             <div class="txt_selectca" style=""> <a href="#" style="" class="crelloBtnImport crelloBtnImportNow btnMobileImport" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  261.                             <input type="checkbox" name="isFontBlanc" class="hide" checked="checked" value="{{ cartDetail.mauvaisFormat }}" id="isFontBlanc">
  262.                             <input type="file" multiple id="fileDesign" name="fileDesign[]" style="display: none;"  accept="image/png, image/jpeg, image/jpg, application/pdf" >
  263.                             <input type="hidden" id="fileDesignUrl" value="{{ cartDetail.filePapier }}">
  264.                             <input type="hidden" id="fileDesignFirstImage" value="{{ cartDetail.filePapierFirstImage }}">
  265.                         {% endif %}
  266.                     {% endif %}
  267.                 {% endif %}
  268.             </div>
  269.             <div class="mt-3 text-center" {% if cartDetail.id is defined %}id="addToCartCrelloCartDetailMobile"{% endif %}>
  270.                 <a href="#" class="btnNoir pl-5 pr-5" id="addToCartCrello" style="{% if cartDetail.id is not defined %}display:none;{% endif %}">{{ 'Continuer' | trans({}, "productTranslate") }}</a>
  271.             </div>
  272.             <div id="blockMarginBottom"></div>
  273.             <div id="blockDetailMobile">
  274.             </div>
  275.         </div>
  276.         <div class="modal mdl1 verificationModalMobile"  id="verificationModal" tabindex="-1" role="dialog">
  277.             <div class="modal-dialog" style="margin-top: 6vw;" role="document">
  278.                 <div class="modal-content">
  279.                     <div class="modal-body">
  280.                         <div class="row">
  281.                             <div class="col-md-8 pb-3">
  282.                                 <img src="{{ asset('/images/carte_fond_perdu.png') }}">
  283.                             </div>
  284.                             <div class="col-md-4">
  285.                                 <h4 style="font-weight: 700;">{{ 'Fond perdu' | trans({}, "productTranslate") }}</h4>
  286.                                 <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>
  287.                                 <h4 style="font-weight: 700;">{{ 'RĂ©gler le fond perdu' | trans({}, "productTranslate") }}</h4>
  288.                                 <ol style="text-align: left;font-size: 14px;color: #6a6666;padding-left: 10px;">
  289.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'Etendez votre arriĂšre-plan au-delĂ  des lignes du fond perdu.' | trans({}, "productTranslate") }}</li>
  290.                                     <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>
  291.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'VĂ©rifiez chaque page que vous imprimez.' | trans({}, "productTranslate") }}</li>
  292.                                 </ol>
  293.                             </div>
  294.                         </div>
  295.                     </div>
  296.                     <div class="modal-footer" style="display: block">
  297.                         <div class="btnVerificationModalMobile" style="">
  298.                             <a class="btnVerificationModalMobile2" data-dismiss="modal" aria-label="Close" href="#" style="">{{ "J\'ai compris" | trans({}, "productTranslate") }}</a>
  299.                             <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>
  300.                         </div>
  301.                     </div>
  302.                 </div>
  303.             </div>
  304.         </div>
  305.     {% else %}
  306.         <style>
  307.             header,.darkHeader {
  308.                 background-color: #fff!important;
  309.                 border-bottom: 1px solid #D9D9D9;
  310.                 position: relative;
  311.             }
  312.             input#searchProductMenu {
  313.                 width: 600px !important;
  314.                 max-width: 600px;
  315.                 border: 1px solid #D9D9D9;
  316.                 border-radius: 10px;
  317.             }
  318.         </style>
  319.         {#desctop#}
  320.         <div class="productIndexOptionNewDescktop" >
  321.             <div class="row" id="productIndexOptionNew">
  322.                 <div class="col-12" >
  323.                     <p class="pLink">
  324.                         <span><a class="spanLink" href="{{ path('accueil') }}">Copees</a></span>
  325.                         <span>
  326.                     <svg xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8" fill="none">
  327.                         <path d="M0.726562 7.06L3.7799 4L0.726562 0.94L1.66656 0L5.66656 4L1.66656 8L0.726562 7.06Z" fill="#323232"/>
  328.                     </svg>
  329.                 </span>
  330.                         <span ><a class="spanLink" href="{{ path('besoin_produits') }}">Communiquer</a></span>
  331.                         <span>
  332.                     <svg xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8" fill="none">
  333.                         <path d="M0.726562 7.06L3.7799 4L0.726562 0.94L1.66656 0L5.66656 4L1.66656 8L0.726562 7.06Z" fill="#323232"/>
  334.                     </svg>
  335.                 </span>
  336.                         <span class="spanLink2">{{ product.getTypeProductName() }}</span>
  337.                     </p>
  338.                 </div>
  339.                 <div class="leftBlock" >
  340.                     <div class="bx_select row_select_ca">
  341.                         <div class="d-flex selectProductNew">
  342.                             <div class="f_family">
  343.                                 <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">
  344.                            <span style="padding:0px;display: inline;font-size: 18px;font-weight:400;" id="titreProductSpan1">
  345.                                {% if cartDetail  %}
  346.                                    {% if cartDetail.product.isColorLab %}
  347.                                    {% else %}{{ 'Impression' | trans({}, "productTranslate") }}
  348.                                    {% endif %}
  349.                                {% else %}
  350.                                    {% if app.request.get('product') %}
  351.                                        {% set productById = getProductById(app.request.get('product')) %}
  352.                                        {% if productById  and productById.isColorLab %}
  353.                                        {% else %}{{ 'Impression' | trans({}, "productTranslate") }}
  354.                                        {% endif%}
  355.                                    {% endif %}
  356.                                {% endif %}
  357.                            </span>
  358.                                     <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>
  359.                                 </a>
  360.                                 <div class="collapse" id="select_row_ca_add" style="">
  361.                                     <div class="row_select_ca02 row">
  362.                                         <div class="col-12 pl-0 pr-0">
  363.                                             <h3>{{ "CrĂ©er & communiquer" | trans({}, "productTranslate") |raw }}</h3>
  364.                                             <div class=" bx_global_radio taille_full" style="max-width: 100%;">
  365.                                                 {% for item in getProductsWithoutPapier() %}
  366.                                                     <div class="taille tailleSelect">
  367.                                                         <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 %}">
  368.                                                         <label for="cad{{ item.id }}" class="block taille ">{{ item.titre | trans({}, "productTranslate") }}</label>
  369.                                                     </div>
  370.                                                 {% endfor %}
  371.                                             </div>
  372.                                         </div>
  373.                                     </div>
  374.                                 </div>
  375.                             </div>
  376.                         </div>
  377.                     </div>
  378.                     <div class="col-12 p-0">
  379.                         <p class="lienSavoirPlusP mb-2"><a href="{{ product.lienSavoirPlus }}"  {% if product.lienSavoirPlusIsExtern %} target="_blank"{% endif %}>En savoir plus</a> </p>
  380.                     </div>
  381.                     <div class="row">
  382.                         <div class="col-md-12 imageProduitNewOption"  style="margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew1 }});">
  383.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew1 }};font-size: {{ product.titreBlocOptionProductTailleNew1 }};color: {{ product.titreBlocOptionProductCouleurNew1 }};">{{ product.titreBlocOptionProductNew1 }}</p>
  384.                             <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>
  385.                         </div>
  386.                         <div class="col-md-12 imageProduitNewOption"  style="margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew2 }});">
  387.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew2 }};font-size: {{ product.titreBlocOptionProductTailleNew2 }};color: {{ product.titreBlocOptionProductCouleurNew2 }};">{{ product.titreBlocOptionProductNew2 }}</p>
  388.                             <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>
  389.                         </div>
  390.                         <div class="col-md-6 imageProduitNewOption"  style="margin-right:12px;margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew3 }});">
  391.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew3 }};font-size: {{ product.titreBlocOptionProductTailleNew3 }};color: {{ product.titreBlocOptionProductCouleurNew3 }};">{{ product.titreBlocOptionProductNew3 }}</p>
  392.                             <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>
  393.                         </div>
  394.                         <div class="col-md-5 imageProduitNewOption"  style="margin-bottom:12px;background-image: url(/imageSite/{{ product.imageBlocOptionProductNew4 }});">
  395.                             <p style="font-family: {{ product.titreBlocOptionProductPoliceNew4 }};font-size: {{ product.titreBlocOptionProductTailleNew4 }};color: {{ product.titreBlocOptionProductCouleurNew4 }};">{{ product.titreBlocOptionProductNew4 }}</p>
  396.                             <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>
  397.                         </div>
  398.                     </div>
  399.                     <div id="optionsBloc1">
  400.                     </div>
  401.                     <div class="row">
  402.                         <div class="col-md-12 besoinProduitNewOption"  style="">
  403.                             <p>Vous ne trouvez pas votre besoin ?</p>
  404.                             <a href="{{ product.lienCDemandeDevis }}" {% if product.lienCDemandeDevisIsExtern %} target="_blank"{% endif %}>Demande de devis</a>
  405.                         </div>
  406.                     </div>
  407.                 </div>
  408.                 <div class=" centerBlock">
  409.                     <div id="optionsBloc2">
  410.                     </div>
  411.                     <div id="quantityBlocNew" class="oghtml6">
  412.                     </div>
  413.                     <div class="row_select_ca1 oghtml5">
  414.                         <div class="Comm_adress">
  415.                             <h3>{{ 'Votre adresse' | trans({}, "productTranslate") }}</h3>
  416.                             <div role="group" class="form-group">
  417.                                 <input id="addresseLiv" name="addresseLiv" type="text" class="form-control adresee-google-map" placeholder=" "
  418.                                         {% if app.session.get('addresseAdresse') %} value="{{ app.session.get('addresseAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','adresse') }} {% endif %} >
  419.                                 <label for="addresseLiv" class="d-block form-control-placeholder"> {{ 'Commencez Ă  saisir la premiĂšre ligne de votre adresse' | trans({}, "productTranslate") }}</label>
  420.                                 <input type="hidden" id="longLiv"  {% if app.session.get('longiAdresse') %} value="{{ app.session.get('longiAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','longi') }}{% endif %} name="longLiv">
  421.                                 <input type="hidden" id="latLiv" {% if app.session.get('latAdresse') %} value="{{ app.session.get('latAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','lat') }}{% endif %} name="latLiv">
  422.                                 <input type="hidden" id="codePostalLiv" {% if app.session.get('postalcodeAdresse') %} value="{{ app.session.get('postalcodeAdresse') }}" {% else %} {{ _self.value(cart,'adresseLivraison','codePostal') }}{% endif %} name="codePostalLiv">
  423.                                 <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">
  424.                                 <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">
  425.                                 <input type="hidden" id="cityLiv" {% if app.session.get('cityAdresse') %} value="{{ app.session.get('cityAdresse') }}" {% else %}{{ _self.value(cart,'adresseLivraison','city') }}{% endif %} name="cityLiv">
  426.                             </div>
  427.                         </div>
  428.                         <div id="modeLivraison">
  429.                         </div>
  430.                         {% if cartDetail.id is not defined  %}
  431.                             <div id="crelloButtons" class="crelloButtonsBlock crelloButtonsNew">
  432.                             </div>
  433.                         {% endif %}
  434.                         {% if cartDetail  %}
  435.                             {% include 'front/product-option/productPreviewModal.html.twig'  with {'isMobileInterface':isMobileInterface } %}
  436.                             {% if cartDetail.product.typeProduct  in [ constant('App\\Entity\\Product::PHOTOS')]%}
  437.                                 <div class="txt_selectca mb-2" style=""> <a href="#" style="" class="crelloBtnImportPhotos crelloBtnImportNow" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  438.                             {% else %}
  439.                                 {% if cartDetail.templateIdCrello  %}
  440.                                     <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>
  441.                                     <input type="hidden" id="designUrl" value="">
  442.                                     <input type="hidden" id="designType" value="{{ cartDetail.productAttribute.format.designTypeCrello }}">
  443.                                     <input type="hidden" id="customDesignType" value="{{ cartDetail.productAttribute.format.designTypeCustomCrello }}">
  444.                                     <input type="hidden" id="sideBarDesignType" value="{{ cartDetail.productAttribute.format.designTypeSideBarCrello }}">
  445.                                 {% elseif cartDetail.colorLabTokenProduct and cartDetail.colorLabIdProduct %}
  446.                                     <div class="txt_selectca" style="min-height: 43px;">
  447.                                         <a href="#" style="color: #fff;" class="crelloBtn" >
  448.                                             {{ 'Vous pouvez Ă©diter votre crĂ©ation sur' | trans({}, "productTranslate") }}
  449.                                             <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>
  450.                                         </a>
  451.                                     </div>
  452.                                     <input type="hidden" id="designUrl" value="">
  453.                                     <input type="hidden" id="designColorLabTokenProduct" value="{{ cartDetail.colorLabTokenProduct }}">
  454.                                     <input type="hidden" id="designColorLabIdProduct" value="{{ cartDetail.colorLabIdProduct }}">
  455.                                 {% else %}
  456.                                     <div class="txt_selectca" style=""> <a href="#" style="" class="crelloBtnImport crelloBtnImportNow" >{{ 'Vous pouvez changer votre crea' | trans({}, "productTranslate") }}</a></div>
  457.                                     <input type="checkbox" name="isFontBlanc" class="hide" checked="checked" value="{{ cartDetail.mauvaisFormat }}" id="isFontBlanc">
  458.                                     <input type="file" multiple id="fileDesign" name="fileDesign[]" style="display: none;"  accept="image/png, image/jpeg, image/jpg, application/pdf" >
  459.                                     <input type="hidden" id="fileDesignUrl" value="{{ cartDetail.filePapier }}">
  460.                                     <input type="hidden" id="fileDesignFirstImage" value="{{ cartDetail.filePapierFirstImage }}">
  461.                                 {% endif %}
  462.                             {% endif %}
  463.                         {% endif %}
  464.                     </div>
  465.                 </div>
  466.                 <div class=" rightBlock">
  467.                     <div id="blockPanierNew">
  468.                     </div>
  469.                     <div class="nousContacter" style="margin-bottom: 34px;">
  470.                         <div id="nosLovesPrinter">
  471.                         </div>
  472.                         <h3>Nous contacter</h3>
  473.                         <div class="nousContacterContent">
  474.                             <a href="#"  data-toggle="modal" data-target="#contactModal" >
  475.                         <span>
  476.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
  477.                                 <g clip-path="url(#clip0_64_809)">
  478.                                 <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"/>
  479.                                 </g>
  480.                                 <defs>
  481.                                 <clipPath id="clip0_64_809">
  482.                                 <rect width="24" height="24" fill="white"/>
  483.                                 </clipPath>
  484.                                 </defs>
  485.                             </svg>
  486.                         </span>
  487.                                 <span>Par tĂ©lĂ©phone</span>
  488.                             </a>
  489.                             <a href="#" id="contactChat">
  490.                         <span>
  491.                             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
  492.                                <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"/>
  493.                             </svg>
  494.                         </span>
  495.                                 <span>Via notre chat</span>
  496.                             </a>
  497.                             <a href="{{ product.lienCalandlyOptionProduct }}"  {% if product.lienCalandlyOptionProductIsExtern %} target="_blank"{% endif %} >
  498.                                 <span>
  499.                                     <svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" viewBox="0 0 25 24" fill="none">
  500.                                         <g clip-path="url(#clip0_64_815)">
  501.                                         <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"/>
  502.                                         <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"/>
  503.                                         <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"/>
  504.                                         <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"/>
  505.                                         </g>
  506.                                         <defs>
  507.                                         <clipPath id="clip0_64_815">
  508.                                         <rect width="24" height="24" fill="white" transform="translate(0.5)"/>
  509.                                         </clipPath>
  510.                                         </defs>
  511.                                     </svg>
  512.                                 </span>
  513.                                 <span>Prendre RDV avec un conseiller</span>
  514.                             </a>
  515.                         </div>
  516.                     </div>
  517.                     {#<div class="nosTips">#}
  518.                         {#<h3>Nos tips</h3>#}
  519.                         {#<div class="nosTipsContent">#}
  520.                             {#{% if product.tipsProduct|length > 0 %}#}
  521.                                 {#{% for item in product.tipsProduct %}#}
  522.                                     {#<div class="nosTipsItem">#}
  523.                                         {#<h4 class="nosTipsItemTitre">#}
  524.                                             {#{{ item.titre }}#}
  525.                                             {#<a href="#" class="nosTipsItemA">#}
  526.                                                 {#<svg class="vectorPlus activeVector" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">#}
  527.                                                     {#<path d="M11.25 6.75H6.75V11.25H5.25V6.75H0.75V5.25H5.25V0.75H6.75V5.25H11.25V6.75Z" fill="#323232"/>#}
  528.                                                 {#</svg>#}
  529.                                                 {#<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">#}
  530.                                                     {#<path d="M11.25 1.75H6.75H5.25H0.75V0.25H5.25H6.75H11.25V1.75Z" fill="#323232"/>#}
  531.                                                 {#</svg>#}
  532.                                             {#</a>#}
  533.                                         {#</h4>#}
  534.                                         {#<div  class="nosTipsItemDescription" style="display: none;">#}
  535.                                             {#{{ item.description|raw }}#}
  536.                                         {#</div>#}
  537.                                     {#</div>#}
  538.                                 {#{% endfor %}#}
  539.                             {#{% endif %}#}
  540.                         {#</div>#}
  541.                     {#</div>#}
  542.                 </div>
  543.             </div>
  544.             <div  id="section2OptionNew">
  545.                 <div class="row">
  546.                     <div class="col-md-12">
  547.                         <h2 class="h2productIndexOptionNew">Besoin d'un autre produit ?</h2>
  548.                     </div>
  549.                 </div>
  550.                 <div class="row" style="display: flex;justify-content: center;padding-bottom: 60px;">
  551.                     {% if product.recommendationProduct|length > 0 %}
  552.                         {% for item in  product.recommendationProduct %}
  553.                             <div class="col-6 col-md-3 col-lg-2 col-xl-2">
  554.                                 <div class="divProductImageCommande">
  555.                                     {% if item.titre %} <span>{{ item.titre }}</span>{% endif %}
  556.                                     <a style="position: relative;" class="new_option_product_a_img" href="{{ item.link }}">
  557.                                         <img class="" src="{{ asset('imageSite/'~item.image) }}">
  558.                                     </a>
  559.                                 </div>
  560.                             </div>
  561.                         {% endfor %}
  562.                     {% endif %}
  563.                 </div>
  564.             </div>
  565.             <div  id="section3OptionNew" style="background-image: url(/imageSite/{{ product.imageBloc1OptionProduct }});">
  566.                 <div class="section3OptionNewDiv">
  567.                     <h2 class="h2productIndexOptionNew h2productIndexOptionNewSection3">{{ product.titreBloc1OptionProduct }}</h2>
  568.                     <p>{{ product.descriptionBloc1OptionProduct|raw }}</p>
  569.                     {% if product.titreBtnBloc1OptionProduct %}<a href="{{ product.linkBtnBloc1OptionProduct }}" class="btnOptionNewBloc">{{ product.titreBtnBloc1OptionProduct }}</a>{% endif %}
  570.                 </div>
  571.             </div>
  572.             <div  id="section4OptionNew">
  573.                 <div class="section4OptionNewDiv">
  574.                     <h2 class="h2productIndexOptionNew h2productIndexOptionNewSection4">{{ product.titreBloc2OptionProduct }}</h2>
  575.                     <p>{{ product.descriptionBloc2OptionProduct|raw }}</p>
  576.                     <div class="" style="text-align: center ;text-align: center;margin-top: 45px;">
  577.                         {% if product.titreBtnBloc2OptionProduct %}<a href="{{ product.linkBtnBloc2OptionProduct }}" class="btnOptionNewBloc">{{ product.titreBtnBloc2OptionProduct }}</a>{% endif %}
  578.                     </div>
  579.                 </div>
  580.             </div>
  581.             <div  id="section3OptionNew" style="background-image: url(/imageSite/{{ product.imageBloc3OptionProduct }});">
  582.                 <div class="section3OptionNewDiv">
  583.                     <h2 class="h2productIndexOptionNew h2productIndexOptionNewSection3">{{ product.titreBloc3OptionProduct }}</h2>
  584.                     <p>{{ product.descriptionBloc3OptionProduct|raw }}</p>
  585.                     {% if product.titreBtnBloc3OptionProduct %}<a href="{{ product.linkBtnBloc3OptionProduct }}" class="btnOptionNewBloc">{{ product.titreBtnBloc3OptionProduct }}</a>{% endif %}
  586.                 </div>
  587.             </div>
  588.         </div>
  589.         <div class="modal mdl1"  id="verificationModal" tabindex="-1" role="dialog">
  590.             <div class="modal-dialog" style="margin-top: 6vw;" role="document">
  591.                 <div class="modal-content">
  592.                     <div class="modal-body">
  593.                         <div class="row">
  594.                             <div class="col-md-4">
  595.                                 <h4 style="font-weight: 700;">{{ 'Fond perdu' | trans({}, "productTranslate") }}</h4>
  596.                                 <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>
  597.                                 <h4 style="font-weight: 700;">{{ 'RĂ©gler le fond perdu' | trans({}, "productTranslate") }}</h4>
  598.                                 <ol style="text-align: left;font-size: 14px;color: #6a6666;padding-left: 10px;">
  599.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'Etendez votre arriĂšre-plan au-delĂ  des lignes du fond perdu.' | trans({}, "productTranslate") }}</li>
  600.                                     <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>
  601.                                     <li style="line-height: 20px;font-size: 14px;">{{ 'VĂ©rifiez chaque page que vous imprimez.' | trans({}, "productTranslate") }}</li>
  602.                                 </ol>
  603.                             </div>
  604.                             <div class="col-md-8">
  605.                                 <img src="{{ asset('/images/carte_fond_perdu.png') }}">
  606.                             </div>
  607.                         </div>
  608.                     </div>
  609.                     <div class="modal-footer" style="display: block">
  610.                         <div class="mt-4" style="display: flex;justify-content: space-evenly">
  611.                             <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>
  612.                             <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>
  613.                         </div>
  614.                     </div>
  615.                 </div>
  616.             </div>
  617.         </div>
  618.         {% include 'front/footer.html.twig' %}
  619.     {% endif %}
  620.     <div class="modal fade" id="exampleModal01" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
  621.          style="display: none;" aria-hidden="true">
  622.         <div class="modal-dialog" role="document" style="margin-top: 4vw;">
  623.             <div class="modal-content nb_des nb_des_extra" style="border-radius: 0;">
  624.                 <div class="modal-header">
  625.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  626.                         <span aria-hidden="true">×</span>
  627.                     </button>
  628.                 </div>
  629.                 <div class="modal-body" id="contentModalAddToCartCrello">
  630.                 </div>
  631.             </div>
  632.         </div>
  633.     </div>
  634.     <div class="modal mdlContact"  id="contactModal" tabindex="-1" role="dialog">
  635.         <div class="modal-dialog" style="margin-top: 6vw;" role="document">
  636.             <div class="modal-content">
  637.                 <div class="modal-header">
  638.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  639.                         <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30" fill="none">
  640.                             <rect width="30" height="30" rx="10" fill="black"/>
  641.                             <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"/>
  642.                         </svg>
  643.                     </button>
  644.                 </div>
  645.                 <div class="contactModalImage"  style="background-image: url(/imageSite/{{ product.imageBlocTelOptionProduct }} );"></div>
  646.                 <div class="modal-body">
  647.                     <div class="contactModalDescription">
  648.                       {{ product.descriptionBlocTelOptionProduct|raw }}
  649.                     </div>
  650.                 </div>
  651.             </div>
  652.         </div>
  653.     </div>
  654.     <div class="modal mdl1"  id="outOfStockModal" tabindex="-1" role="dialog">
  655.         <div class="modal-dialog modal-lg" style="margin-top: 3vw;">
  656.             <div class="modal-content modalProduct modalProductAtributeStock">
  657.             </div>
  658.         </div>
  659.     </div>
  660.     <div class="elfsight-app-eaf5d12e-308e-4116-bee5-690b97eaae1f" data-elfsight-app-lazy></div>
  661.     <style>
  662.         .elfsight-app-eaf5d12e-308e-4116-bee5-690b97eaae1f {
  663.             display: none;
  664.         }
  665.     </style>
  666.     <script src="https://static.elfsight.com/platform/platform.js" async></script>
  667.     <style>
  668.         footer {
  669.             padding-top: 0px;
  670.             margin-top: 0px;
  671.         }
  672.         .taille label {
  673.             padding: 0 12px;
  674.         }
  675.         .bloc_btn_crello {
  676.             margin-top: 40px;
  677.             background-color: #FDF18D;
  678.             color: #000;
  679.             min-height: 50px;
  680.             padding: 15px;
  681.             border-radius: 4px !important;
  682.             font-size: 14px;
  683.         }
  684.         .btnNoir{
  685.             color: #fff;
  686.             background-color: #000;
  687.             display: inline-block;
  688.             font-size: 12px;
  689.             padding: 15px 12px;
  690.             text-align: center;
  691.         }
  692.         .btnBlue{
  693.             color: #fff;
  694.             background-color: #5BAFF5;
  695.             display: inline-block;
  696.             font-size: 12px;
  697.             padding: 15px 12px;
  698.             text-align: center;
  699.         }
  700.         .mdl1 li::marker {
  701.             color: #6a6666;
  702.         }
  703.         .carousel-indicators li {
  704.             display: inline-block;
  705.             width: 10px;
  706.             height: 10px;
  707.             margin: 1px;
  708.             text-indent: -999px;
  709.             cursor: pointer;
  710.             background-color: #fff\9;
  711.             background-color: #fff;
  712.             border: 1px solid #000;
  713.             border-radius: 10px;
  714.         }
  715.         .carousel-indicators .active {
  716.             width: 12px;
  717.             height: 12px;
  718.             margin: 0;
  719.             background-color: #000;
  720.         }
  721.         .menu_left {
  722.             flex: 0 0 34%;
  723.             max-width: 34%;
  724.             position: initial;
  725.             padding-left: 0;
  726.             text-align: left;
  727.         }
  728.         .menu_right {
  729.             flex: 0 0 66%;
  730.             max-width: 66%;
  731.             padding-right: 40px !important;
  732.         }
  733.         .tooltip-inner h2 {
  734.             font-family: AktivGrotesk-Medium;
  735.             font-size: 16px;
  736.             font-weight: 400;
  737.             line-height: 18.91px;
  738.             text-align: center;
  739.             margin-top: 8px;
  740.             border-bottom: 1px solid #fff;
  741.             margin-bottom: 14px;
  742.         }
  743.         .tooltip-inner{
  744.             background-color: #5268ff!important;
  745.             color: #fff!important;
  746.             box-shadow: 4px 4px 10px 0px #00000040!important;
  747.             border-radius: 10px!important;
  748.             max-width:400px!important
  749.         }
  750.         .tooltip-inner. p{
  751.             font-family: AktivGrotesk-Light !important;
  752.             font-size: 9px !important;
  753.             font-weight: 400 !important;
  754.             line-height: 10.3px !important;
  755.             text-align: left !important;
  756.             background-repeat: no-repeat;
  757.             background-image: url(/images/Vector_icone_new_acceuil.png);
  758.             padding-left: 40px;
  759.             background-position: 10px top;
  760.             padding-right: 10px;
  761.         }
  762.     </style>
  763. {% endblock %}
  764. {% block javascripts %}
  765.     {{ parent() }}
  766.     <script src="{{ app.request.scheme ~'://' ~ app.request.httpHost}}/assets/pdf.js"></script>
  767.     <script>
  768.         // Loaded via <script> tag, create shortcut to access PDF.js exports.
  769.         var pdfjsLib = window['pdfjs-dist/build/pdf'];
  770.         // The workerSrc property shall be specified.
  771.         pdfjsLib.GlobalWorkerOptions.workerSrc = "{{ app.request.scheme ~'://' ~ app.request.httpHost}}/assets/pdf.worker.js";
  772.     </script>
  773.     <script src="https://maps.googleapis.com/maps/api/js?key={{ key_google_map }}&libraries=places"></script>
  774.     <script src="https://create.vista.com/js/frame_v2.min.js"></script>
  775.     <script src="https://app.colorlab.io/js/include.js"></script>
  776.     <script>
  777.         var productRequest = '{% if app.request.get('product') %}{{ app.request.get('product') }}{% else %}0{% endif %}';
  778.         var formatRequest = '{% if app.request.get('format') %}{{ app.request.get('format') }}{% else %}0{% endif %}';
  779.     </script>
  780.     {{ encore_entry_script_tags('page_product_option') }}
  781.     {{ encore_entry_script_tags('product_option_viewer') }}
  782.     {{ encore_entry_script_tags('color_lab_product') }}
  783.     <script src="https://code.jquery.com/jquery-3.4.1.js"  integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="  crossorigin="anonymous"></script>
  784. {% endblock %}