templates/fiche_produit/portail/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}SPA.BIZ | Portail {{ current_parent_categorie.getNameLangue(app.request.locale) }}{% endblock %}
  5. {% block title_page %}<span class="port_title-page-mobil">{% trans %}PORTAIL{% endtrans %}</span> SPA {{ current_parent_categorie.getNameLangue(app.request.locale) | upper }}{% endblock %}
  7. {% block body %}
  9.     <div class="container-fluid background-grey d-lg-block d-md-block d-sm-none d-none">
  10.         <div class="container">
  11.             <div class="row pt-3 pb-3">
  12.                 <ul class="d-flex justify-content-center mb-0">
  13.                     <li class="fiche-nav"><a href="{{ path("app_fiche_produit_portail_luxe", {"id_categorie":current_parent_categorie.id, "name_categorie":current_parent_categorie.getNameLangue(app.request.locale), "id_produit": produit.id}) }}" class="fs-14 text-grey-color-used no-decoration">{% trans %}Portail{% endtrans %} {{ current_parent_categorie.getNameLangue(app.request.locale) }}</a></li>
  14.                     <li class="fiche-nav"><a href="{{ path("app_list_product_per_categ", {"type":current_parent_categorie.getNameLangue(app.request.locale), "id_categorie":current_parent_categorie.id}) }}" class="fs-14 text-grey-color-used no-decoration">{% trans %}Tous les{% endtrans %} spas {{ current_parent_categorie.getNameLangue(app.request.locale) }}</a></li>
  15.                     <li class="fiche-nav"><a href="" class="fs-14 text-grey-color-used no-decoration">{% trans %}Accessoires{% endtrans %}</a></li>
  16.                     <li class="fiche-nav"><a href="" class="fs-14 text-grey-color-used no-decoration">{% trans %}Pièces{% endtrans %} {% trans %}Détâchées{% endtrans %}</a></li>
  17.                 </ul>
  18.             </div>
  19.         </div>
  20.     </div>
  30.     <div class="container-fluid background-grey-sm">
  31.         <div class="container mt-lg-3 mt-md-3 mt-sm-0 mt-0 pt-lg-3 p-lg-2 p-md-4 p-sm-2 p-2 mb-lg-3 mb-md-3 mb-sm-0 mb-0 pb-lg-0 pb-md-0 pb-sm-4 pb-4">
  32.             <div class="row p-2">
  33.                 <div class="col-lg-6 col-md-12 col-sm-12 col-12">
  34.                     <div class="bordered p-lg-4 p-md-4 p-sm-0 p-0">
  35.                         <h2 class="port_text-color text-lg-start text-md-start text-sm-center text-center"><i>{% trans %}Que cherchez vous ?{% endtrans %}</i></h2>
  36.                         <div class="mt-4">
  37.                             <p class="port_text-color fw-600 text-lg-start text-md-start text-sm-center text-center">{% trans %}Places{% endtrans %} Spas</p>
  38.                             <div class="row port_list-place">
  39.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  40.                                     <div class="port_input-div-places actif">
  41.                                         <span class="d-lg-block d-md-block d-sm-none d-none">2 à 4 {% trans %}places{% endtrans %}</span>
  42.                                         <span class="d-lg-none d-md-none d-sm-block d-block">2 à 4 </br>{% trans %}places{% endtrans %}</span>
  43.                                     </div>
  44.                                 </div>
  45.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  46.                                     <div class="port_input-div-places">
  47.                                         <span class="d-lg-block d-md-block d-sm-none d-none">5 à 6 {% trans %}places{% endtrans %}</span>
  48.                                         <span class="d-lg-none d-md-none d-sm-block d-block">5 à 6 </br>{% trans %}places{% endtrans %}</span>
  49.                                     </div>
  50.                                 </div>
  51.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  52.                                     <div class="port_input-div-places">
  53.                                         <span class="d-lg-block d-md-block d-sm-none d-none">6 à 8 {% trans %}places{% endtrans %}</span>
  54.                                         <span class="d-lg-none d-md-none d-sm-block d-block">6 à 8 </br>{% trans %}places{% endtrans %}</span>
  55.                                     </div>
  56.                                 </div>
  57.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  58.                                     <div class="port_input-div-places">
  59.                                         <span class="d-lg-block d-md-block d-sm-none d-none">9 {% trans %}places et{% endtrans %} +</span>
  60.                                         <span class="d-lg-none d-md-none d-sm-block d-block">9 à + </br>{% trans %}places{% endtrans %}</span>
  61.                                     </div>
  62.                                 </div>
  63.                             </div>
  64.                         </div>
  65.                         <div class="mt-4">
  66.                             <p class="port_text-color fw-600 text-lg-start text-md-start text-sm-center text-center">{% trans %}Nombres de Jets{% endtrans %}</p>
  67.                             <div class="row port_list-jets">
  68.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  69.                                     <div class="port_input-div-jets">
  70.                                         <span class="d-lg-block d-md-block d-sm-none d-none">20 à 40 {% trans %}Jets{% endtrans %}</span>
  71.                                         <span class="d-lg-none d-md-none d-sm-block d-block">20 à 40 </br>{% trans %}Jets{% endtrans %}</span>
  72.                                     </div>
  73.                                 </div>
  74.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  75.                                     <div class="port_input-div-jets actif">
  76.                                         <span class="d-lg-block d-md-block d-sm-none d-none">50 à 60 {% trans %}Jets{% endtrans %}</span>
  77.                                         <span class="d-lg-none d-md-none d-sm-block d-block">50 à 60 </br>{% trans %}Jets{% endtrans %}</span>
  78.                                     </div>
  79.                                 </div>
  80.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  81.                                     <div class="port_input-div-jets">
  82.                                         <span class="d-lg-block d-md-block d-sm-none d-none">60 à 80 {% trans %}Jets{% endtrans %}</span>
  83.                                         <span class="d-lg-none d-md-none d-sm-block d-block">60 à 80 </br>{% trans %}Jets{% endtrans %}</span>
  84.                                     </div>
  85.                                 </div>
  86.                                 <div class="col-lg-3 col-md-4 col-sm-6 col-6">
  87.                                     <div class="port_input-div-jets">
  88.                                         <span class="d-lg-block d-md-block d-sm-none d-none">90 à 120 {% trans %}Jets{% endtrans %}</span>
  89.                                         <span class="d-lg-none d-md-none d-sm-block d-block">90 à 120 </br>{% trans %}Jets{% endtrans %}</span>
  90.                                     </div>
  91.                                 </div>
  92.                             </div>
  93.                         </div>
  94.                         <div class="mt-4">
  95.                             <p class="port_text-color fw-600 text-lg-start text-md-start text-sm-center text-center">{% trans %}Budgets{% endtrans %}</p>
  96.                             <div class="row port_list-place">
  98.                                 <div class="range">
  99.                                     <div class="port_distance-slider">
  100.                                         <span class="vvk port_text-slider">4400€</span>
  101.                                     </div>
  102.                                     <input  id="sliderInput" class="port_width-input-range" type="range" min="4400" value="0" max="50000" step="0">
  103.                                     <div class="row">
  104.                                         <div class="col-6 text-start port_text-slider-left">
  105.                                             4.400€</div>
  107.                                         <div class="col-6 text-end port_text-slider-right">
  108.                                             ∞</div>
  109.                                     </div>
  110.                                 </div>
  111.                             </div>
  112.                         </div>
  114.                     </div>
  116.                     <div class="row mt-1">
  117.                         <div class="col-53 my-auto order-lg-0 order-md-0 order-sm-1 order-1 text-lg-start text-md-start text-sm-center text-center mt-lg-0 mt-md-0 mt-sm-2 mt-2">
  118.                             <span class="port_text-change-color-mobile port_fs-12">{% trans %}Le portail de{% endtrans %} Spa.Biz {% trans %}est entièrement gratuit et vos informations ne seront pas divulgées{% endtrans %}</span>
  119.                         </div>
  120.                         <div class="col-47 my-auto order-lg-1 order-md-1 order-sm-0 order-0 text-center">
  121.                             <button class="port_button-search">{% trans %}Rechercher{% endtrans %}</button>
  122.                         </div>
  123.                     </div>
  125.                 </div>
  127.                 {#  mobile  #}
  128.                 <div class="port_border-black d-lg-none d-md-none d-sm-block d-block"></div>
  129.                 <div class="container-fluid port_box-shadow-width background-blue d-lg-none d-md-none d-sm-block d-block">
  130.                     <div class="container">
  131.                         <div class="row pt-3 pb-3">
  132.                             {% for categ in categori_parent %}
  134.                                 <div class="col-4">
  135.                                     {% if categ.id == categorie_parent_current %}
  136.                                         <button class="categ-actif-sm">{% trans %}Gamme{% endtrans %} <br>{{ categ.getNameLangue(app.request.locale) }}</button>
  137.                                     {% else %}
  138.                                         <button class="categ-inactif-sm">{% trans %}Gamme{% endtrans %} <br>{{ categ.getNameLangue(app.request.locale) }}</button>
  139.                                     {% endif %}
  140.                                 </div>
  141.                             {% endfor %}
  142.                         </div>
  143.                     </div>
  144.                 </div>
  146.                 <div class="col-lg-6 col-md-12 col-sm-12 col-12">
  147.                     <div class="bordered">
  148.                         <div class="row d-lg-flex d-md-flex d-sm-none d-none">
  149.                             {% for categ in categori_parent %}
  151.                                 <div class="col-lg-4 col-md-4 col-sm-12 col-12 text-center">
  152.                                     {% if categ.id == categorie_parent_current %}
  153.                                         <button class="categ-actif">{% trans %}Gamme{% endtrans %} {{ categ.getNameLangue(app.request.locale) }}</button>
  154.                                     {% else %}
  155.                                         <button class="categ-inactif">{% trans %}Gamme{% endtrans %} {{ categ.getNameLangue(app.request.locale) }}</button>
  156.                                     {% endif %}
  157.                                 </div>
  158.                             {% endfor %}
  159.                         </div>
  161.                         <div class="row mt-2">
  162.                             <div class="col-lg-6 col-md-6 col-sm-12 col-12">
  163.                                 {#  modif  #}
  164.                                 <div class="card-body text-center p-1 position-relative">
  165.                                     <div>
  166.                                         <h2 class="fw-600 text-grey-color-used"><i class="text-portail">SPAS</i> {{ produit.getNameLangue(app.request.locale) }}</h2>
  167.                                     </div>
  168.                                     <div class="row">
  169.                                         <div class="col-6 text-small-bolder-fiche text-end text-grey-color-used">3 {% trans %}places{% endtrans %}</div>
  170.                                         <div class="col-6 text-small-bolder-fiche text-start text-grey-color-used">60 {% trans %}jets{% endtrans %}</div>
  171.                                     </div>
  172.                                     <div class="price-products-fiche text-grey-color-used">{{ produit.getPriceLangue(app.request.locale)|number_format(0, ',', ' ') }}€</div>
  173.                                     <div class="ratings-fiche mb-3">
  174.                                         <div class="empty-stars-fiche"></div>
  175.                                         <div class="full-stars-fiche" style="width:70%"></div>
  176.                                     </div>
  178.                                     <div class="mb-4">
  179.                                         <div class="port_center-list position-relative">
  180.                                             <div class="width-unset">
  181.                                                 <img height="120px" src="{{ asset("/images/images_produits/"~produit.imageProduitsPrincipale) }}" alt="zaccouzi">
  182.                                             </div>
  184.                                             {% for prodImage in produit.imageProduits %}
  185.                                                 <div class="width-unset">
  186.                                                     <img height="120px" src="{{ asset("/images/images_produits/"~prodImage.image) }}" alt="zaccouzi">
  187.                                                 </div>
  188.                                             {% endfor %}
  189. {#                                            <div class="col-lg-4 col-12">#}
  190. {#                                                <img width="100%" class="vvv" src="{{ asset("/images/img_products/image_zaccouzi.png") }}" alt="zaccouzi">#}
  191. {#                                            </div>#}
  192. {#                                            <div class="col-lg-4 col-12">#}
  193. {#                                                <img width="100%" class="vvv" src="{{ asset("/images/img_products/2.jpg") }}" alt="zaccouzi">#}
  194. {#                                            </div>#}
  195. {#                                            <div class="col-lg-4 col-12">#}
  196. {#                                                <img width="100%" class="vvv" src="{{ asset("/images/img_products/image_zaccouzi.png") }}" alt="zaccouzi">#}
  197. {#                                            </div>#}
  198. {#                                            <div class="col-lg-4 col-12">#}
  199. {#                                                <img width="100%" class="vvv" src="{{ asset("/images/img_products/image_zaccouzi.png") }}" alt="zaccouzi">#}
  200. {#                                            </div>#}
  201.                                         </div>
  203.                                     </div>
  205.                                     <div class="d-lg-block d-md-block d-sm-none d-none">
  206.                                         <div class="button-show-detail-fiche">
  207.                                             <a class="text-white text-decoration-none fw-600" href="">{% trans %}Finaliser mon Spa{% endtrans %}</a>
  208.                                         </div>
  209.                                         <div class="mt-2">
  210.                                             <a class="button-add-comparator fs-14 fw-600" href="">{% trans %}Ajouter{% endtrans %} {% trans %}au comparateur{% endtrans %}</a>
  211.                                         </div>
  212.                                     </div>
  213.                                 </div>
  214.                             </div>
  216.                             <div class="col-lg-6 col-md-6 col-sm-12 col-12">
  217.                                 <div class="d-lg-inline-flex d-md-inline-flex d-sm-block d-block">
  218.                                     <div class="list-color d-lg-flex d-md-flex d-sm-none d-none">
  219.                                         <div class="one-color">
  220.                                             <div class="maron"></div>
  221.                                         </div>
  222.                                         <div class="one-color actif-color">
  223.                                             <div class="gris"></div>
  224.                                         </div>
  225.                                         <div class="one-color">
  226.                                             <div class="bleue"></div>
  227.                                         </div>
  228.                                         <div class="one-color mr-0">
  229.                                             <div class="jaune"></div>
  230.                                         </div>
  231.                                     </div>
  232.                                     <div class="text-list-color my-auto d-lg-block d-md-block d-sm-none d-none">
  233.                                         <i>{% trans %}voir{% endtrans %} + {% trans %}de couleurs{% endtrans %}</i>
  234.                                     </div>
  236.                                     {#                            mobile#}
  237.                                     <div class="list-color-sm d-lg-none d-md-none d-sm-block d-block">
  238.                                         <div class="d-flex">
  239.                                             <div class="one-color-sm">
  240.                                                 <div class="maron-sm"></div>
  241.                                             </div>
  242.                                             <div class="one-color-sm actif-color">
  243.                                                 <div class="gris-sm"></div>
  244.                                             </div>
  245.                                             <div class="one-color-sm">
  246.                                                 <div class="bleue-sm"></div>
  247.                                             </div>
  248.                                             <div class="one-color-sm">
  249.                                                 <div class="jaune-sm"></div>
  250.                                             </div>
  251.                                         </div>
  253.                                         <div class="text-list-color-sm mt-2 text-center my-auto d-lg-none d-md-none d-sm-block d-block">
  254.                                             <i>{% trans %}voir{% endtrans %} + {% trans %}de couleurs{% endtrans %}</i>
  255.                                         </div>
  256.                                     </div>
  258.                                 </div>
  260.                                 <select name="" id="" class="select-fiche mt-1">
  261.                                     <option value="">{% trans %}Options{% endtrans %}</option>
  262.                                     <option value="">Bâche isotherme pour spa (300€)</option>
  263.                                     <option value="">Carte service VIP (499€)</option>
  264.                                     <option value="">Lève-bâche (199€)</option>
  265.                                 </select>
  266.                                 <select name="" id="" class="select-fiche mt-1">
  267.                                     <option value="">{% trans %}Garantie{% endtrans %}</option>
  268.                                     <option value="">Extension garantie 1 (199€)</option>
  269.                                     <option value="">Extension garantie 2 (279€)</option>
  270.                                     <option value="">Carte service VIP (499€)</option>
  271.                                 </select>
  273.                                 <div id="relaxation" class="finition-relaxation on-click mt-1 d-inline-flex">
  274.                                     <div class="col-8">
  275.                                         <p class="mb-1 title-text-finition">{% trans %}Finitions{% endtrans %} <span>{% trans %}Relaxation{% endtrans %}</span></p>
  276.                                         <p class="text-finition mb-0">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum, reprehenderit.</p>
  277.                                     </div>
  278.                                     <div class="col-4 my-bottom text-end">
  279.                                         <p class="price-finition mb-0">+ 150€</p>
  280.                                     </div>
  281.                                 </div>
  283.                                 <div id="intense" class="finition-intense on-click mt-1 d-inline-flex">
  284.                                     <div class="col-8">
  285.                                         <p class="mb-1 title-text-finition">{% trans %}Finitions{% endtrans %} <span>{% trans %}Intense{% endtrans %}</span></p>
  286.                                         <p class="text-finition mb-0">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum, reprehenderit.</p>
  287.                                     </div>
  288.                                     <div class="col-4 my-bottom text-end">
  289.                                         <p class="price-finition mb-0">+ 340€</p>
  290.                                     </div>
  291.                                 </div>
  293.                                 <div id="alu" class="finition-alu on-click mt-1 d-inline-flex">
  294.                                     <div class="col-8">
  295.                                         <p class="mb-1 title-text-finition">{% trans %}Finitions{% endtrans %} <span>{% trans %}Alu-Tech{% endtrans %}</span></p>
  296.                                         <p class="text-finition mb-0">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum, reprehenderit.</p>
  297.                                     </div>
  298.                                     <div class="col-4 my-bottom text-end">
  299.                                         <p class="price-finition mb-0">+ 550€</p>
  300.                                     </div>
  301.                                 </div>
  306.                             </div>
  307.                         </div>
  308.                     </div>
  310.                 </div>
  311.             </div>
  312.             <div class="row mt-3 mb-3 d-lg-flex d-md-flex d-sm-none d-none">
  313.                 <div class="col-lg-6 col-md-6 col-sm-12 col-12 text-end my-auto">
  314.                     <h2 class="fw-600 text-grey-color-used"><i class="text-portail">SPAS</i> {{ current_parent_categorie.getNameLangue(app.request.locale) | upper }}</h2>
  315.                 </div>
  316.                 <div class="col-lg-6 col-md-6 col-sm-12 col-12">
  317.                     <span>{{ current_parent_categorie.getDescriptionsLangue(app.request.locale) }}</span>
  318. {#                    <span>Des spas allant de 4 à 9+ places et dotés d'une qualité rare. Très faciles d'entretiens et toujours d'une qualité sublime, ils sont de compromis parfait entre Luxe et utilitarisme.</span>#}
  319.                 </div>
  320.             </div>
  321.         </div>
  322.     </div>
  326.     <div class="container-fluid bg-black-grey pt-4 pb-4 d-lg-none d-md-none d-sm-block d-block">
  327.         <div class="container pe-5 ps-5">
  328.             <div class="col-12">
  329.                 <button class="w-100 mb-3 panier-button-blue">{% trans %}Ajouter à mon panier{% endtrans %}</button>
  330.             </div>
  331.             <div class="col-12">
  332.                 <button class="w-100 panier-button-white">{% trans %}Ajouter{% endtrans %} {% trans %}au comparateur{% endtrans %}</button>
  333.             </div>
  334.         </div>
  335.     </div>
  340.     <div class="container-fluid background-grey d-lg-block d-md-block d-sm-none d-none">
  341.         <div class="container">
  342.             <div class="row">
  343.                 <div class="col-lg-3 col-md-3 col-sm-6 pt-4 pb-4">
  344.                     <h4 class="port_title-recom">{% trans %}Recomandation{% endtrans %} :</h4>
  345.                 </div>
  346.                 <div class="col-lg-4 col-md-4 col-sm-6 my-bottom">
  347.                     <img width="100%" src="{{ asset("images/img_portail_file_product/bahia-vue-de-profil-44 copie 2.png") }}" alt="bahia">
  348.                 </div>
  349.                 <div class="col-lg-5 col-md-5 col-sm-12 pt-4 pb-4">
  350.                     <div class="text-center d-inline-block">
  351.                         <h4 class="port_title-recom mb-0">Samana Alu-Tech</h4>
  352.                         <p class="port_puissant-compact"><i>{% trans %}Puissant et Compact{% endtrans %}</i></p>
  353.                         <button class="port_button-compare">{% trans %}Comparer{% endtrans %}</button>
  354.                         <p class="mb-0 mt-2"><a href="" class="port_link-savoir">{% trans %}en savoir plus{% endtrans %}</a></p>
  355.                     </div>
  357.                 </div>
  358.             </div>
  359.         </div>
  360.     </div>
  362.     <div class="container-fluid background-black pt-3 pb-3 mt-4 d-lg-block d-md-block d-sm-none d-none">
  363.         <div class="container">
  364.             <div class="text-center">
  365.                 <h2 class="text-white">{% trans %}Contrôle Qualité{% endtrans %} Spa.Biz</h2>
  366.                 <p class="fs-18 text-white">{% trans %}Ayez l'esprit tranquille, nos experts sont la !{% endtrans %}</p>
  367.             </div>
  368.             <div class="d-flex justify-content-center">
  369.                 <div class="col-lg-2 col-md-5 my-auto text-end">
  370.                     <img class="port_img-control" src="{{ asset("images/img_portail_file_product/229.png") }}" alt="control qualité">
  371.                 </div>
  372.                 <div class="col-lg-3 col-md-5">
  373.                     <span class="text-white fs-14">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor, minus! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita, veritatis?</span>
  374.                     <p class="mt-3"><a class="text-white fs-14" href="">{% trans %}en savoir plus{% endtrans %}</a></p>
  375.                 </div>
  376.             </div>
  377.         </div>
  378.     </div>
  380. {% endblock %}
  383. {% block footer %}
  384.     <div class="container-fluid background-grey d-lg-block d-md-block d-sm-none d-none">
  385.         <div class="container pl-0 pr-0">
  386.             <div class="d-flex bd-highlight d-lg-flex d-md-none d-sm-none pb-2 pt-2">
  387.                 <div class="p-2 text-start my-auto"><p class="footer-text mb-0">Copyright &#xA9; 2023</p></div>
  388.                 <div class="p-2 text-center my-auto"><a class="footer-text text-nowrap text-decoration-none" href="#">Cookies</a></div>
  389.                 <div class="p-2 text-center my-auto"><a class="footer-text text-nowrap text-decoration-none" href="#">{% trans %}Condition générales d'utilisation{% endtrans %}</a></div>
  390.                 <div class="p-2 text-center my-auto"><a class="footer-text text-nowrap text-decoration-none" href="#">{% trans %}Vente et remboursement{% endtrans %}</a></div>
  391.                 <div class="p-2 flex-fill text-end my-auto"><a class="footer-text text-nowrap text-decoration-none" href="#">{% trans %}Qui sommes nous ?{% endtrans %}</a></div>
  392.                 <div class="p-2 text-end my-auto"><a class="footer-text text-decoration-none" href="#">{% trans %}Contact{% endtrans %}</a></div>
  393.                 <div class="p-2 my-auto">
  394.                     <div class="d-flex">
  395.                         <div class="flex-fill pr-10">
  396.                             <a class="footer-text" href="#"><img src="{{ asset("/images/logo/social/fb.png") }}" alt="facebook"></a>
  397.                         </div>
  398.                         <div class="flex-fill pr-10">
  399.                             <a class="footer-text" href="#"><img src="{{ asset("/images/logo/social/twt.png") }}" alt="twitter"></a>
  400.                         </div>
  401.                         <div class="flex-fill">
  402.                             <a class="footer-text" href="#"><img src="{{ asset("/images/logo/social/link.png") }}" alt="linkdin"></a>
  403.                         </div>
  404.                     </div>
  405.                 </div>
  406.             </div>
  407.             <div class="d-flex bd-highlight d-lg-none d-md-flex d-sm-none">
  408.                 <div class="p-2 flex-fill"><p class="footer-text mb-0">Copyright &#xA9; 2023</p></div>
  409.                 <div class="p-2 flex-fill"><a class="footer-text text-decoration-none" href="#">{% trans %}Condition générales d'utilisation{% endtrans %}</a></div>
  410.                 <div class="p-2 flex-fill"><a class="footer-text text-decoration-none" href="#">{% trans %}Vente et remboursement{% endtrans %}</a></div>
  411.                 <div class="p-2 flex-fill"><a class="footer-text text-decoration-none" href="#">{% trans %}Qui sommes nous ?{% endtrans %}</a></div>
  412.                 <div class="p-2 flex-fill"><a class="footer-text text-decoration-none" href="#">{% trans %}Contact{% endtrans %}</a><a class="footer-text text-decoration-none d-lg-none d-md-block d-sm-none" href="#">Cookies</a></div>
  413.                 <div class="p-2 flex-fill">
  414.                     <div class="d-flex">
  415.                         <a class="footer-text" href="#"><img src="{{ asset("/images/logo/social/fb.png") }}" alt="facebook"></a>
  416.                         <a class="footer-text" href="#"><img src="{{ asset("/images/logo/social/twt.png") }}" alt="twitter"></a>
  417.                         <a class="footer-text" href="#"><img src="{{ asset("/images/logo/social/link.png") }}" alt="linkdin"></a>
  418.                     </div>
  419.                 </div>
  420.             </div>
  421.         </div>
  422.     </div>
  423. {% endblock %}