templates/front/product/list.html.twig line 1

Open in your IDE?
  1. {% extends 'base_front.html.twig' %}
  3. {% block meta %}
  4.     <title>Les produits disponibles pour votre mariage</title>
  5.     <meta name="description" content="Les produits disponibles. Actuellement, {{ countProducts }} produits disponibles.">
  6. {% endblock %}
  8. {% block style %}
  9.     <link rel="stylesheet" href="{{ asset('css/styleFiltreHebergement.css') }}">
  10. {% endblock %}
  12. {% block body %}
  14.     <!-- Modal filter -->
  15.     
  16.     <div class="modal fade" id="modalFilter" tabindex="-1" role="dialog" aria-labelledby="filterModal" aria-hidden="true" style="padding-right:0">
  17.         <div class="modal-dialog myWidth" role="document">
  18.             <div class="modal-content">
  19.                 <form id="searchForm" method="post" action="{{ path('heb_filtre') }}">
  20.                     <div class="modal-header">
  21.                         <h5 class="modal-title" id="">Filtre hébergement</h5>
  22.                         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  23.                             <span aria-hidden="true">&times;</span>
  24.                         </button>
  25.                     </div>
  26.                     <div class="modal-body">
  27.                         <div class="row">
  28.                             <div class="col-12">
  29.                                 <h3>Filtre prix</h3>
  30.                                 <div class="form-group filtrePrix">
  31.                                     <select name="prix" id="" class="padForFltrePrix">
  32.                                         <option value="moinsCher">Plus cher à moin cher</option>
  33.                                         <option value="plusCher">Moin cher à plus cher</option>
  34.                                     </select>
  35.                                 </div>
  36.                             </div>
  37.                             <div class="col-12">
  38.                                 <h3>Avis</h3>
  39.                                 <div class="form-group filtrePrix">
  40.                                     <select name="avis" id="" class="padForFltrePrix">
  41.                                         <option value="passable">Passable</option>
  42.                                         <option value="bien">Bien</option>
  43.                                         <option value="tbiens">Très bien</option>
  44.                                     </select>
  45.                                 </div>
  46.                             </div>
  47.                             <div class="col-12">
  48.                                 <h3>Type d'hébergement</h3>
  49.                                 <div class="flexRadio" id="cont_choix_type_hebergement">
  50.                                     <div class="custom-checkbox" style="position: relative">
  51.                                         <input type="radio" name="typeHebergement[]" value="maison" id="maison" class="custom-control-input">
  52.                                         <label for="maison" class="custom-control-label" style="margin-left: 25px;">Maison
  53.                                         </label>
  54.                                     </div>
  55.                                     <div class="custom-checkbox" style="position: relative">
  56.                                         <input type="radio" name="typeHebergement[]" value="appartement" id="appartement" class="custom-control-input">
  57.                                         <label for="appartement" class="custom-control-label" style="margin-left: 25px;">Appartement</label>
  58.                                     </div>
  59.                                     <div class="custom-checkbox" style="position: relative">
  60.                                         <input type="radio" name="typeHebergement[]" value="villa" id="villa" class="custom-control-input">
  61.                                         <label for="villa" class="custom-control-label" style="margin-left: 25px;">Villa</label>
  62.                                     </div>
  63.                                     <div class="custom-checkbox" style="position: relative">
  64.                                         <input type="radio" name="typeHebergement[]" value="camping" id="camping" class="custom-control-input">
  65.                                         <label for="camping" class="custom-control-label" style="margin-left: 25px;">Camping</label>
  66.                                     </div>
  67.                                     <div class="custom-checkbox" style="position: relative">
  68.                                         <input type="radio" name="typeHebergement[]" value="hotel" id="hotel" class="custom-control-input">
  69.                                         <label for="hotel" class="custom-control-label" style="margin-left: 25px;">Hôtel</label>
  70.                                     </div>
  71.                                     <div class="custom-checkbox" style="position: relative">
  72.                                         <input type="radio" name="typeHebergement[]" value="bateau" id="bateau" class="custom-control-input">
  73.                                         <label for="bateau" class="custom-control-label" style="margin-left: 25px;">Bateau</label>
  74.                                     </div>
  75.                                     <div class="custom-checkbox" style="position: relative">
  76.                                         <input type="radio" name="typeHebergement[]" value="chalet" id="chalet" class="custom-control-input">
  77.                                         <label for="chalet" class="custom-control-label" style="margin-left: 25px;">Chalet</label>
  78.                                     </div>
  79.                                 </div>
  80.                             </div>
  81.                             <div class="col-12">
  82.                                 <h3>Nombre participants</h3>
  83.                                 <div class="form-group flexRadio">
  84.                                     <input type="radio" name="nbrParticipant" value="" id="allParticipant" class="hideRadio" checked="checked">
  85.                                     <label for="allParticipant" class="labelRadio">Tous</label>
  86.                                     <input type="radio" name="nbrParticipant" value="1" id="oneParicipant" class="hideRadio">
  87.                                     <label for="oneParicipant" class="labelRadio">1</label>
  88.                                     <input type="radio" name="nbrParticipant" value="2" id="tooParicipant" class="hideRadio">
  89.                                     <label for="tooParicipant" class="labelRadio">2</label>
  90.                                     <input type="radio" name="nbrParticipant" value="3" id="3Paricipant"  class="hideRadio">
  91.                                     <label for="3Paricipant" class="labelRadio">3</label>
  92.                                     <input type="radio" name="nbrParticipant" value="4" id="4Paricipant" class="hideRadio">
  93.                                     <label for="4Paricipant" class="labelRadio">4</label>
  94.                                     <input type="radio" name="nbrParticipant" value="5" id="5Paricipant" class="hideRadio">
  95.                                     <label for="5Paricipant" class="labelRadio">5</label>
  96.                                     <input type="radio" name="nbrParticipant" value="6" id="6Paricipant" class="hideRadio">
  97.                                     <label for="6Paricipant" class="labelRadio">6</label>
  98.                                     <input type="radio" name="nbrParticipant" value="7" id="7Paricipant" class="hideRadio">
  99.                                     <label for="7Paricipant" class="labelRadio">7</label>
  100.                                     <input type="radio" name="nbrParticipant" value="8" id="8Paricipant" class="hideRadio">
  101.                                     <label for="8Paricipant" class="labelRadio">8+</label>
  102.                                 </div>
  103.                             </div>
  104.                             <div class="col-12">
  105.                                 <h3>Nombre adultes</h3>
  106.                                 {# (input:radio[name="nbrAdulte"]#$Adulte.hideRadio+label.labelRadio[for="$Adulte"]{$})*8 #}
  107.                                 <div class="form-group flexRadio">
  108.                                     <input type="radio" name="nbrAdulte" value="" id="allAdulte" class="hideRadio" checked="checked">
  109.                                     <label for="allAdulte" class="labelRadio">Tous</label>
  110.                                     <input type="radio" name="nbrAdulte" id="1Adulte" value="1" class="hideRadio">
  111.                                     <label for="1Adulte" class="labelRadio">1</label>
  112.                                     <input type="radio" name="nbrAdulte" id="2Adulte" value="2" class="hideRadio">
  113.                                     <label for="2Adulte" class="labelRadio">2</label>
  114.                                     <input type="radio" name="nbrAdulte" id="3Adulte" value="3" class="hideRadio">
  115.                                     <label for="3Adulte" class="labelRadio">3</label>
  116.                                     <input type="radio" name="nbrAdulte" id="4Adulte" value="4" class="hideRadio">
  117.                                     <label for="4Adulte" class="labelRadio">4</label>
  118.                                     <input type="radio" name="nbrAdulte" id="5Adulte" value="5" class="hideRadio">
  119.                                     <label for="5Adulte" class="labelRadio">5</label>
  120.                                     <input type="radio" name="nbrAdulte" id="6Adulte" value="6" class="hideRadio">
  121.                                     <label for="6Adulte" class="labelRadio">6</label>
  122.                                     <input type="radio" name="nbrAdulte" id="7Adulte" value="7" class="hideRadio">
  123.                                     <label for="7Adulte" class="labelRadio">7</label>
  124.                                     <input type="radio" name="nbrAdulte" id="8Adulte" value="8" class="hideRadio">
  125.                                     <label for="8Adulte" class="labelRadio">8+</label>
  126.                                 </div>
  127.                             </div>
  128.                             <div class="col-12">
  129.                                 <h3>Nombre enfants (entre 2ans et 10ans)</h3>
  130.                                 <div class="form-group flexRadio">
  131.                                     <input type="radio" name="nbrEnfant" value="" id="allEnfant" checked="checked" class="hideRadio">
  132.                                     <label for="allEnfant" class="labelRadio">Tous</label>
  133.                                     <input type="radio" name="nbrEnfant" id="1Enfant" value="1" class="hideRadio">
  134.                                     <label for="1Enfant" class="labelRadio">1</label>
  135.                                     <input type="radio" name="nbrEnfant" id="2Enfant" value="2" class="hideRadio">
  136.                                     <label for="2Enfant" class="labelRadio">2</label>
  137.                                     <input type="radio" name="nbrEnfant" id="3Enfant" value="3" class="hideRadio">
  138.                                     <label for="3Enfant" class="labelRadio">3</label>
  139.                                     <input type="radio" name="nbrEnfant" id="4Enfant" value="4" class="hideRadio">
  140.                                     <label for="4Enfant" class="labelRadio">4</label>
  141.                                     <input type="radio" name="nbrEnfant" id="5Enfant" value="5" class="hideRadio">
  142.                                     <label for="5Enfant" class="labelRadio">5</label>
  143.                                     <input type="radio" name="nbrEnfant" id="6Enfant" value="6" class="hideRadio">
  144.                                     <label for="6Enfant" class="labelRadio">6</label>
  145.                                     <input type="radio" name="nbrEnfant" id="7Enfant" value="7" class="hideRadio">
  146.                                     <label for="7Enfant" class="labelRadio">7</label>
  147.                                     <input type="radio" name="nbrEnfant" id="8Enfant" value="8" class="hideRadio">
  148.                                     <label for="8Enfant" class="labelRadio">8+</label>
  149.                                 </div>
  150.                             </div>
  151.                             <div class="col-12">
  152.                                 <h3>Nombre bébé (0 et 23 mois)</h3>
  153.                                 <div class="form-group flexRadio">
  154.                                     <input type="radio" name="nbrBebe" value="" id="allBebe" class="hideRadio" checked="checked">
  155.                                     <label for="allBebe" class="labelRadio">Tous</label>
  156.                                     <input type="radio" name="nbrBebe" id="1Bebe" value="1" class="hideRadio">
  157.                                     <label for="1Bebe" class="labelRadio">1</label>
  158.                                     <input type="radio" name="nbrBebe" id="2Bebe" value="2" class="hideRadio">
  159.                                     <label for="2Bebe" class="labelRadio">2</label>
  160.                                     <input type="radio" name="nbrBebe" id="3Bebe" value="3" class="hideRadio">
  161.                                     <label for="3Bebe" class="labelRadio">3</label>
  162.                                     <input type="radio" name="nbrBebe" id="4Bebe" value="4" class="hideRadio">
  163.                                     <label for="4Bebe" class="labelRadio">4</label>
  164.                                     <input type="radio" name="nbrBebe" id="5Bebe" value="5" class="hideRadio">
  165.                                     <label for="5Bebe" class="labelRadio">5</label>
  166.                                     <input type="radio" name="nbrBebe" id="6Bebe" value="6" class="hideRadio">
  167.                                     <label for="6Bebe" class="labelRadio">6</label>
  168.                                     <input type="radio" name="nbrBebe" id="7Bebe" value="7" class="hideRadio">
  169.                                     <label for="7Bebe" class="labelRadio">7</label>
  170.                                     <input type="radio" name="nbrBebe" id="8Bebe" value="8" class="hideRadio">
  171.                                     <label for="8Bebe" class="labelRadio">8+</label>
  172.                                 </div>
  173.                             </div>
  174.                             <div class="col-12" id="cont_prix_hotel">
  175.                                 <div class="col-12">
  176.                                     <h3>Prix par nuit (€)</h3>
  177.                                     <div class="form-group">
  178.                                         <range-selector 
  179.                                             min-range="0" 
  180.                                             max-range="2000" 
  181.                                             inputs-for-labels 
  182.                                             slider-color="#FE7708"
  183.                                             circle-border="3px solid #0DE8C7"
  184.                                             circle-focus-border="3px solid #0DE8C7"
  185.                                         />
  186.                                     </div>
  187.                                 </div>
  188.                                 <div class="col-12">
  189.                                     <h3>Prix par séjour (€)</h3>
  190.                                     <div class="form-group">
  191.                                         <range-selector 
  192.                                             min-range="0" 
  193.                                             max-range="2000" 
  194.                                             inputs-for-labels 
  195.                                             slider-color="#FE7708"
  196.                                             circle-border="3px solid #0DE8C7"
  197.                                             circle-focus-border="3px solid #0DE8C7"
  198.                                         />
  199.                                     </div>
  200.                                 </div>
  201.                             </div>
  202.                             <div class="col-12" id="cont_another_rice">
  203.                                 <h3>Prix (€)</h3>
  204.                                 <div class="form-group">
  205.                                     <range-selector 
  206.                                         min-range="0" 
  207.                                         max-range="2000" 
  208.                                         inputs-for-labels 
  209.                                         slider-color="#FE7708"
  210.                                         circle-border="3px solid #0DE8C7"
  211.                                         circle-focus-border="3px solid #0DE8C7"
  212.                                     />
  213.                                 </div>
  214.                             </div>
  215.                             <div class="col-12">
  216.                                 <h3>Nombre de chambres</h3>
  217.                                 <div class="form-group flexRadio">
  218.                                     <input type="radio" name="nbrChambre" value="" id="allChambre" class="hideRadio" checked="checked">
  219.                                     <label for="allChambre" class="labelRadio">Tous</label>
  220.                                     <input type="radio" name="nbrChambre" id="1Chambre" value="1" class="hideRadio">
  221.                                     <label for="1Chambre" class="labelRadio">1</label>
  222.                                     <input type="radio" name="nbrChambre" id="2Chambre" value="2" class="hideRadio">
  223.                                     <label for="2Chambre" class="labelRadio">2</label>
  224.                                     <input type="radio" name="nbrChambre" id="3Chambre" value="3" class="hideRadio">
  225.                                     <label for="3Chambre" class="labelRadio">3</label>
  226.                                     <input type="radio" name="nbrChambre" id="4Chambre" value="4" class="hideRadio">
  227.                                     <label for="4Chambre" class="labelRadio">4</label>
  228.                                     <input type="radio" name="nbrChambre" id="5Chambre" value="5" class="hideRadio">
  229.                                     <label for="5Chambre" class="labelRadio">5</label>
  230.                                     <input type="radio" name="nbrChambre" id="6Chambre" value="6" class="hideRadio">
  231.                                     <label for="6Chambre" class="labelRadio">6+</label>
  232.                                 </div>
  233.                             </div>
  234.                             <div class="col-12">
  235.                                 <h3>Nombre de lits</h3>
  236.                                 <div class="form-group flexRadio">
  237.                                     <input type="radio" name="nbrChambreLits" id="allLits" class="hideRadio" checked="checked">
  238.                                     <label for="allLits" class="labelRadio">Tous</label>
  239.                                     <input type="radio" name="nbrChambreLits" id="1Lits" value="1" class="hideRadio">
  240.                                     <label for="1Lits" class="labelRadio">1</label>
  241.                                     <input type="radio" name="nbrChambreLits" id="2Lits" value="2" class="hideRadio">
  242.                                     <label for="2Lits" class="labelRadio">2</label>
  243.                                     <input type="radio" name="nbrChambreLits" id="3Lits" value="3" class="hideRadio">
  244.                                     <label for="3Lits" class="labelRadio">3</label>
  245.                                     <input type="radio" name="nbrChambreLits" id="4Lits" value="4" class="hideRadio">
  246.                                     <label for="4Lits" class="labelRadio">4</label>
  247.                                     <input type="radio" name="nbrChambreLits" id="5Lits" value="5" class="hideRadio">
  248.                                     <label for="5Lits" class="labelRadio">5</label>
  249.                                     <input type="radio" name="nbrChambreLits" id="6Lits" value="6" class="hideRadio">
  250.                                     <label for="6Lits" class="labelRadio">6+</label>
  251.                                 </div>
  252.                             </div>
  253.                             <div class="col-12">
  254.                                 <h3>Equipements</h3>
  255.                                 {# (div.custom-checkbox[style="position: relative"]>input:checkbox#.custom-control-input[name="equipements"]+label.custom-control-label[style="margin-left: 25px;"]{})*3 #}
  256.                                 <div class="flexRadio">
  257.                                     <div class="custom-checkbox" style="position: relative">
  258.                                         <input type="checkbox" name="equipements[]" id="wifi" value="wifi" class="custom-control-input">
  259.                                         <label for="wifi" class="custom-control-label" style="margin-left: 25px;">Wifi
  260.                                         </label>
  261.                                     </div>
  262.                                     <div class="custom-checkbox" style="position: relative">
  263.                                         <input type="checkbox" name="equipements[]" id="climatisation" value="climatisation" class="custom-control-input">
  264.                                         <label for="climatisation" class="custom-control-label" style="margin-left: 25px;">Climatisation</label>
  265.                                     </div>
  266.                                     <div class="custom-checkbox" style="position: relative">
  267.                                         <input type="checkbox" name="equipements[]" id="laveLinge" value="laveLinge" class="custom-control-input">
  268.                                         <label for="laveLinge" class="custom-control-label" style="margin-left: 25px;">Lave linge</label>
  269.                                     </div>
  270.                                     <div class="custom-checkbox" style="position: relative">
  271.                                         <input type="checkbox" name="equipements[]" id="secheLinge" value="secheLinge" class="custom-control-input">
  272.                                         <label for="secheLinge" class="custom-control-label" style="margin-left: 25px;">Sèche linge</label>
  273.                                     </div>
  274.                                     <div class="custom-checkbox" style="position: relative">
  275.                                         <input type="checkbox" name="equipements[]" id="laveVaisselle" value="laveVaisselle" class="custom-control-input">
  276.                                         <label for="laveVaisselle" class="custom-control-label" style="margin-left: 25px;">Lave vaisselle</label>
  277.                                     </div>
  278.                                     <div class="custom-checkbox" style="position: relative">
  279.                                         <input type="checkbox" name="equipements[]" id="television" value="television" class="custom-control-input">
  280.                                         <label for="television" class="custom-control-label" style="margin-left: 25px;">Télévision</label>
  281.                                     </div>
  282.                                     <div class="custom-checkbox" style="position: relative">
  283.                                         <input type="checkbox" name="equipements[]" id="ferARepasser" value="ferARepasser" class="custom-control-input">
  284.                                         <label for="ferARepasser" class="custom-control-label" style="margin-left: 25px;">Fer à repasser</label>
  285.                                     </div>
  286.                                     <div class="custom-checkbox" style="position: relative">
  287.                                         <input type="checkbox" name="equipements[]" id="four" value="four" class="custom-control-input">
  288.                                         <label for="four" class="custom-control-label" style="margin-left: 25px;">Four</label>
  289.                                     </div>
  290.                                     <div class="custom-checkbox" style="position: relative">
  291.                                         <input type="checkbox" name="equipements[]" id="litBebe" value="litBebe" class="custom-control-input">
  292.                                         <label for="litBebe" class="custom-control-label" style="margin-left: 25px;">Lit bébé</label>
  293.                                     </div>
  294.                                     <div class="custom-checkbox" style="position: relative">
  295.                                         <input type="checkbox" name="equipements[]" id="chaiseHaute" value="chaiseHaute" class="custom-control-input">
  296.                                         <label for="chaiseHaute" class="custom-control-label" style="margin-left: 25px;">Chaise haute</label>
  297.                                     </div>
  298.                                     <div class="custom-checkbox" style="position: relative">
  299.                                         <input type="checkbox" name="equipements[]" id="lingeDeMaison" value="lingeDeMaison" class="custom-control-input">
  300.                                         <label for="lingeDeMaison" class="custom-control-label" style="margin-left: 25px;">Linge de maison fourni</label>
  301.                                     </div>
  302.                                     <div class="custom-checkbox" style="position: relative">
  303.                                         <input type="checkbox" name="equipements[]" id="cuisineSeparee" value="cuisineSeparee" class="custom-control-input">
  304.                                         <label for="cuisineSeparee" class="custom-control-label" style="margin-left: 25px;">Cuisine séparée</label>
  305.                                     </div>
  306.                                 </div>
  307.                             </div>
  308.                             <div class="col-12">
  309.                                 <h3>Confort</h3>
  310.                                 <div class="flexRadio">
  311.                                     <div class="custom-checkbox" style="position: relative">
  312.                                         <input type="checkbox" name="caracteristique[]" id="piscine" value="piscine" class="custom-control-input">
  313.                                         <label for="piscine" class="custom-control-label" style="margin-left: 25px;">Piscine</label>
  314.                                     </div>
  315.                                     <div class="custom-checkbox" style="position: relative">
  316.                                         <input type="checkbox" name="caracteristique[]" id="jacuzzi" value="jacuzzi" class="custom-control-input">
  317.                                         <label for="jacuzzi" class="custom-control-label" style="margin-left: 25px;">Jacuzzi</label>
  318.                                     </div>
  319.                                     <div class="custom-checkbox" style="position: relative">
  320.                                         <input type="checkbox" name="caracteristique[]" id="terrasse" value="terrasse" class="custom-control-input">
  321.                                         <label for="terrasse" class="custom-control-label" style="margin-left: 25px;">Terrasse</label>
  322.                                     </div>
  323.                                     <div class="custom-checkbox" style="position: relative">
  324.                                         <input type="checkbox" name="caracteristique[]" id="balcon" value="balcon" class="custom-control-input">
  325.                                         <label for="balcon" class="custom-control-label" style="margin-left: 25px;">Balcon</label>
  326.                                     </div>
  327.                                     <div class="custom-checkbox" style="position: relative">
  328.                                         <input type="checkbox" name="caracteristique[]" id="jardin" value="jardin" class="custom-control-input">
  329.                                         <label for="jardin" class="custom-control-label" style="margin-left: 25px;">Jardin</label>
  330.                                     </div>
  331.                                     <div class="custom-checkbox" style="position: relative">
  332.                                         <input type="checkbox" name="caracteristique[]" id="animal" value="animal" class="custom-control-input">
  333.                                         <label for="animal" class="custom-control-label" style="margin-left: 25px;">Animal domestique accepté</label>
  334.                                     </div>
  335.                                     <div class="custom-checkbox" style="position: relative">
  336.                                         <input type="checkbox" name="caracteristique[]" id="parking" value="parking" class="custom-control-input">
  337.                                         <label for="parking" class="custom-control-label" style="margin-left: 25px;">Parking</label>
  338.                                     </div>
  339.                                     <div class="custom-checkbox" style="position: relative">
  340.                                         <input type="checkbox" name="caracteristique[]" id="accesHandicapee" value="accesHandicapee" class="custom-control-input">
  341.                                         <label for="accesHandicapee" class="custom-control-label" style="margin-left: 25px;">Accès handicapés</label>
  342.                                     </div>
  343.                                 </div>
  344.                             </div>
  345.                             <div class="col-12">
  346.                                 <h3>Localisation</h3>
  347.                                 <div class="flexRadio">
  348.                                     <div class="custom-checkbox" style="position: relative">
  349.                                         <input type="checkbox" name="localisation[]" id="bordDeMer" value="bord-de-mer" class="custom-control-input">
  350.                                         <label for="bordDeMer" class="custom-control-label" style="margin-left: 25px;">Bord de mer</label>
  351.                                     </div>
  352.                                     <div class="custom-checkbox" style="position: relative">
  353.                                         <input type="checkbox" name="localisation[]" id="centreVille" value="centre-ville" class="custom-control-input">
  354.                                         <label for="centreVille" class="custom-control-label" style="margin-left: 25px;">Centre ville</label>
  355.                                     </div>
  356.                                     <div class="custom-checkbox" style="position: relative">
  357.                                         <input type="checkbox" name="localisation[]" id="bordDePlage" value="bord-de-plage" class="custom-control-input">
  358.                                         <label for="bordDePlage" class="custom-control-label" style="margin-left: 25px;">Bord de plage</label>
  359.                                     </div>
  360.                                     <div class="custom-checkbox" style="position: relative">
  361.                                         <input type="checkbox" name="localisation[]" id="vueMer" value="vue-mer" class="custom-control-input">
  362.                                         <label for="vueMer" class="custom-control-label" style="margin-left: 25px;">Vue mer</label>
  363.                                     </div>
  364.                                     <div class="custom-checkbox" style="position: relative">
  365.                                         <input type="checkbox" name="localisation[]" id="campagne" value="campagne" class="custom-control-input">
  366.                                         <label for="campagne" class="custom-control-label" style="margin-left: 25px;">Campagne</label>
  367.                                     </div>
  368.                                     <div class="custom-checkbox" style="position: relative">
  369.                                         <input type="checkbox" name="localisation[]" id="montagne" value="montagne" class="custom-control-input">
  370.                                         <label for="montagne" class="custom-control-label" style="margin-left: 25px;">Montagne</label>
  371.                                     </div>
  372.                                 </div>
  373.                             </div>
  374.                             <div class="col-12">
  375.                                 <h3>Sécurité</h3>
  376.                                 <div class="flexRadio">
  377.                                     <div class="custom-checkbox" style="position: relative">
  378.                                         <input type="checkbox" name="securite[]" id="detecteurDeFumee" value="detecteur-de-fumee" class="custom-control-input">
  379.                                         <label for="detecteurDeFumee" class="custom-control-label" style="margin-left: 25px;">Détecteur de fumée</label>
  380.                                     </div>
  381.                                     <div class="custom-checkbox" style="position: relative">
  382.                                         <input type="checkbox" name="securite[]" id="detecteurDeMonoxydeDeCarbone" value="detecteur-de-monoxyde-de-carbone" class="custom-control-input">
  383.                                         <label for="detecteurDeMonoxydeDeCarbone" class="custom-control-label" style="margin-left: 25px;">Détecteur de monoxyde de carbone</label>
  384.                                     </div>
  385.                                 </div>
  386.                             </div>
  387.                             <div class="col-12">
  388.                                 <h3>Langue du propriétaire</h3>
  389.                                 <div class="flexRadio">
  390.                                     <div class="custom-checkbox" style="position: relative">
  391.                                         <input type="checkbox" name="langue[]" id="francais" value="francais" class="custom-control-input">
  392.                                         <label for="francais" class="custom-control-label" style="margin-left: 25px;">Français</label>
  393.                                     </div>
  394.                                     <div class="custom-checkbox" style="position: relative">
  395.                                         <input type="checkbox" name="langue[]" id="anglais" value="anglais" class="custom-control-input">
  396.                                         <label for="anglais" class="custom-control-label" style="margin-left: 25px;">Anglais</label>
  397.                                     </div>
  398.                                     <div class="custom-checkbox" style="position: relative">
  399.                                         <input type="checkbox" name="langue[]" id="allemend" value="allemend" class="custom-control-input">
  400.                                         <label for="allemend" class="custom-control-label" style="margin-left: 25px;">Allemand</label>
  401.                                     </div>
  402.                                     <div class="custom-checkbox" style="position: relative">
  403.                                         <input type="checkbox" name="langue[]" id="espagnol" value="espagnol" class="custom-control-input">
  404.                                         <label for="espagnol" class="custom-control-label" style="margin-left: 25px;">Espagnol</label>
  405.                                     </div>
  406.                                     <div class="custom-checkbox" style="position: relative">
  407.                                         <input type="checkbox" name="langue[]" id="italien" value="italien" class="custom-control-input">
  408.                                         <label for="italien" class="custom-control-label" style="margin-left: 25px;">Italien</label>
  409.                                     </div>
  410.                                     <div class="custom-checkbox" style="position: relative">
  411.                                         <input type="checkbox" name="langue[]" id="russe" value="russe" class="custom-control-input">
  412.                                         <label for="russe" class="custom-control-label" style="margin-left: 25px;">Russe</label>
  413.                                     </div>
  414.                                 </div>
  415.                             </div>
  416.                         </div>
  417.                     </div>
  418.                     <div class="modal-footer">
  419.                         <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
  420.                         <button type="submit" class="btn btn-primary" id="" onclick="">Afficher</button>
  421.                     </div>
  422.                 </form>
  423.             </div>
  424.         </div>
  425.     </div>
  426.     <!-- Fin Modal filter -->
  428.     <div class="page-header heor-section-style" style="
  429.             height: 100%;
  430.             {% if categoryBackground is defined and categoryBackground is not null and categoryBackground.image is not null %}
  431.                 background: url({{ asset(constant('App\\Services\\File::IMAGE_CATEGORY_DIR') ~ categoryBackground.image) }})
  432.             {% else %}
  433.                 background: url({{ asset('images/vacance_background.jpg') }})
  434.             {% endif %}
  435.             no-repeat center;background-size: cover">
  436.         <div class="container">
  437.             <div
  438.                 class="row">
  439.                 <!-- page caption -->
  440.                 <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 ">
  441.                     <div class="page-caption">
  442.                         <h1 class="page-title">Services</h1>
  443.                     </div>
  444.                 </div>
  445.                 <!-- /.page caption -->
  446.             </div>
  447.         </div>
  448.         <!-- page caption -->
  449.         <div class="page-breadcrumb">
  450.             <div class="container">
  451.                 <div class="row">
  452.                     <nav aria-label="breadcrumb">
  453.                         <ol class="breadcrumb">
  454.                             <li class="breadcrumb-item">
  455.                                 <a href="{{ path('front_home') }}" class="breadcrumb-link">Accueil</a>
  456.                             </li>
  457.                             <li class="breadcrumb-item active text-white" aria-current="page">Recherche :
  458.                                 {% if app.session.get('categoryName') %}
  459.                                     {{ app.session.get('categoryName') }}
  460.                                 {% endif %}
  461.                                 {% if app.session.get('departmentName') %}-
  462.                                     {{ app.session.get('departmentName') }}
  463.                                 {% endif %}
  464.                                 {% if app.session.get('weddingdate') %}-
  465.                                     {{ app.session.get('weddingdate') }}
  466.                                 {% endif %}
  467.                             </li>
  468.                         </ol>
  469.                     </nav>
  470.                 </div>
  471.             </div>
  472.         </div>
  473.         <!-- page breadcrumb -->
  474.     </div>
  475.     <!-- /.page-header -->
  476.     <!-- vendor-section -->
  477.     <div class="content">
  478.         <div class="container">
  479.             <div class="row">
  480.                 <div
  481.                     {% if subcategory.subCategorySlug != "hebergements" %}  {# test if category is hebergments make full container #}
  482.                         class="col-xl-8 col-lg-8 col-md-7 col-sm-12 col-12"
  483.                     {% else %}
  484.                         class="col-12"
  485.                     {% endif %}
  486.                     >
  487.                     {% for message in app.flashes('success') %}
  488.                         <div class="alert alert-success">
  489.                             {{ message }}
  490.                         </div>
  491.                     {% endfor %}
  492.                     <div class="row">
  493.                         {% if products|length > 0 %}
  494.                         <div class="col-12">
  495.                         {# data-toggle="modal" data-target="#modalFilter" #}
  496.                             {% if subcategory.subCategorySlug == "hebergements" %}
  497.                             <button type="button" class="btn btn-primary mb-2" onClick="showModal()">Filter</button>
  498.                             {% endif %}
  499.                         </div>
  500.                         {% endif %}
  501.                     </div>
  502.                     <div id="allProduct" class="row">
  503.                         {% if products|length > 0 %}
  504.                         {# <div class="col-12">
  505.                             <button type="button" class="btn btn-primary mb-2" data-toggle="modal" data-target="#modalFilter">Filter</button>
  506.                         </div> #}
  507.                             {% for product in products %}
  508.                                 {% if product.isActivated and product.isDesactivatedByAdmin == false %}
  509.                                 
  510.                                     {% set subCategorySlug = product.subCategories.toArray()[0].subCategorySlug %}
  511.                                     <div
  512.                                         {% if subcategory.subCategorySlug != "hebergements" %} {# test if category is hebergments make 3 colones #}
  513.                                             class="col-lg-6 col-sm-12 col-12"
  514.                                         {% else %}
  515.                                             class="col-lg-4 col-sm-12 col-12"
  516.                                         {% endif %}
  517.                                     >
  518.                                         <div class="container-block-Pcompanies mb-3">
  519.                                             {# <div class="container-imageP zoomimg"> #}
  520.                                             <div class="container-slide-image">
  521.                                                 {% if product.photos.first != false %}
  522.                                                     {% for imgHebmt in product.photos.toArray() %}
  523.                                                         <img src="{{ asset(constant('App\\Services\\File::IMAGE_PRODUCT_DIR') ~ imgHebmt.url) }}" alt="default image" class="img-fluid" style="height: 213px;object-fit: cover; border-radius: .5rem .5rem 0 0;">
  524.                                                     {% endfor %}
  525.                                                 {% else %}
  526.                                                     <img src="{{ asset('images/vecteezy_vector-gear-logo-design-with-multi-colors-range_6172776.jpg') }}" alt="default image" class="img-fluid" style="height: 213px;object-fit: cover; border-radius: .5rem .5rem 0 0;">
  527.                                                 {% endif %}
  528.                                             </div>
  529.                                             <div class="container-info-presta" style="padding-bottom: 80px;">
  530.                                                 <h2 class="vendor-title">
  531.                                                     {# <a href="{{ path('front_product_single', {'slug': product.subCategories[0].categories[0].slug, 'subCategorySlug': product.subCategories[0].subCategorySlug, 'product_id': product.id, 'productSlug': product.productSlug}) }}" class="title">{{ product.name }}</a> #}
  533.                                                     {% set subCategory = product.subCategories.toArray()[0] %}
  534.                                                     {# <pre>
  535.                                                         {{ dump(subCategory.categories.toArray[0].slug) }}
  536.                                                     </pre> #}
  538.                                                     {% set slug = "" %}
  539.                                                     {% if product.typeActivity is not null %}
  540.                                                         {% set slug = product.typeActivity.slug %}
  541.                                                     {% elseif product.typeHebergements is not null %}
  542.                                                         {% set slug = product.typeHebergements.slugTypeHebergm %}
  543.                                                     {% else %}
  544.                                                         {% set slug = subCategory.categories.toArray[0].slug %}
  545.                                                     {% endif %}
  546.                                                     
  548.                                                     <a href="{{ path('front_product_single', {
  549.                                                         'slug': slug,
  550.                                                         'subCategorySlug': subCategory.subCategorySlug,
  551.                                                         'product_id': product.id,
  552.                                                         'productSlug': product.productSlug
  553.                                                     }) }}" class="title">{{ product.name }}</a>
  554.                                                 
  555.                                                 </h2>
  556.                                                 <p class="vendor-address">
  557.                                                     {% for department in product.departments %}
  558.                                                         {{ department.name }}
  559.                                                         {% if not loop.last %},
  560.                                                         {% endif %}
  561.                                                     {% else %}
  562.                                                         Toute la France
  563.                                                     {% endfor %}
  564.                                                 </p>
  565.                                                 <p>
  566.                                                     {% if product.typeHebergements is null or product.typeHebergements.slugTypeHebergm != 'hotel' %}
  567.                                                         <i class="fas fa-money-bill-wave"></i>
  568.                                                         Prix :
  569.                                                             {% set today = "now"|date('Y-m-d') %}
  570.                                                             {% set customPriceFound = false %}
  571.                                                             {% set customPrice = 0 %}
  572.                                                             {% set currentPrice = 0 %}
  573.                                                             {% set price = 0 %}
  574.                                                             {% set difference = null %}
  575.                                                             {% set reductionPercentage = 0 %}
  576.                                                             {% set duration = null %}
  577.                                                             {% set countdown = null %}
  578.                                                             {% set reductionValid = false %}
  579.                                                             
  580.                                                             {% for dayPrice in product.dayPrice %}
  581.                                                                 {% set formattedDate = dayPrice.customDate|date('Y-m-d') %}
  582.                                                                 {% if formattedDate == today %}
  583.                                                                     {% set customPriceFound = true %}
  584.                                                                     {% set customPrice = dayPrice.customPrice|number_format(2, '.') %}
  585.                                                                 {% endif %}
  586.                                                             {% endfor %}
  587.                                                             {% set month = "now"|date('n') %}
  588.                                                             {% if month >= 3 and month <= 5 %}
  589.                                                                 {% set springPrice = product.springPrice %}
  590.                                                                 {% if springPrice is not null %}
  591.                                                                     {% set currentPrice = product.springPrice %}
  592.                                                                 {% else %}
  593.                                                                     {% set currentPrice = 0 %}                                                                
  594.                                                                 {% endif %}
  595.                                                             {% elseif month >= 6 and month <= 8 %}
  596.                                                                 {% set summerPrice = product.summerPrice %}
  597.                                                                 {% if summerPrice is not null %}
  598.                                                                     {% set currentPrice = product.summerPrice %}
  599.                                                                 {% else %}
  600.                                                                     {% set currentPrice = 0 %}                                                                
  601.                                                                 {% endif %}
  602.                                                             {% elseif month >= 9 and month <= 11 %}
  603.                                                                 {% set autumnPrice = product.autumnPrice %}
  604.                                                                 {% if autumnPrice is not null %}
  605.                                                                     {% set currentPrice = product.autumnPrice %}
  606.                                                                 {% else %}
  607.                                                                     {% set currentPrice = 0 %}                                                                
  608.                                                                 {% endif %}
  609.                                                             {% else %}
  610.                                                                 {% set winterPrice = product.winterPrice %}
  611.                                                                 {% if winterPrice is not null %}
  612.                                                                     {% set currentPrice = product.winterPrice %}
  613.                                                                 {% else %}
  614.                                                                     {% set currentPrice = 0 %}                                                                
  615.                                                                 {% endif %}
  616.                                                             {% endif %}
  617.                                                             {% set day = "now"|date('N') %}
  618.                                                             {% if day == 6 or day == 7 %}
  619.                                                                 {% set weekEndPrice = product.weekEndPrice %}
  620.                                                                 {% if weekEndPrice is not null %}
  621.                                                                     {% set currentPrice = product.weekEndPrice %}    
  622.                                                                 {% else %}
  623.                                                                     {% set currentPrice = 0 %}                                                            
  624.                                                                 {% endif %}
  625.                                                             {% endif %}
  626.                                                             
  627.                                                             {% set periodPrice = 0 %}
  628.                                                             {% for period in product.periodPrice.toArray() %}
  629.                                                                 {% set startDate = period.startDate|date("Y-m-d") %}
  630.                                                                 {% set endDate = period.endDate|date("Y-m-d") %}
  631.                                                                 {% if today >= startDate and today <= endDate and period.price is not null %}
  632.                                                                     {% set periodPrice = period.price %}
  633.                                                                 {% else %}
  634.                                                                     {% set currentPrice = 0 %}
  635.                                                                 {% endif %}
  636.                                                             {% endfor %}
  637.                                                             {% if periodPrice != 0 %}
  638.                                                                 {% set currentPrice = periodPrice %}
  639.                                                             {% endif %}
  640.                                                             
  641.                                                             {% if customPriceFound and customPrice != 0 %}
  642.                                                                 {% set price = customPrice %}
  643.                                                             {% elseif currentPrice != 0 and currentPrice is not null and customPrice == 0 %}
  644.                                                                 {% set price = currentPrice %}
  645.                                                             {% elseif currentPrice == 0 or currentPrice is null and customPrice == 0 %}
  646.                                                                 {% set price = product.price %}
  647.                                                             {% endif %}
  648.                                                              
  649.                                                             {% for autoReduce in product.productAutoReduction.toArray %}
  650.                                                                 {% if autoReduce.createdAt is not null and autoReduce.countdown is not null and autoReduce.duration is not null  and autoReduce.reductionPercentage is not null %}
  651.                                                                     {% set difference = date(today).diff(autoReduce.createdAt).days %}
  652.                                                                     {% set duration = autoReduce.duration %}
  653.                                                                     {% set countdown = autoReduce.countdown %}
  654.                                                                     {% set reductionPercentage = autoReduce.reductionPercentage %}
  655.                                                                     {% set durationout = duration + countdown %}
  656.                                                                     {# {{ dump(countdown,difference,durationout,duration) }} #}
  657.                                                                     {% set reductionValid = difference > countdown and difference <= durationout %}
  658.                                                                 {% endif %}
  659.                                                             {% endfor %}
  660.                                                             {# {{ dump(reductionValid) }} #}
  661.                                                             {% if reductionValid %}
  662.                                                                 {% set priceReduced = price - ((price * reductionPercentage) / 100) %}
  663.                                                                 <strong>{{ priceReduced|number_format(2, '.') }}</strong>€                                                            
  664.                                                             {% else %}
  665.                                                                 <strong>{{ price|number_format(2, '.') }}</strong>€
  666.                                                             {% endif %}
  667.                                                     {% else %}
  668.                                                         {% set lengthRoomNight = 0 %}
  669.                                                         {% set statusByNight = false %}
  670.                                                         {% set allPriceByNight = 0 %}
  672.                                                         {% set lengthRoomDay = 0 %}
  673.                                                         {% set statusByDay = false %}
  674.                                                         {% set allPriceByDay = 0 %}
  675.                                                         {% if product.chambres is defined %}
  676.                                                             {% for roomOption in product.chambres.toArray %}
  677.                                                                 {% if roomOption.tarifNuit is defined %}
  678.                                                                     {% set lengthRoomNight = lengthRoomNight + 1 %}
  679.                                                                     {% set statusByNight = true %}
  680.                                                                     {% set allPriceByNight = allPriceByNight + roomOption.tarifNuit %}
  681.                                                                 {% endif %}
  682.                                                                 {% if roomOption.tarifJour is not null %}
  683.                                                                     {% set lengthRoomDay = lengthRoomDay + 1 %}
  684.                                                                     {% set statusByDay = true %}
  685.                                                                     {% set allPriceByDay = allPriceByDay + roomOption.tarifJour %}
  686.                                                                 {% endif %}
  688.                                                             {% endfor %}
  689.                                                             {% if statusByDay or statusByNight %}
  690.                                                                 <p>Prix moyen d'une chambre:</p>
  691.                                                             {% endif %}
  692.                                                             {% if statusByNight %}
  693.                                                                 <p>
  694.                                                                     <i class="fas fa-money-bill-wave"></i>
  695.                                                                     par nuit 
  696.                                                                     <strong>{{ (allPriceByNight / lengthRoomNight)|number_format(2, '.') }}</strong>€
  697.                                                                 </p>
  698.                                                             {% endif %}
  699.                                                             {% if statusByDay %}
  700.                                                                 {# <p>
  701.                                                                     <i class="fas fa-money-bill-wave"></i>
  702.                                                                     par jour 
  703.                                                                     <strong>{{ (allPriceByDay / lengthRoomDay)|number_format(2, '.') }}</strong>€
  704.                                                                 </p> #}
  705.                                                             {% endif %}
  706.                                                         {% endif %}
  707.                                                         {% if not statusByNight and not statusByDay %}
  708.                                                             <p>
  709.                                                                 Prix : <strong>Prix en attente</strong>
  710.                                                             </p>
  711.                                                         {% endif %}
  712.                                                         {# <i class="fas fa-money-bill-wave"></i>
  713.                                                         Prix :
  714.                                                         <strong>{{ product.price|number_format(2, '.') }}</strong>€ #}
  715.                                                     {% endif %}
  716.                                                 </p>
  717.                                                 <p>
  718.                                                     <i class="fa fa-star rated"></i>
  719.                                                     {% set notes = 0 %}
  720.                                                     {% for avi in product.avis %}
  721.                                                         {% set notes = notes + avi.globalNote %}
  722.                                                     {% endfor %}
  723.                                                     {% set noteTotal = (notes > 0) ? notes / product.avis|length : 0 %}
  724.                                                     {{ product.avis|length }} Avis</p>
  725.                                                 <p>{{ product.quantity }}
  726.                                                     Quantité restante</p>
  727.                                             </div>
  728.                                             <div class="wishlist-sign">
  729.                                                 <a href="#" class="btn-wishlist">
  730.                                                     <i class="fa fa-heart"></i>
  731.                                                 </a>
  732.                                             </div>
  733.                                             {% if product.subCategories[0].categories[0] is defined %}
  734.                                                 <a href="{{ path('front_product_single', {
  735.                                                     'slug': slug, 
  736.                                                     'subCategorySlug': product.subCategories[0].subCategorySlug, 
  737.                                                     'product_id': product.id, 
  738.                                                     'productSlug': product.productSlug
  739.                                                 }) }}" class="title">
  740.                                             
  741.                                                 <button class="btnVoirP btn">Voir {% if subCategorySlug == "hebergements"%}l'hébergement{% else %}plus{% endif %}
  742.                                                     </button>
  743.                                             
  744.                                                 </a>
  745.                                             {% endif %}
  746.                                             
  747.                                         </div>
  748.                                     </div>
  749.                                 {% endif %}
  750.                             {% endfor %}
  751.                         {% else %}
  752.                             <div class="col-12">
  753.                                 <button type="button" class="btn btn-primary mb-2" data-toggle="modal" data-target="#modalFilter">Filter</button>
  754.                             </div>
  755.                             <div class="vendor-thumbnail list-view p-4">Aucun service correspondant</div>
  756.                         {% endif %}
  757.                     </div>
  759.                     {# {% for product in products %}
  760.                         <div
  761.                             class="vendor-thumbnail list-view">
  762.                             <!-- Vendor thumbnail -->
  763.                             <div class="row">
  764.                                 <div
  765.                                     class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 border-right pr-0 zoom-img">
  767.                                     {# <div class="vendor-img" style="background:url({% if product.photos is not empty %}{{ asset(constant('App\\Services\\File::IMAGE_PRODUCT_DIR') ~ product.photos.first.url) }} {% else %}{{ asset('images/illustration-default.jpg') }}{% endif %})no-repeat center;background-size:cover;height:100%">
  769.                                     {% if product.photos.first != false %}
  770.                                         <div
  771.                                             class="vendor-img" style="background:url({{ asset(constant('App\\Services\\File::IMAGE_PRODUCT_DIR') ~ product.photos.first.url) }})no-repeat center;background-size:cover;height:100%">
  773.                                             <!-- Vendor img -->
  774.                                             <a href="{{ path('front_product_single', {'slug': product.subCategories[0].categories[0].slug, 'subCategorySlug': product.subCategories[0].subCategorySlug, 'product_id': product.id, 'productSlug': product.productSlug}) }}">
  775.                                                 <div style="height:100%;width:100%"></div>
  776.                                             </a>
  777.                                             <div class="wishlist-sign">
  778.                                                 {% if app.user and app.user.roles == ['ROLE_USER'] %}
  779.                                                     {% set isWish = filter_service.getIfIsWish(app.user, product) %}
  780.                                                     {% if isWish %}
  781.                                                         <a href="#" class="btn-wishlist" style="background-color:#ff4d4d;">
  782.                                                             <i class="fa fa-heart" style="color:#fff"></i>
  783.                                                         </a>
  784.                                                     {% else %}
  785.                                                         <a href="#" class="btn-wishlist">
  786.                                                             <i class="fa fa-heart"></i>
  787.                                                         </a>
  788.                                                     {% endif %}
  789.                                                 {% endif %}
  790.                                             </div>
  792.                                         </div>
  793.                                     {% else %}
  794.                                         <div
  795.                                             class="vendor-img" style="background:url({{ asset(constant('App\\Services\\File::IMAGE_PRODUCT_DIR') ~ 'photographe-mariage-forfait-4') }})no-repeat center;background-size:cover;height:100%">
  796.                                             <!-- Vendor img -->
  797.                                             <a href="{{ path('front_product_single', {'slug': product.subCategories[0].categories[0].slug, 'subCategorySlug': product.subCategories[0].subCategorySlug, 'product_id': product.id, 'productSlug': product.productSlug}) }}">
  798.                                                 <div style="height:100%;width:100%"></div>
  799.                                             </a>
  800.                                             <div class="wishlist-sign">
  801.                                                 {% if app.user and app.user.roles == ['ROLE_USER'] %}
  802.                                                     {% set isWish = filter_service.getIfIsWish(app.user, product) %}
  803.                                                     {% if isWish %}
  804.                                                         <a href="#" class="btn-wishlist" style="background-color:#ff4d4d;">
  805.                                                             <i class="fa fa-heart" style="color:#fff"></i>
  806.                                                         </a>
  807.                                                     {% else %}
  808.                                                         <a href="#" class="btn-wishlist">
  809.                                                             <i class="fa fa-heart"></i>
  810.                                                         </a>
  811.                                                     {% endif %}
  812.                                                 {% endif %}
  813.                                             </div>
  814.                                         </div>
  815.                                     {% endif %}
  816.                                 </div>
  817.                                 <!-- /.Vendor img -->
  818.                                 <div class="col-xl-8 col-lg-8 col-md-12 col-sm-12 col-12 pl-0">
  819.                                     <div
  820.                                         class="vendor-content">
  821.                                         <!-- Vendor Content -->
  822.                                         <h2 class="vendor-title">
  823.                                             <a href="{{ path('front_product_single', {'slug': product.subCategories[0].categories[0].slug, 'subCategorySlug': product.subCategories[0].subCategorySlug, 'product_id': product.id, 'productSlug': product.productSlug}) }}" class="title">{{ product.name }}</a>
  824.                                         </h2>
  825.                                         <p class="vendor-address">
  826.                                             {% for department in product.departments %}
  827.                                                 {{ department.name }}
  828.                                                 {% if not loop.last %},
  829.                                                 {% endif %}
  830.                                             {% else %}
  831.                                                 Toute la France
  832.                                             {% endfor %}
  833.                                         </p>
  834.                                         <!-- /.Vendor meta -->
  835.                                     </div>
  836.                                     <div class="vendor-meta m-0">
  837.                                         <div class="vendor-meta-item vendor-meta-item-bordered">
  838.                                             <span class="vendor-price">
  839.                                                 {{ product.price|number_format(2, '.') }}€
  840.                                             </span>
  841.                                             <span class="vendor-text">Prix</span>
  842.                                         </div>
  843.                                         <div class="vendor-meta-item vendor-meta-item-bordered">
  844.                                             <span class="vendor-guest">
  845.                                                 {{ product.quantity }}
  846.                                             </span>
  847.                                             <span class="vendor-text">Quantité restante</span>
  848.                                         </div>
  849.                                         {% set notes = 0 %}
  850.                                         {% for avi in product.avis %}
  851.                                             {% set notes = notes + avi.globalNote %}
  852.                                         {% endfor %}
  853.                                         {% set noteTotal = (notes > 0) ? notes / product.avis|length : 0 %}
  854.                                         <div class="vendor-meta-item vendor-meta-item-bordered">
  855.                                             <span class="rating-star">
  856.                                                 {% for i in 1..5 %}
  857.                                                     {% if i < noteTotal %}
  858.                                                         <i class="fa fa-star rated"></i>
  859.                                                     {% else %}
  860.                                                         <i class="fa fa-star rate-mute"></i>
  861.                                                     {% endif %}
  862.                                                 {% endfor %}
  863.                                             </span>
  864.                                             <span class="rating-count vendor-text">({{ product.avis|length }})</span>
  865.                                         </div>
  866.                                     </div>
  867.                                     <!-- /.Vendor Content -->
  868.                                 </div>
  869.                             </div>
  870.                         </div>
  871.                     {% else %}
  872.                         <div class="vendor-thumbnail list-view p-4">Aucun service correspondant</div>
  873.                     {% endfor %} #}
  875.                     <div class="pagination">
  876.                         <nav aria-label="Page navigation example">
  877.                             {{ knp_pagination_render(products) }}
  878.                         </nav>
  879.                     </div>
  881.                     <!-- /.paginations -->
  882.                 </div>
  883.                 <!-- sidebar-section -->
  884.                 {% if subcategory.subCategorySlug != "hebergements" %}
  885.                     {{ include('front/inc/filter_sidebar.html.twig') }}
  886.                 {% endif %}
  887.                 <!-- /.sidebar-section -->
  888.             </div>
  890.         </div>
  891.     </div>
  892. {% endblock %}
  894. {% block javascript %}
  895.     <script 
  896.         type="text/javascript" 
  897.         src="https://cdn.jsdelivr.net/gh/maxshuty/accessible-web-components@latest/dist/simpleRange.min.js">
  898.     </script>
  899.     <script src="{{ asset('js/jsForHebergementFilter.js') }}"></script>
  900.     <script src="{{ asset('js/getCommune.js') }}"></script>
  901. {% endblock %}
  914.     {# <div class="modal fade" id="modalFilter" tabindex="-1" role="dialog" aria-labelledby="filterModal" aria-hidden="true" style="padding-right:0">
  915.         <div class="modal-dialog myWidth" role="document">
  916.             <div class="modal-content">
  917.                 <form action="">
  918.                     <div class="modal-header">
  919.                         <h5 class="modal-title" id="">Filtre hébergement</h5>
  920.                         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  921.                             <span aria-hidden="true">&times;</span>
  922.                         </button>
  923.                     </div>
  924.                     <div class="modal-body">
  925.                         <div class="row">
  926.                             <div class="col-12">
  927.                                 <h3>Filtre prix</h3>
  928.                                 <div class="form-group filtrePrix">
  929.                                     <select name="" id="" class="padForFltrePrix">
  930.                                         <option value="">Plus cher à moin cher</option>
  931.                                         <option value="">Moin cher à plus cher</option>
  932.                                     </select>
  933.                                 </div>
  934.                             </div>
  935.                             <div class="col-12">
  936.                                 <h3>Avis</h3>
  937.                                 <div class="form-group filtrePrix">
  938.                                     <select name="" id="" class="padForFltrePrix">
  939.                                         <option value="">Passable</option>
  940.                                         <option value="">Bien</option>
  941.                                         <option value="">Très bien</option>
  942.                                     </select>
  943.                                 </div>
  944.                             </div>
  945.                             <div class="col-12">
  946.                                 <h3>Nombre participants</h3>
  947.                                 <div class="form-group flexRadio">
  948.                                     <input type="radio" name="nbrParticipant" value="" id="allParticipant" class="hideRadio" checked="checked">
  949.                                     <label for="allParticipant" class="labelRadio">Tous</label>
  950.                                     <input type="radio" name="nbrParticipant" value="" id="oneParicipant" class="hideRadio">
  951.                                     <label for="oneParicipant" class="labelRadio">1</label>
  952.                                     <input type="radio" name="nbrParticipant" value="" id="tooParicipant" class="hideRadio">
  953.                                     <label for="tooParicipant" class="labelRadio">2</label>
  954.                                     <input type="radio" name="nbrParticipant" value="" id="3Paricipant" class="hideRadio">
  955.                                     <label for="3Paricipant" class="labelRadio">3</label>
  956.                                     <input type="radio" name="nbrParticipant" value="" id="4Paricipant" class="hideRadio">
  957.                                     <label for="4Paricipant" class="labelRadio">4</label>
  958.                                     <input type="radio" name="nbrParticipant" value="" id="5Paricipant" class="hideRadio">
  959.                                     <label for="5Paricipant" class="labelRadio">5</label>
  960.                                     <input type="radio" name="nbrParticipant" value="" id="6Paricipant" class="hideRadio">
  961.                                     <label for="6Paricipant" class="labelRadio">6</label>
  962.                                     <input type="radio" name="nbrParticipant" value="" id="7Paricipant" class="hideRadio">
  963.                                     <label for="7Paricipant" class="labelRadio">7</label>
  964.                                     <input type="radio" name="nbrParticipant" value="" id="8Paricipant" class="hideRadio">
  965.                                     <label for="8Paricipant" class="labelRadio">8+</label>
  966.                                 </div>
  967.                             </div>
  968.                             <div class="col-12">
  969.                                 <h3>Nombre adultes</h3>
  970.                                 {# (input:radio[name="nbrAdulte"]#$Adulte.hideRadio+label.labelRadio[for="$Adulte"]{$})*8 }
  971.                                 <div class="form-group flexRadio">
  972.                                     <input type="radio" name="nbrAdulte" value="" id="allAdulte" class="hideRadio" checked="checked">
  973.                                     <label for="allAdulte" class="labelRadio">Tous</label>
  974.                                     <input type="radio" name="nbrAdulte" id="1Adulte" class="hideRadio">
  975.                                     <label for="1Adulte" class="labelRadio">1</label>
  976.                                     <input type="radio" name="nbrAdulte" id="2Adulte" class="hideRadio">
  977.                                     <label for="2Adulte" class="labelRadio">2</label>
  978.                                     <input type="radio" name="nbrAdulte" id="3Adulte" class="hideRadio">
  979.                                     <label for="3Adulte" class="labelRadio">3</label>
  980.                                     <input type="radio" name="nbrAdulte" id="4Adulte" class="hideRadio">
  981.                                     <label for="4Adulte" class="labelRadio">4</label>
  982.                                     <input type="radio" name="nbrAdulte" id="5Adulte" class="hideRadio">
  983.                                     <label for="5Adulte" class="labelRadio">5</label>
  984.                                     <input type="radio" name="nbrAdulte" id="6Adulte" class="hideRadio">
  985.                                     <label for="6Adulte" class="labelRadio">6</label>
  986.                                     <input type="radio" name="nbrAdulte" id="7Adulte" class="hideRadio">
  987.                                     <label for="7Adulte" class="labelRadio">7</label>
  988.                                     <input type="radio" name="nbrAdulte" id="8Adulte" class="hideRadio">
  989.                                     <label for="8Adulte" class="labelRadio">8+</label>
  990.                                 </div>
  991.                             </div>
  992.                             <div class="col-12">
  993.                                 <h3>Nombre enfants (entre 2ans et 10ans)</h3>
  994.                                 <div class="form-group flexRadio">
  995.                                     <input type="radio" name="nbrEnfant" id="allEnfant" checked="checked" class="hideRadio">
  996.                                     <label for="allEnfant" class="labelRadio">Tous</label>
  997.                                     <input type="radio" name="nbrEnfant" id="1Enfant" class="hideRadio">
  998.                                     <label for="1Enfant" class="labelRadio">1</label>
  999.                                     <input type="radio" name="nbrEnfant" id="2Enfant" class="hideRadio">
  1000.                                     <label for="2Enfant" class="labelRadio">2</label>
  1001.                                     <input type="radio" name="nbrEnfant" id="3Enfant" class="hideRadio">
  1002.                                     <label for="3Enfant" class="labelRadio">3</label>
  1003.                                     <input type="radio" name="nbrEnfant" id="4Enfant" class="hideRadio">
  1004.                                     <label for="4Enfant" class="labelRadio">4</label>
  1005.                                     <input type="radio" name="nbrEnfant" id="5Enfant" class="hideRadio">
  1006.                                     <label for="5Enfant" class="labelRadio">5</label>
  1007.                                     <input type="radio" name="nbrEnfant" id="6Enfant" class="hideRadio">
  1008.                                     <label for="6Enfant" class="labelRadio">6</label>
  1009.                                     <input type="radio" name="nbrEnfant" id="7Enfant" class="hideRadio">
  1010.                                     <label for="7Enfant" class="labelRadio">7</label>
  1011.                                     <input type="radio" name="nbrEnfant" id="8Enfant" class="hideRadio">
  1012.                                     <label for="8Enfant" class="labelRadio">8+</label>
  1013.                                 </div>
  1014.                             </div>
  1015.                             <div class="col-12">
  1016.                                 <h3>Nombre bébé (0 et 23 mois)</h3>
  1017.                                 <div class="form-group flexRadio">
  1018.                                     <input type="radio" name="nbrBebe" id="allBebe" class="hideRadio" checked="checked">
  1019.                                     <label for="allBebe" class="labelRadio">Tous</label>
  1020.                                     <input type="radio" name="nbrBebe" id="1Bebe" class="hideRadio">
  1021.                                     <label for="1Bebe" class="labelRadio">1</label>
  1022.                                     <input type="radio" name="nbrBebe" id="2Bebe" class="hideRadio">
  1023.                                     <label for="2Bebe" class="labelRadio">2</label>
  1024.                                     <input type="radio" name="nbrBebe" id="3Bebe" class="hideRadio">
  1025.                                     <label for="3Bebe" class="labelRadio">3</label>
  1026.                                     <input type="radio" name="nbrBebe" id="4Bebe" class="hideRadio">
  1027.                                     <label for="4Bebe" class="labelRadio">4</label>
  1028.                                     <input type="radio" name="nbrBebe" id="5Bebe" class="hideRadio">
  1029.                                     <label for="5Bebe" class="labelRadio">5</label>
  1030.                                     <input type="radio" name="nbrBebe" id="6Bebe" class="hideRadio">
  1031.                                     <label for="6Bebe" class="labelRadio">6</label>
  1032.                                     <input type="radio" name="nbrBebe" id="7Bebe" class="hideRadio">
  1033.                                     <label for="7Bebe" class="labelRadio">7</label>
  1034.                                     <input type="radio" name="nbrBebe" id="8Bebe" class="hideRadio">
  1035.                                     <label for="8Bebe" class="labelRadio">8+</label>
  1036.                                 </div>
  1037.                             </div>
  1038.                             <div class="col-12">
  1039.                                 <h3>Prix par nuit (€)</h3>
  1040.                                 <div class="form-group">
  1041.                                     <range-selector 
  1042.                                         min-range="0" 
  1043.                                         max-range="2000" 
  1044.                                         inputs-for-labels 
  1045.                                         slider-color="#ff839e"
  1046.                                         circle-border="3px solid #903ef5"
  1047.                                         circle-focus-border="3px solid #903ef5"
  1048.                                     />
  1049.                                 </div>
  1050.                             </div>
  1051.                             <div class="col-12">
  1052.                                 <h3>Prix par séjour (€)</h3>
  1053.                                 <div class="form-group">
  1054.                                     <range-selector 
  1055.                                         min-range="0" 
  1056.                                         max-range="2000" 
  1057.                                         inputs-for-labels 
  1058.                                         slider-color="#ff839e"
  1059.                                         circle-border="3px solid #903ef5"
  1060.                                         circle-focus-border="3px solid #903ef5"
  1061.                                     />
  1062.                                 </div>
  1063.                             </div>
  1064.                             <div class="col-12">
  1065.                                 <h3>Type d'hébergement</h3>
  1066.                                 <div class="flexRadio">
  1067.                                     <div class="custom-checkbox" style="position: relative">
  1068.                                         <input type="checkbox" name="typeHebergement" id="maison" class="custom-control-input">
  1069.                                         <label for="maison" class="custom-control-label" style="margin-left: 25px;">Maison
  1070.                                         </label>
  1071.                                     </div>
  1072.                                     <div class="custom-checkbox" style="position: relative">
  1073.                                         <input type="checkbox" name="typeHebergement" id="appartement" class="custom-control-input">
  1074.                                         <label for="appartement" class="custom-control-label" style="margin-left: 25px;">Appartement</label>
  1075.                                     </div>
  1076.                                     <div class="custom-checkbox" style="position: relative">
  1077.                                         <input type="checkbox" name="typeHebergement" id="villa" class="custom-control-input">
  1078.                                         <label for="villa" class="custom-control-label" style="margin-left: 25px;">Villa</label>
  1079.                                     </div>
  1080.                                     <div class="custom-checkbox" style="position: relative">
  1081.                                         <input type="checkbox" name="typeHebergement" id="camping" class="custom-control-input">
  1082.                                         <label for="camping" class="custom-control-label" style="margin-left: 25px;">Camping</label>
  1083.                                     </div>
  1084.                                     <div class="custom-checkbox" style="position: relative">
  1085.                                         <input type="checkbox" name="typeHebergement" id="hotel" class="custom-control-input">
  1086.                                         <label for="hotel" class="custom-control-label" style="margin-left: 25px;">Hôtel</label>
  1087.                                     </div>
  1088.                                     <div class="custom-checkbox" style="position: relative">
  1089.                                         <input type="checkbox" name="typeHebergement" id="bateau" class="custom-control-input">
  1090.                                         <label for="bateau" class="custom-control-label" style="margin-left: 25px;">Bateau</label>
  1091.                                     </div>
  1092.                                     <div class="custom-checkbox" style="position: relative">
  1093.                                         <input type="checkbox" name="typeHebergement" id="chalet" class="custom-control-input">
  1094.                                         <label for="chalet" class="custom-control-label" style="margin-left: 25px;">Chalet</label>
  1095.                                     </div>
  1096.                                 </div>
  1097.                             </div>
  1098.                             <div class="col-12">
  1099.                                 <h3>Nombre de chambres</h3>
  1100.                                 <div class="form-group flexRadio">
  1101.                                     <input type="radio" name="nbrChambre" id="allChambre" class="hideRadio" checked="checked">
  1102.                                     <label for="allChambre" class="labelRadio">Tous</label>
  1103.                                     <input type="radio" name="nbrChambre" id="1Chambre" class="hideRadio">
  1104.                                     <label for="1Chambre" class="labelRadio">1</label>
  1105.                                     <input type="radio" name="nbrChambre" id="2Chambre" class="hideRadio">
  1106.                                     <label for="2Chambre" class="labelRadio">2</label>
  1107.                                     <input type="radio" name="nbrChambre" id="3Chambre" class="hideRadio">
  1108.                                     <label for="3Chambre" class="labelRadio">3</label>
  1109.                                     <input type="radio" name="nbrChambre" id="4Chambre" class="hideRadio">
  1110.                                     <label for="4Chambre" class="labelRadio">4</label>
  1111.                                     <input type="radio" name="nbrChambre" id="5Chambre" class="hideRadio">
  1112.                                     <label for="5Chambre" class="labelRadio">5</label>
  1113.                                     <input type="radio" name="nbrChambre" id="6Chambre" class="hideRadio">
  1114.                                     <label for="6Chambre" class="labelRadio">6+</label>
  1115.                                 </div>
  1116.                             </div>
  1117.                             <div class="col-12">
  1118.                                 <h3>Nombre de lits</h3>
  1119.                                 <div class="form-group flexRadio">
  1120.                                     <input type="radio" name="nbrChambreLits" id="allLits" class="hideRadio" checked="checked">
  1121.                                     <label for="allLits" class="labelRadio">Tous</label>
  1122.                                     <input type="radio" name="nbrChambreLits" id="1Lits" class="hideRadio">
  1123.                                     <label for="1Lits" class="labelRadio">1</label>
  1124.                                     <input type="radio" name="nbrChambreLits" id="2Lits" class="hideRadio">
  1125.                                     <label for="2Lits" class="labelRadio">2</label>
  1126.                                     <input type="radio" name="nbrChambreLits" id="3Lits" class="hideRadio">
  1127.                                     <label for="3Lits" class="labelRadio">3</label>
  1128.                                     <input type="radio" name="nbrChambreLits" id="4Lits" class="hideRadio">
  1129.                                     <label for="4Lits" class="labelRadio">4</label>
  1130.                                     <input type="radio" name="nbrChambreLits" id="5Lits" class="hideRadio">
  1131.                                     <label for="5Lits" class="labelRadio">5</label>
  1132.                                     <input type="radio" name="nbrChambreLits" id="6Lits" class="hideRadio">
  1133.                                     <label for="6Lits" class="labelRadio">6+</label>
  1134.                                 </div>
  1135.                             </div>
  1136.                             <div class="col-12">
  1137.                                 <h3>Equipements</h3>
  1138.                                 {# (div.custom-checkbox[style="position: relative"]>input:checkbox#.custom-control-input[name="equipements"]+label.custom-control-label[style="margin-left: 25px;"]{})*3 }
  1139.                                 <div class="flexRadio">
  1140.                                     <div class="custom-checkbox" style="position: relative">
  1141.                                         <input type="checkbox" name="equipements" id="wifi" class="custom-control-input">
  1142.                                         <label for="wifi" class="custom-control-label" style="margin-left: 25px;">Wifi
  1143.                                         </label>
  1144.                                     </div>
  1145.                                     <div class="custom-checkbox" style="position: relative">
  1146.                                         <input type="checkbox" name="equipements" id="climatisation" class="custom-control-input">
  1147.                                         <label for="climatisation" class="custom-control-label" style="margin-left: 25px;">Climatisation</label>
  1148.                                     </div>
  1149.                                     <div class="custom-checkbox" style="position: relative">
  1150.                                         <input type="checkbox" name="equipements" id="laveLinge" class="custom-control-input">
  1151.                                         <label for="laveLinge" class="custom-control-label" style="margin-left: 25px;">Lave linge</label>
  1152.                                     </div>
  1153.                                     <div class="custom-checkbox" style="position: relative">
  1154.                                         <input type="checkbox" name="equipements" id="secheLinge" class="custom-control-input">
  1155.                                         <label for="secheLinge" class="custom-control-label" style="margin-left: 25px;">Sèche linge</label>
  1156.                                     </div>
  1157.                                     <div class="custom-checkbox" style="position: relative">
  1158.                                         <input type="checkbox" name="equipements" id="laveVaisselle" class="custom-control-input">
  1159.                                         <label for="laveVaisselle" class="custom-control-label" style="margin-left: 25px;">Lave vaisselle</label>
  1160.                                     </div>
  1161.                                     <div class="custom-checkbox" style="position: relative">
  1162.                                         <input type="checkbox" name="equipements" id="television" class="custom-control-input">
  1163.                                         <label for="television" class="custom-control-label" style="margin-left: 25px;">Télévision</label>
  1164.                                     </div>
  1165.                                     <div class="custom-checkbox" style="position: relative">
  1166.                                         <input type="checkbox" name="equipements" id="ferARepasser" class="custom-control-input">
  1167.                                         <label for="ferARepasser" class="custom-control-label" style="margin-left: 25px;">Fer à repasser</label>
  1168.                                     </div>
  1169.                                     <div class="custom-checkbox" style="position: relative">
  1170.                                         <input type="checkbox" name="equipements" id="four" class="custom-control-input">
  1171.                                         <label for="four" class="custom-control-label" style="margin-left: 25px;">Four</label>
  1172.                                     </div>
  1173.                                     <div class="custom-checkbox" style="position: relative">
  1174.                                         <input type="checkbox" name="equipements" id="litBebe" class="custom-control-input">
  1175.                                         <label for="litBebe" class="custom-control-label" style="margin-left: 25px;">Lit bébé</label>
  1176.                                     </div>
  1177.                                     <div class="custom-checkbox" style="position: relative">
  1178.                                         <input type="checkbox" name="equipements" id="chaiseHaute" class="custom-control-input">
  1179.                                         <label for="chaiseHaute" class="custom-control-label" style="margin-left: 25px;">Chaise haute</label>
  1180.                                     </div>
  1181.                                     <div class="custom-checkbox" style="position: relative">
  1182.                                         <input type="checkbox" name="equipements" id="lingeDeMaison" class="custom-control-input">
  1183.                                         <label for="lingeDeMaison" class="custom-control-label" style="margin-left: 25px;">Linge de maison fourni</label>
  1184.                                     </div>
  1185.                                     <div class="custom-checkbox" style="position: relative">
  1186.                                         <input type="checkbox" name="equipements" id="cuisineSeparee" class="custom-control-input">
  1187.                                         <label for="cuisineSeparee" class="custom-control-label" style="margin-left: 25px;">Cuisine séparée</label>
  1188.                                     </div>
  1189.                                 </div>
  1190.                             </div>
  1191.                             <div class="col-12">
  1192.                                 <h3>Caractéristiques</h3>
  1193.                                 <div class="flexRadio">
  1194.                                     <div class="custom-checkbox" style="position: relative">
  1195.                                         <input type="checkbox" name="caracteristique" id="piscine" class="custom-control-input">
  1196.                                         <label for="piscine" class="custom-control-label" style="margin-left: 25px;">Piscine</label>
  1197.                                     </div>
  1198.                                     <div class="custom-checkbox" style="position: relative">
  1199.                                         <input type="checkbox" name="caracteristique" id="jacuzzi" class="custom-control-input">
  1200.                                         <label for="jacuzzi" class="custom-control-label" style="margin-left: 25px;">Jacuzzi</label>
  1201.                                     </div>
  1202.                                     <div class="custom-checkbox" style="position: relative">
  1203.                                         <input type="checkbox" name="caracteristique" id="terrasse" class="custom-control-input">
  1204.                                         <label for="terrasse" class="custom-control-label" style="margin-left: 25px;">Terrasse</label>
  1205.                                     </div>
  1206.                                     <div class="custom-checkbox" style="position: relative">
  1207.                                         <input type="checkbox" name="caracteristique" id="balcon" class="custom-control-input">
  1208.                                         <label for="balcon" class="custom-control-label" style="margin-left: 25px;">Balcon</label>
  1209.                                     </div>
  1210.                                     <div class="custom-checkbox" style="position: relative">
  1211.                                         <input type="checkbox" name="caracteristique" id="jardin" class="custom-control-input">
  1212.                                         <label for="jardin" class="custom-control-label" style="margin-left: 25px;">Jardin</label>
  1213.                                     </div>
  1214.                                     <div class="custom-checkbox" style="position: relative">
  1215.                                         <input type="checkbox" name="caracteristique" id="animal" class="custom-control-input">
  1216.                                         <label for="animal" class="custom-control-label" style="margin-left: 25px;">Animal domestique accepté</label>
  1217.                                     </div>
  1218.                                     <div class="custom-checkbox" style="position: relative">
  1219.                                         <input type="checkbox" name="caracteristique" id="parking" class="custom-control-input">
  1220.                                         <label for="parking" class="custom-control-label" style="margin-left: 25px;">Parking</label>
  1221.                                     </div>
  1222.                                     <div class="custom-checkbox" style="position: relative">
  1223.                                         <input type="checkbox" name="caracteristique" id="accesHandicapee" class="custom-control-input">
  1224.                                         <label for="accesHandicapee" class="custom-control-label" style="margin-left: 25px;">Accès handicapés</label>
  1225.                                     </div>
  1226.                                 </div>
  1227.                             </div>
  1228.                             <div class="col-12">
  1229.                                 <h3>Localisation</h3>
  1230.                                 <div class="flexRadio">
  1231.                                     <div class="custom-checkbox" style="position: relative">
  1232.                                         <input type="checkbox" name="localisation" id="bordDeMer" class="custom-control-input">
  1233.                                         <label for="bordDeMer" class="custom-control-label" style="margin-left: 25px;">Bord de mer</label>
  1234.                                     </div>
  1235.                                     <div class="custom-checkbox" style="position: relative">
  1236.                                         <input type="checkbox" name="localisation" id="centreVille" class="custom-control-input">
  1237.                                         <label for="centreVille" class="custom-control-label" style="margin-left: 25px;">Centre ville</label>
  1238.                                     </div>
  1239.                                     <div class="custom-checkbox" style="position: relative">
  1240.                                         <input type="checkbox" name="localisation" id="bordDePlage" class="custom-control-input">
  1241.                                         <label for="bordDePlage" class="custom-control-label" style="margin-left: 25px;">Bord de plage</label>
  1242.                                     </div>
  1243.                                     <div class="custom-checkbox" style="position: relative">
  1244.                                         <input type="checkbox" name="localisation" id="vueMer" class="custom-control-input">
  1245.                                         <label for="vueMer" class="custom-control-label" style="margin-left: 25px;">Vue mer</label>
  1246.                                     </div>
  1247.                                     <div class="custom-checkbox" style="position: relative">
  1248.                                         <input type="checkbox" name="localisation" id="campagne" class="custom-control-input">
  1249.                                         <label for="campagne" class="custom-control-label" style="margin-left: 25px;">Campagne</label>
  1250.                                     </div>
  1251.                                     <div class="custom-checkbox" style="position: relative">
  1252.                                         <input type="checkbox" name="localisation" id="montagne" class="custom-control-input">
  1253.                                         <label for="montagne" class="custom-control-label" style="margin-left: 25px;">Montagne</label>
  1254.                                     </div>
  1255.                                 </div>
  1256.                             </div>
  1257.                             <div class="col-12">
  1258.                                 <h3>Sécurité</h3>
  1259.                                 <div class="flexRadio">
  1260.                                     <div class="custom-checkbox" style="position: relative">
  1261.                                         <input type="checkbox" name="securite" id="detecteurDeFumee" class="custom-control-input">
  1262.                                         <label for="detecteurDeFumee" class="custom-control-label" style="margin-left: 25px;">Détecteur de fumée</label>
  1263.                                     </div>
  1264.                                     <div class="custom-checkbox" style="position: relative">
  1265.                                         <input type="checkbox" name="securite" id="" class="custom-control-input">
  1266.                                         <label for="detecteurDeMonoxydeDeCarbone" class="custom-control-label" style="margin-left: 25px;">Détecteur de monoxyde de carbone</label>
  1267.                                     </div>
  1268.                                 </div>
  1269.                             </div>
  1270.                             <div class="col-12">
  1271.                                 <h3>Langue du propriétaire</h3>
  1272.                                 <div class="flexRadio">
  1273.                                     <div class="custom-checkbox" style="position: relative">
  1274.                                         <input type="checkbox" name="langue" id="francais" class="custom-control-input">
  1275.                                         <label for="francais" class="custom-control-label" style="margin-left: 25px;">Français</label>
  1276.                                     </div>
  1277.                                     <div class="custom-checkbox" style="position: relative">
  1278.                                         <input type="checkbox" name="langue" id="anglais" class="custom-control-input">
  1279.                                         <label for="anglais" class="custom-control-label" style="margin-left: 25px;">Anglais</label>
  1280.                                     </div>
  1281.                                     <div class="custom-checkbox" style="position: relative">
  1282.                                         <input type="checkbox" name="langue" id="allemend" class="custom-control-input">
  1283.                                         <label for="allemend" class="custom-control-label" style="margin-left: 25px;">Allemand</label>
  1284.                                     </div>
  1285.                                     <div class="custom-checkbox" style="position: relative">
  1286.                                         <input type="checkbox" name="langue" id="espagnol" class="custom-control-input">
  1287.                                         <label for="espagnol" class="custom-control-label" style="margin-left: 25px;">Espagnol</label>
  1288.                                     </div>
  1289.                                     <div class="custom-checkbox" style="position: relative">
  1290.                                         <input type="checkbox" name="langue" id="italien" class="custom-control-input">
  1291.                                         <label for="italien" class="custom-control-label" style="margin-left: 25px;">Italien</label>
  1292.                                     </div>
  1293.                                     <div class="custom-checkbox" style="position: relative">
  1294.                                         <input type="checkbox" name="langue" id="russe" class="custom-control-input">
  1295.                                         <label for="russe" class="custom-control-label" style="margin-left: 25px;">Russe</label>
  1296.                                     </div>
  1297.                                 </div>
  1298.                             </div>
  1299.                         </div>
  1300.                     </div>
  1301.                     <div class="modal-footer">
  1302.                         <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
  1303.                         <button type="submit" class="btn btn-primary" id="" onclick="">Afficher</button>
  1304.                     </div>
  1305.                 </form>
  1306.             </div>
  1307.         </div>
  1308.     </div> #}