templates/base.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Tracol | {% block title %}{% endblock %}</title>
  6.     <link rel="icon" type="image/x-icon" href="{{ asset("build/favicon-white.ico") }}">
  7.     {% block metaDescription %}{% endblock %}
  8.     <meta name="viewport" content= "width=device-width, initial-scale=1.0">
  9.     {% block stylesheets %}
  10.         {{ encore_entry_link_tags('app') }}
  11.         <link rel="stylesheet" href="https://unpkg.com/@egjs/flicking/dist/flicking.css" crossorigin="anonymous" />
  12.         <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
  13.         <!--link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /-->
  14.     {% endblock %}
  16.     <script id="Cookiebot" src="
  17.     https://consent.cookiebot.com/uc.js"
  18.     data-cbid="d4dd1335-1dc0-4d3c-b4c3-49e9043d2e0e" data-blockingmode="auto" type="text/javascript"></script>
  19.         {% block javascripts %}
  20.         {{ encore_entry_script_tags('app') }}
  21. {#        <script id="Cookiebot" src="https://consent.cookiebot.com/uc.js" data-cbid="d4dd1335-1dc0-4d3c-b4c3-49e9043d2e0e" data-blockingmode="auto" type="text/javascript"></script>#}
  22.         <script
  23.                 src="https://code.jquery.com/jquery-3.6.0.min.js"
  24.                 integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
  25.                 crossorigin="anonymous">
  26.         </script>
  27.         
  28.         <script src="https://unpkg.com/@egjs/flicking/dist/flicking.pkgd.min.js" crossorigin="anonymous"></script>
  29.         <script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
  30.         <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
  31.         <script src="{{ asset("/lightboxed/lightboxed.js") }}"></script>
  32.         <!--script src="https://code.jquery.com/mobile/1.5.0-rc1/jquery.mobile-1.5.0-rc1.min.js" integrity="sha256-c3VbCrdCtTHmXYAuxRT4D0Cy5VC/0zBnXVRIvJiV9xo=" crossorigin="anonymous"></script-->
  33.         
  34.     {% endblock %}
  35.     <style>
  36.         @media (min-width: 1200px) and (max-width:1498px) {
  37.             .navbar-expand-xl .navbar-collapse {
  38.                 display: flex !important;
  39.                 /* flex-basis: auto; */
  40.                 justify-content: center;
  41.             }
  42.         }
  43.     </style>
  44. </head>
  46. <body>
  47. {#<script id="CookieDeclaration" src="https://consent.cookiebot.com/d4dd1335-1dc0-4d3c-b4c3-49e9043d2e0e/cd.js" type="text/javascript" async></script>#}
  48. {% for success in app.flashes('success') %}
  49.     <div class="alert alert-success" role="alert">
  50.         <p class="alert-link">{{ success }}</p>
  51.     </div>
  52. {% endfor %}
  53. {% for error in app.flashes('error') %}
  54.     <div class="col-lg-8 mx-auto alert alert-danger" role="alert">
  55.         <p class="alert-link">{{ error }}</p>
  56.     </div>
  57. {% endfor %}
  60. {#
  61. <div class="d-flex flex-column flex-shrink-0 bg-light black" style="width: 4rem;">
  62.     <a  href="https://www.facebook.com/tracolimmobilier/"><i class="fab fa-facebook-f"></i></a>
  63.     <a href="https://www.linkedin.com/company/tracol-immobilier-s-a-/"><i class="fab fa-linkedin"></i></a>
  64.     <a href="https://www.instagram.com/tracolimmobilier/"><i class="fab fa-instagram"></i></a>
  65. </div>
  66. <div id="div-newsletter" class="d-flex flex-column flex-shrink-0 bg-light orange">
  67.     <a id="text-vertical" class="text-vertical" href="#">NEWSLETTER</a>
  68.     <div id="div-form-newsletter" style="opacity: 0">
  69.         <span id="span-newsletter" style="opacity: 0">Restez informé ! Abonnez-vous à notre newsletter.</span>
  70.         <form action="{{ path('mailchimp') }}" id="form-newsletter" style="display: none">
  71.             <div class="input-group">
  72.                 <input id="input-email" class="form-control input-email" type="email" name="email" placeholder="Votre adresse mail">
  73.                 <button class="btn btn-primary button-newsletter" type="submit"><i class="fas fa-arrow-right"></i></button>
  74.             </div>
  75.         </form>
  76.     </div>
  77. </div>
  78. #}
  80. {% set propertiesApi = get_properties %}
  82. <nav class="navbar navbar-expand-xl fixed-top homepage">
  83.     <div id="center-nav" class="container-fluid">
  84.         <button class="navbar-toggler"
  85.                 type="button"
  86.                 data-bs-toggle="collapse"
  87.                 data-bs-target="#navbarNav"
  88.                 aria-controls="navbarNav"
  89.                 aria-expanded="false"
  90.                 aria-label="Toggle navigation">
  91.             <span class="navbar-toggler-icon">
  92.                 <i class="fas fa-bars"></i>
  93.             </span>
  94.         </button>
  95.         <a href="{{ path('index') }}" class="tracol-logo">
  96.             <svg xmlns="http://www.w3.org/2000/svg" width="136.339" height="51.127" viewBox="0 0 136.339 51.127">
  97.                 <g id="Groupe_4469" data-name="Groupe 4469" transform="translate(11823.999 14639)">
  98.                     <path id="Tracé_59" data-name="Tracé 59" d="M682.759,232.441h-9.089v14.77l9.089-1.931Z" transform="translate(-12370.418 -14871.441)" fill="#f6a400"/>
  99.                     <path id="Tracé_60" data-name="Tracé 60" d="M635.6,255.7c0,7.088,3.8,9.434,9.069,9.434a16.669,16.669,0,0,0,6.359-1.2l-.73-4.379a14.765,14.765,0,0,1-5.629,1.147c-2.658,0-4.378-1.2-4.378-5V232.5H635.6Z" transform="translate(-12347.273 -14871.48)"/>
  100.                     <path id="Tracé_61" data-name="Tracé 61" d="M402.171,274.441h4.691V253.593a10.905,10.905,0,0,1,3.962-.573,14.562,14.562,0,0,1,4.117.573l.782-4.378a17.993,17.993,0,0,0-5.108-.626,21.859,21.859,0,0,0-8.444,1.512Zm40.968-12.477c0,8.652,4.639,13.031,12.3,13.031a19.832,19.832,0,0,0,6.984-1.2l-.73-4.378a15.649,15.649,0,0,1-5.942,1.147c-5.525,0-7.922-2.814-7.922-8.912,0-5.264,1.824-8.6,7.557-8.6a12.827,12.827,0,0,1,5.838,1.355l.729-4.482a17.148,17.148,0,0,0-6.672-1.3c-8.339,0-12.144,5.473-12.144,13.343m40.6-.156c0,5.369-1.3,8.756-6.724,8.756-5.473,0-6.828-3.388-6.828-8.756,0-5.316,1.355-8.756,6.828-8.756,5.42,0,6.724,3.44,6.724,8.756m-6.724,13.187c7.975,0,11.467-5.264,11.467-13.187,0-8.131-3.232-13.187-11.467-13.187-8.027,0-11.519,5.316-11.519,13.187,0,8.131,3.284,13.187,11.519,13.187" transform="translate(-12205.374 -14881.258)"/>
  101.                     <path id="Tracé_62" data-name="Tracé 62" d="M349.134,255.7c0,7.088,3.8,9.434,9.069,9.434a16.669,16.669,0,0,0,6.359-1.2l-.73-4.379A14.766,14.766,0,0,1,358.2,260.7c-2.658,0-4.378-1.2-4.378-5V244.778h9.695v-4.43h-9.695V232.5h-4.691Z" transform="translate(-12173.133 -14871.48)"/>
  102.                     <path id="Tracé_63" data-name="Tracé 63" d="M452.277,271.03c-4.851,0-4.851-3.294-4.851-4.165,0-.807.04-3.966,5.213-3.966H463.01v-5.42c0-6.567-4.431-8.809-10.425-8.809a29.621,29.621,0,0,0-7.87,1.146l.678,4.326a20.958,20.958,0,0,1,7.036-1.2c3.7,0,5.942,1.043,5.942,4.066v2.241h-4.9c-6.567,0-10.685,2.137-10.685,7.871,0,5.681,3.8,7.922,10.32,7.922a32.7,32.7,0,0,0,9.9-1.511v-4.091a43.889,43.889,0,0,1-10.733,1.589" transform="translate(-12230.064 -14881.307)"/>
  103.                     <rect id="Rectangle_73" data-name="Rectangle 73" width="1.585" height="8.956" transform="translate(-11803.191 -14596.829)"/>
  104.                     <path id="Tracé_64" data-name="Tracé 64" d="M415.929,339.993h1.5l2.643,4.172,2.628-4.172h1.5v8.956h-1.585v-6.105l-2.448,3.88h-.194l-2.476-3.866v6.092h-1.572Z" transform="translate(-12213.737 -14936.822)"/>
  105.                     <path id="Tracé_65" data-name="Tracé 65" d="M446.472,339.993h1.5l2.643,4.172,2.628-4.172h1.5v8.956h-1.585v-6.105l-2.448,3.88h-.194l-2.476-3.866v6.092h-1.572Z" transform="translate(-12232.305 -14936.822)"/>
  106.                     <path id="Tracé_66" data-name="Tracé 66" d="M480,341.292c-1.808,0-2.113,1.112-2.113,3.058s.334,3.018,2.142,3.018,2.142-1.085,2.142-3.018-.349-3.058-2.171-3.058m-3.7,3.058c0-2.67.736-4.533,3.7-4.533s3.77,1.848,3.77,4.533-.779,4.492-3.741,4.492-3.727-1.822-3.727-4.492" transform="translate(-12250.44 -14936.716)"/>
  107.                     <path id="Tracé_67" data-name="Tracé 67" d="M505.617,345.055v2.42h1.877c1.266,0,1.7-.473,1.7-1.2s-.417-1.224-1.7-1.224Zm0-3.588v2.225h1.711c1.182,0,1.585-.5,1.585-1.126s-.4-1.1-1.585-1.1Zm1.711-1.474c2.309,0,3.185.988,3.185,2.42a1.93,1.93,0,0,1-1.182,1.892,2.046,2.046,0,0,1,1.461,2c0,1.4-1.029,2.642-3.3,2.642h-3.449v-8.956Z" transform="translate(-12267.304 -14936.822)"/>
  108.                     <rect id="Rectangle_74" data-name="Rectangle 74" width="1.586" height="8.956" transform="translate(-11753.034 -14596.829)"/>
  109.                     <path id="Tracé_68" data-name="Tracé 68" d="M543.847,339.993h1.572v7.482h4.117v1.474h-5.689Z" transform="translate(-12291.499 -14936.822)"/>
  110.                     <rect id="Rectangle_75" data-name="Rectangle 75" width="1.586" height="8.956" transform="translate(-11738.931 -14596.829)"/>
  111.                     <path id="Tracé_69" data-name="Tracé 69" d="M581.389,347.475h4.673v1.474h-6.245v-8.957h6.245v1.474h-4.673v2.142h4.117v1.474h-4.117Z" transform="translate(-12313.365 -14936.822)"/>
  112.                     <path id="Tracé_70" data-name="Tracé 70" d="M605.9,341.467V344.1h1.85c1.377,0,1.794-.529,1.794-1.308,0-.834-.417-1.321-1.794-1.321Zm3.255,3.908,2.337,3.574h-1.808l-2.2-3.379H605.9v3.379h-1.572v-8.956h3.421c2.448,0,3.38,1.126,3.38,2.8a2.537,2.537,0,0,1-1.975,2.587" transform="translate(-12328.266 -14936.822)"/>
  113.                 </g>
  114.             </svg>
  116.         </a>
  117.         <button style="background-color: transparent;border-color: transparent; display: none;position: absolute;right:0;top:5px;" id="submit-search-mobile" type="submit" data-bs-toggle="modal" data-bs-target="#exampleModal1">
  118.             <svg style="height: 55px;" class="search-button" xmlns="http://www.w3.org/2000/svg" width="55.982" height="90.97" viewBox="0 0 55.982 90.97">
  119.                 <g id="Groupe_3817" data-name="Groupe 3817" transform="translate(-1528.861 -105)">
  120.                     <path id="Tracé_95" data-name="Tracé 95" d="M729.651,232.441H673.669v90.97l55.982-11.894Z" transform="translate(855.192 -127.441)" fill="#f6a400"/>
  121.                     <g id="Groupe_3794" data-name="Groupe 3794" transform="translate(1545.335 126.696)">
  122.                         <g id="np_search_1868241_000000">
  123.                             <path id="Tracé_92" data-name="Tracé 92" d="M8.287,17.368A8.662,8.662,0,1,1,14.4,14.813a8.679,8.679,0,0,1-6.109,2.555Zm0-15.055a6.36,6.36,0,1,0,4.477,1.881A6.377,6.377,0,0,0,8.287,2.313Z" transform="translate(0.441 -0.012)" fill="#fff"/>
  124.                             <path id="Tracé_93" data-name="Tracé 93" d="M57.82,59.567l1.626-1.633L67.4,65.852l-1.626,1.633Z" transform="translate(-44.591 -44.782)" fill="#fff"/>
  125.                         </g>
  126.                     </g>
  127.                 </g>
  128.             </svg>
  129.         </button>
  132.         <!-- Modal -->
  133.         {% include '_navSearch.html.twig' %}
  135.         <div class="nav-elements collapse navbar-collapse" id="navbarNav">
  136.             <ul class="navbar-nav">
  137.                 {#
  138.                 <li class="nav-item">
  139.                     <a class="nav-link active" aria-current="page" href="{{ path('tracol') }}">Tracol</a>
  140.                 </li>
  141.                 #}
  143.                 <li class="nav-item">
  144.                     <a class="nav-link" href="{{ path('about') }}">Qui sommes-nous ?</a>
  145.                 </li>
  146.                 <li class="nav-item">
  147.                     <a class="nav-link" href="{{ path('properties', {'keyword': 'vente'}) }}">Acheter</a>
  148.                 </li>
  149.                 <li class="nav-item">
  150.                     <a class="nav-link" href="{{ path('properties', {'keyword': 'location'}) }}">Louer</a>
  151.                 </li>
  152.                 <li class="nav-item">
  153.                     <a class="nav-link" href="{{ path('vendre', {'keyword': 'location'}) }}">Vendre</a>
  154.                 </li>
  155.                 <li class="nav-item">
  156.                     <a class="nav-link" href="{{ path('projects', {'keyword': 'location'}) }}">Projets</a>
  157.                 </li>
  158.                 <li class="nav-item">
  159.                     <a class="nav-link" href="{{ path('reference') }}">Références</a>
  160.                 </li>
  162.                 {#
  163.                 <li class="nav-item">
  164.                     <a class="nav-link" href="{{ path('team') }}">Notre equipe</a>
  165.                 </li>
  166.                 #}
  169. {#                <li class="nav-item">#}
  170. {#                    <a class="nav-link" href="#">Actualités</a>#}
  171. {#                </li>#}
  172.                 {#
  173.                 <li class="nav-item">
  174.                     <a class="nav-link" href="{{ path('carrieres') }}">Carrières</a>
  175.                 </li>
  176.                 #}
  178.                 <li id="enveloppe-mobile" class="nav-item">
  179.                     <a class="nav-link" href="{{ path('contact') }}">
  180.                         {#
  181.                         <i class="far fa-envelope"></i>
  182.                         #}
  183.                         Contact
  184.                     </a>
  185.                 </li>
  186.             </ul>
  187.         </div>
  188.         <div class="contacts-social">
  189.             <div class="phone-contact">
  190.                 <div>
  191.                     <svg class="svg-phone" xmlns="http://www.w3.org/2000/svg" width="31.059" height="27.732" viewBox="0 0 31.059 27.732">
  192.                         <g id="np_phone-call_3960627_000000" transform="translate(-6.248 -15.626)">
  193.                             <path id="Tracé_116" data-name="Tracé 116" d="M32.871,43.356H33.98V41.138h3.328V38.919H33.98V34.793l-7.931-2.64-2.973,1.986a19.764,19.764,0,0,1-7.488-7.421l1.9-1.9-2.64-9.2h-8.6v1.109A26.511,26.511,0,0,0,32.871,43.357ZM13.182,17.844l1.808,6.334L12.9,26.307l.377.721a22,22,0,0,0,9.406,9.384l.588.3,3.161-2.119,5.324,1.8v4.748A24.461,24.461,0,0,1,8.467,17.844Z" fill="#5f5f5f" stroke="#5f5f5f" />
  194.                         </g>
  195.                     </svg>
  196.                 </div>
  197.                 <div>
  198.                     <p class="phone">
  199.                         {#
  200.                         Besoin d'informations ? <br>
  201.                         #}
  202.                         <a href="tel:+3522658601">(+352) 26 58 60-1</a>
  203.                     </p>
  204.                 </div>
  205.             </div>
  207.             <div class="socials">
  208.                 <a target="_blank" href="https://www.facebook.com/tracolimmobilier/">
  209.                     <i class="fab fa-facebook-f fa-2x"></i>
  210.                 </a>
  211.                 <a target="_blank" href="https://www.linkedin.com/company/tracol-immobilier-s-a-/">
  212.                     <i class="fab fa-linkedin fa-2x"></i>
  213.                 </a>
  214.                 <a target="_blank" href="https://www.instagram.com/tracolimmobilier/">
  215.                     <i class="fab fa-instagram fa-2x"></i>
  216.                 </a>
  217.                 <a target="_blank" href="https://www.youtube.com/channel/UCLl8G5ZCdyslVR_4ANkD6GA">
  218.                     <i class="fab fa-youtube fa-2x"></i>
  219.                 </a>
  220.             </div>
  221.         </div>
  223.         <div id="footer-nav-mobile" style="display: none">
  224.                 <div>
  225.                     <a href="tel:+3522658601">
  226.                         <svg style="margin: auto;" class="svg-phone" xmlns="http://www.w3.org/2000/svg" width="31.059" height="27.732" viewBox="0 0 31.059 27.732">
  227.                             <g id="np_phone-call_3960627_000000" transform="translate(-6.248 -15.626)">
  228.                                 <path id="Tracé_116" data-name="Tracé 116" d="M32.871,43.356H33.98V41.138h3.328V38.919H33.98V34.793l-7.931-2.64-2.973,1.986a19.764,19.764,0,0,1-7.488-7.421l1.9-1.9-2.64-9.2h-8.6v1.109A26.511,26.511,0,0,0,32.871,43.357ZM13.182,17.844l1.808,6.334L12.9,26.307l.377.721a22,22,0,0,0,9.406,9.384l.588.3,3.161-2.119,5.324,1.8v4.748A24.461,24.461,0,0,1,8.467,17.844Z" fill="#5f5f5f" stroke="#5f5f5f" />
  229.                             </g>
  230.                         </svg>
  231.                     </a>
  232.                 </div>
  233.                 <div>
  234.                     <a href="{{ path('contact') }}"><i style="color: #5f5f5f;" class="far fa-envelope fa-2x"></i></a>
  235.                 </div>
  236.                 <div>
  237.                     <a target="_blank" href="https://www.facebook.com/tracolimmobilier/"><i style="color: #5f5f5f;" class="fab fa-facebook-f"></i></a>
  238.                 </div>
  239.                 <div>
  240.                     <a target="_blank" href="https://www.linkedin.com/company/tracol-immobilier-s-a-/"><i style="color: #5f5f5f;" class="fab fa-linkedin"></i></a>
  241.                 </div>
  242.                 <div>
  243.                     <a target="_blank" href="https://www.instagram.com/tracolimmobilier/"><i style="color: #5f5f5f;" class="fab fa-instagram"></i></a>
  244.                 </div>
  245.                 <div>
  246.                     <a target="_blank" href="https://www.youtube.com/channel/UCLl8G5ZCdyslVR_4ANkD6GA"><i style="color: #5f5f5f;" class="fab fa-youtube fa-2x"></i></a>
  247.                 </div>
  248.         </div>
  249.     </div>
  250. </nav>
  251. {% include '_navSubSearch.html.twig' %}
  253. {% block body %}
  254. {% endblock %}
  256. {% if app.request.attributes.get('_route') == 'home' %}
  257.     <div id="div-newsletter-mobile" class="" style="display: none">
  258.         <div class="col-lg-12" style="display: flex; justify-content:center; margin-top: 20px;">
  259.            <div class="col-lg-12">
  260.                <p class="newsletter-title">NEWSLETTER</p>
  261.            </div>
  262.         </div>
  263.         <div class="col-lg-12" id="div-form-newsletter" style="display: flex; justify-content: space-around;">
  264.             <form method="post" action="{{ path('mailchimp') }}" id="form-newsletter">
  265.                 <div class="input-group">
  266.                     <input class="form-control input-email" type="email" name="email" placeholder="Votre adresse mail">
  267.                     <button class="btn btn-primary button-newsletter" type="submit"><i class="fas fa-arrow-right"></i></button>
  268.                 </div>
  269.             </form>
  270.         </div>
  271.     </div>
  272. {% endif %}
  273. {% set mentions = content('Footer', 'Footer') %}
  274. {% set cgu = content('Footer', 'Footer2') %}
  275. {% set confidentialite = content('Footer', 'Footer3') %}
  276. {% set cookie = content('Footer', 'Footer4') %}
  277. {% set adress = content('Footer', 'Footer adresse') %}
  278. {% set siege = content('Footer', 'Footer siège') %}
  279. <footer class="footer">
  280.     <div class="container-fluid">
  281.         <ul id="footer-menu" class="footer-menu" style="margin-bottom: -15px;margin-top: -15px;">
  282.             <li>
  283.                 © {{ 'now'|date('Y') }} TRACOL - réalisé par <a href="https://www.idp.lu/" target="_blank" style="font-weight:bold">ID+P</a>
  284.             </li>
  285.             <li style="height: 130px">
  286.                 <!--?xml version="1.0" encoding="UTF-8"?-->
  287.                 <svg id="SVGDoc" width="201" height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:avocode="https://avocode.com/" viewBox="0 0 201 232"><defs></defs><desc>Generated with Avocode.</desc><g><g><title>Ligne 38</title><path d="M100.5,100v32" fill-opacity="0" fill="#ffffff" stroke-dashoffset="0" stroke-linejoin="miter" stroke-linecap="butt" stroke-opacity="1" stroke="#5f5f5f" stroke-miterlimit="20" stroke-width="10"></path></g></g></svg>
  288.             </li>
  289.             <li class="row col-md-3">
  290.                 <div class="col-md-6">
  291.                     Bureaux commerciaux :<br/>
  292.                     {{ adress.content|raw }}
  293.                 </div>
  294.                 <div class="col-md-6">
  295.                     Siège social : 
  296.                     {{ siege.content|raw }}
  297.                 </div>
  298.             </li>
  299.             <li style="height: 130px">
  300.                 <!--?xml version="1.0" encoding="UTF-8"?-->
  301.                 <svg id="SVGDoc" width="201" height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:avocode="https://avocode.com/" viewBox="0 0 201 232"><defs></defs><desc>Generated with Avocode.</desc><g><g><title>Ligne 38</title><path d="M100.5,100v32" fill-opacity="0" fill="#ffffff" stroke-dashoffset="0" stroke-linejoin="miter" stroke-linecap="butt" stroke-opacity="1" stroke="#5f5f5f" stroke-miterlimit="20" stroke-width="10"></path></g></g></svg>
  302.             </li>
  303.             <li class="grey col-md-2 d-flex justify-content-around social">
  304.                 <a target="_blank" href="https://www.facebook.com/tracolimmobilier/"><i class="fab fa-facebook-f fa-2x" style="margin-top:0"></i></a>
  305.                 <a target="_blank" href="https://www.linkedin.com/company/tracol-immobilier-s-a-/"><i class="fab fa-linkedin fa-2x" style="margin-top:0"></i></a>
  306.                 <a target="_blank" href="https://www.instagram.com/tracolimmobilier/"><i class="fab fa-instagram fa-2x" style="cmargin-top:0"></i></a>
  307.                 <a target="_blank" href="https://www.youtube.com/channel/UCLl8G5ZCdyslVR_4ANkD6GA" class="d-flex align-items-end align-items-center"><i class="fab fa-youtube fa-2x"></i></a>
  308.                 <a href="{{ path('contact') }}" class="contact-link"><i class="fa fa-envelope fa-2x"></i></a>
  309.             </li>
  310.             <li class="legal d-flex align-items-center">
  311.                 <div class="d-flex flex-column">
  312.                     <a href="{{ path('mentions') }}" style="margin-bottom:6px;">{{ mentions.name }}</a>
  313.                     <a href="{{ path('cgu') }}" style="margin-bottom:6px">{{ cgu.name }}</a>
  314.                     <a href="{{ path('privacy_policy') }}" style="margin-bottom:6px">{{ confidentialite.name }}</a>
  315.                     <a href="{{ path('cookies') }}" style="margin-bottom:15px">{{ cookie.name }}</a>
  316.                 </div>
  318.             </li>
  319.         </ul>
  321.         <ul id="footer-menu-mobile" class="footer-menu" style="display:none; margin-bottom: -15px;margin-top: -15px;">
  322.             <li class="legal d-flex align-items-center flex-column mt-3">
  323.                 <a href="{{ path('contact') }}" class="grey contact-link mr-0" style="margin-right:0!important;"><i class="fa fa-envelope fa-2x"></i></a>
  324.                 <div class="d-flex flex-column align-items-center">
  325.                     <a href="{{ path('mentions') }}" style="margin-bottom:6px;">{{ mentions.name }}</a>
  326.                     <a href="{{ path('cgu') }}" style="margin-bottom:6px">{{ cgu.name }}</a>
  327.                     <a href="{{ path('privacy_policy') }}" style="margin-bottom:6px">{{ confidentialite.name }}</a>
  328.                     <a href="{{ path('cookies') }}" style="margin-bottom:15px">{{ cookie.name }}</a>
  329.                 </div>
  330.             </li>
  331.             <li>
  332.                 <div>
  333.                     Bureaux commerciaux :<br/>
  334.                     {{ adress.content|raw }}
  335.                 </div>
  336.             </li>
  337.             <li>
  338.                 <div>
  339.                     Siège social : <br />
  340.                     {{ siege.content|raw }}
  341.                 </div>
  342.             </li>
  343.             <li>
  344.                 © 2021 TRACOL - réalisé par <a href="https://www.idp.lu/" target="_blank" style="font-weight:bold">ID+P</a>
  345.             </li>
  346.         </ul>
  347.     </div>
  348. </footer>
  350. <script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>
  352. <script>
  353.     if (window.matchMedia("(max-width: 768px)").matches && window.location.pathname === '/') {
  354.         /* the viewport is less than 768 pixels wide */
  355.     //      $('#projects').slick({
  356.     //     dots: false,
  357.     //     infinite: true,
  358.     //     speed: 300,
  359.     //     slidesToShow: 1,
  360.     //     slidesToScroll: 1,
  361.     //     autoplay: true,
  362.     //     responsive: [
  363.     //         {
  364.     //             breakpoint: 576,
  365.     //             settings: {
  366.     //                 slidesToShow: 1,
  367.     //                 slidesToScroll: 1
  368.     //             }
  369.     //         }
  370.     //         // You can unslick at a given breakpoint now by adding:
  371.     //         // settings: "unslick"
  372.     //         // instead of a settings object
  373.     //     ]
  374.     // });
  375.     }
  376.     //
  377.     // const searchMobile = document.getElementById('search-detail-mobile')
  378.     // const searchSubDivMobile = document.getElementById('sub-search-div-mobile')
  379.     //
  380.     // searchMobile.addEventListener('click', function (e) {
  381.     //     e.preventDefault()
  382.     //     searchSubDivMobile.style.display = 'flex'
  383.     //     searchMobile.style.display = 'none'
  384.     // })
  385. </script>
  387. <script>
  389.     if (document.getElementById('filterProperties')) {
  390.         let formSelectProperties = document.getElementById('filterProperties');
  392.         let properties = document.querySelectorAll('#properties .div-img-hover-2');
  393.         let arrayProperties = [];
  394.         for (let property of properties) {
  395.             arrayProperties.push({
  396.                 'property': property,
  397.                 'price': property.getAttribute('data-price'),
  398.                 'date': new Date(property.getAttribute('data-date')),
  399.             });
  400.         }
  402.         formSelectProperties.addEventListener('change', () => {
  403.             if (formSelectProperties.value === 'desc') {
  404.                 arrayProperties.sort((a,b) =>  b.price - a.price )
  405.             } else if (formSelectProperties.value === 'asc') {
  406.                 arrayProperties.sort((a,b) =>  a.price - b.price )
  407.             } else if (formSelectProperties.value === 'date') {
  408.                 arrayProperties.sort((a,b) =>  b.date - a.date )
  409.             }
  411.             let finalProperties = [];
  412.             let containerProperties = document.getElementById('properties');
  413.             containerProperties.innerHTML = '';
  415.             for (let prop of arrayProperties) {
  416.                 containerProperties.insertAdjacentElement('beforeend', prop.property)
  417.             }
  418.         });
  419.     }
  422.     // let searchglobal = document.getElementById('submit-searchglobal');
  423.         // searchglobal.addEventListener('click', function() {
  424.         //     const formSearch = document.getElementById('form-searchglobal-normal')
  425.         //     const subSearch = document.getElementById('sub-searchglobal-div')
  426.         //     const send = document.getElementById('sendGlobal')
  427.         //             formSearch.classList.toggle('stickyYForm')
  428.         //             send.classList.toggle('send-display')
  429.         //             subSearch.classList.toggle('sub-searchglobal-div-height')
  430.         // })
  431. </script>
  433. <script>
  434.     const swiper = new Swiper('.swiper', {
  436.         loop: false,
  437.     });
  439.     if (window.location.pathname === '/') {
  440.         const navbar = document.getElementsByClassName('navbar navbar-expand-xl fixed-top')
  441.         const header = document.getElementsByClassName('header-home')
  442.         navbar[0].style.backgroundColor = "#fff"
  443.         navbar[0].style.position = "fixed"
  444.         header[0].style.marginTop = "0px"
  445.         header[0].style.height = "100vw"
  446.     }
  448.     let widthWindow = window.innerWidth;
  450.     var searchLocation;
  451.     if (widthWindow > 770) {
  452.         searchLocation = document.getElementById('location-drop');
  453.     } else {
  454.         searchLocation = document.getElementById('location-drop-mobile');
  455.     }
  458.     var searchLocationLi;
  459.     if (widthWindow > 770) {
  460.         searchLocationLi = document.getElementById('location-li');
  461.     } else {
  462.         searchLocationLi = document.getElementById('location-li-mobile');
  463.     }
  465.     const url = '/form/search';
  467.     fetch(url, {
  468.         method: 'GET',
  469.         // body: JSON.stringify({
  470.         //     searchLocation: this.value
  471.         // })
  472.     }).then(function(response) {
  473.         return response.json()
  474.     }).then(function (data) {
  475.         searchLocationLi.innerHTML = '';
  476.         var selected = "Tous";
  477.         {% if app.session.get('filter') is defined and app.session.get('filter')['location'] is defined and app.session.get('filter')['location'] != 'Tous' %} selected = '{{ app.session.get('filter')['location'] }}'; {% endif %}
  478.         for (const datum in data) {
  479.             const li = document.createElement('li')
  480.             li.classList.add('item')
  481.             if(selected == data[datum]) li.classList.add('selected')
  483.             li.dataset.value = data[datum]
  484.             li.addEventListener('click', function () {
  485.                 searchLocation.value = this.dataset.itemName
  486.             })
  487.             li.innerHTML += data[datum]
  488.             searchLocationLi.appendChild(li)
  490.             li.addEventListener('click', event => {
  491.                 li.classList.add('selected');
  492.             });
  493.         }
  495.     searchLocation.addEventListener("click", function (){
  497.             searchLocationLi.addEventListener('click', function (e) {
  498.                 let target = e.target;
  499.                 var dropId;
  500.                 if (widthWindow > 770) {
  501.                     dropId = document.getElementById('location-drop');
  502.                 } else {
  503.                     dropId = document.getElementById('location-drop-mobile');
  504.                 }
  506.                 dropId.querySelector('.undroped-subheader').innerHTML = target.innerHTML
  507.                 dropId.querySelector('.input-subheader').value = target.dataset.value
  508.                 dropId.classList.remove('open')
  509.                 dropId.querySelector('.undroped').style.display = 'block'
  510.                 dropId.querySelector('.droped').style.display = 'none'
  511.                 dropId.querySelector('.undroped-subheader').classList.add('selected')
  512.             })
  513.         });
  514.     })
  516.     const searchTransactionLi = document.getElementById('transaction-li');
  517.     const searchPropertyLi = document.getElementById('property-li');
  518.     const searchRoomLi = document.getElementById('rooms-li');
  519.     const searchAreaLi = document.getElementById('area-li');
  521.     searchTransactionLi.addEventListener('click', function (e) {
  522.         let target = e.target;
  523.         const dropId = document.getElementById('transaction-drop')
  524.         dropId.querySelector('.input-subheader').value = target.dataset.value
  525.     });
  527.     searchPropertyLi.addEventListener('click', function (e) {
  528.         let target = e.target;
  529.         const dropId = document.getElementById('property-drop')
  530.         dropId.querySelector('.input-subheader').value = target.dataset.value
  531.     });
  533.     searchRoomLi.addEventListener('click', function (e) {
  534.         let target = e.target;
  535.         const dropId = document.getElementById('rooms-drop');
  536.         dropId.querySelector('.input-subheader').value = target.dataset.value
  537.     });
  539.     searchAreaLi.addEventListener('click', function (e) {
  540.         let target = e.target;
  541.         const dropId = document.getElementById('area-drop')
  542.         dropId.querySelector('.input-subheader').value = target.dataset.value
  543.     });
  545.     for (const eElement of document.getElementsByClassName('projectButton')) {
  546.         eElement.addEventListener('click', function (e) {
  547.             e.preventDefault()
  549.             for (let button of document.getElementsByClassName('projectButton')) {
  550.                 if (button.classList.contains('all')){
  551.                     button.classList.remove('all')
  552.                     button.classList.add('come')
  553.                     button.querySelector('span').classList.replace('span-all', 'span-projects')
  554.                 }
  555.             }
  557.             eElement.classList.remove('come')
  558.             eElement.classList.add('all')
  559.             eElement.querySelector('span').classList.replace('span-projects', 'span-all')
  561.             fetch('projects/home/display/'+this.dataset.id, {
  562.                 method: 'GET',
  563.             })
  564.                 .then(response => response.json())
  565.                 .then(data => {
  566.                     document.getElementById('projects').innerHTML = ''
  567.                     document.getElementById('projects').innerHTML = data.data
  569.                     if (window.matchMedia("(max-width: 768px)").matches && window.location.pathname === '/') {
  570.                         // if (document.getElementById('projects').classList.contains('slick-initialized')) {
  571.                         //     document.getElementById('projects').classList.remove('slick-initialized')
  572.                         //     document.getElementById('projects').classList.remove('slick-slider')
  573.                         // }
  574.                         // $('#projects').slick({
  575.                         //     dots: false,
  576.                         //     infinite: true,
  577.                         //     speed: 300,
  578.                         //     slidesToShow: 1,
  579.                         //     slidesToScroll: 1,
  580.                         //     autoplay: true,
  581.                         //     responsive: [
  582.                         //         {
  583.                         //             breakpoint: 576,
  584.                         //             settings: {
  585.                         //                 slidesToShow: 1,
  586.                         //                 slidesToScroll: 1
  587.                         //             }
  588.                         //         }
  589.                         //     ]
  590.                         // })
  591.                     }
  593.                     _ww = $(window).width();
  594.                     if (_ww > 768){
  595.                         $('.div-img-hover-2').hover(function (e) {
  597.                             $(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  598.                             var htext = $(this).find('.project-content').height();
  599.                             if (htext == undefined){htext = 0};
  600.                             $(this).find('.div-hover-2').animate({height : htext+180}, 150);
  601.                             $(this).find('.project-content').css({'visibility': 'visible'});
  602.                             $(this).find('.project-content').animate({opacity: 1}, 150);
  604.                         }, function() {
  605.                             $(this).find('.div-hover-2').animate({height : 85}, 150);
  606.                             $(this).find('.project-arrow-2').animate({opacity: 0}, 150);
  608.                             $(this).find('.project-content').animate({opacity: 0}, 150, function(){
  609.                                 $(this).find('.project-content').css({'visibility': 'hidden'});
  610.                             });
  611.                         });
  612.                     } else {
  613.                         $('.div-img-hover-2').on( "click", function( event ) {
  614.                             var opened = $(this).find('.div-hover-2').hasClass('open'),
  615.                                 ht = opened ? 85 : '100%',
  616.                                 vis = opened ? 0 : 1;
  617.                             $(this).find('.div-hover-2').toggleClass('open');
  618.                             $(this).find('.div-hover-2').animate({height : ht}, 150);
  619.                             $(this).find('.project-arrow-2').animate({opacity: vis}, 150);
  620.                             $(this).find('.project-content').animate({opacity: 1}, 150);
  622.                         });
  623.                     }
  624.                     $('.div-hover').hover(function (e) {
  625.                         $(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  626.                     }, function() {
  627.                         $(this).find('.project-arrow-2').animate({opacity: 0}, 50);
  628.                     });
  630.                     $('.div-hover').hover(function (e) {
  631.                         $(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  632.                         var htext = $(this).find('.project-content').height();
  633.                         if (htext == undefined){htext = 0};
  634.                         $(this).animate({height : htext+180}, 150);
  635.                         $(this).find('.project-content').css({'visibility': 'visible'});
  636.                         $(this).find('.project-content').animate({opacity: 1}, 150);
  637.                     }, function() {
  638.                         $(this).find('.project-arrow-2').animate({opacity: 0}, 50);
  639.                         $(this).animate({height : 70}, 150);
  640.                         $(this).find('.project-content').animate({opacity: 0}, 150, function(){
  641.                             $(this).find('.project-content').css({'visibility': 'hidden'});
  642.                         });
  643.                     });
  644.                 })
  646.                 .catch((error) => {
  647.                     console.error('Error:', error);
  648.                 });
  649.         })
  650.     }
  652.     for (const eElement of document.getElementsByClassName('projectButtonref')) {
  653.         eElement.addEventListener('click', function (e) {
  654.             e.preventDefault()
  656.             for (let button of document.getElementsByClassName('projectButtonref')) {
  657.                 if (button.classList.contains('all')){
  658.                     button.classList.remove('all')
  659.                     button.classList.add('come')
  660.                     button.querySelector('span').classList.replace('span-all', 'span-projects')
  661.                 }
  662.             }
  664.             eElement.classList.remove('come')
  665.             eElement.classList.add('all')
  666.             eElement.querySelector('span').classList.replace('span-projects', 'span-all')
  668.             fetch('reference/home/display/'+this.dataset.id, {
  669.                 method: 'GET',
  670.             })
  671.                 .then(response => response.json())
  672.                 .then(data => {
  673.                     document.getElementById('references-home').innerHTML = ''
  674.                     document.getElementById('references-home').innerHTML = data.data
  676.                     _ww = $(window).width();
  677.                     var lightbox = $('.lightbox'),
  678.                         item = 0;
  680.                     $('.lightbox-on').click(function(e){
  681.                         e.stopPropagation();
  682.                         item = 0;
  684.                         var id = $(this).attr('data-id'),
  685.                             max = 0;
  686.                         $('#'+id).toggle();
  687.                         $('#'+id).animate({opacity: 1}, 300);
  688.                         $('#'+id).find('img').each(function( i ) {
  689.                             max = i;
  690.                             item = 1;
  691.                             counter(item, max+1);
  692.                             itemWidth($(this));
  693.                         });
  694.                     });
  696.                     lightbox.click(function(e) {
  697.                         e.stopPropagation();
  698.                         $(this).animate({opacity: 0}, 300, function(){
  699.                             $(this).toggle();
  700.                         });
  701.                     });
  703.                     $('.closer').on('click', function (e) {
  704.                         e.stopPropagation();
  705.                         $(this).parent().animate(
  706.                             {opacity: 0},
  707.                             300,
  708.                             function(){
  709.                                 $(this).toggle();
  710.                             }
  711.                         );
  712.                     });
  714.                     function itemWidth(img){
  715.                         img.closest('.items').width(img.width());
  716.                     }
  718.                     function counter(item, max){
  719.                         $('.counter').text(item + ' / ' + max);
  720.                     }
  722.                     $('.item', lightbox).on('click, swipeleft', function (e) {
  723.                         var wd = $(this).width(),
  724.                             last = $(this).parent().find('.item').last(),
  725.                             img = $(this).find('.img');
  726.                         itemWidth(img);
  728.                         $(this).animate(
  729.                             {marginLeft: -wd, opacity: 0},
  730.                             500,
  731.                             'swing',
  732.                             function(){
  733.                                 $(this).insertAfter(last);
  734.                                 $(this).css({marginLeft: 0, opacity: 1});
  735.                             }
  736.                         );
  737.                     });
  739.                     $('.item', lightbox).on('swiperight', function (e) {
  740.                         var wd = $(this).width(),
  741.                             first = $(this).parent().find('.item').first(),
  742.                             last = $(this).parent().find('.item').last(),
  743.                             img = $(this).find('.img');
  744.                         itemWidth(img);
  746.                         $(last).insertBefore($(this));
  747.                         $(last).css({marginLeft: -wd, opacity: 0});
  748.                         $(this).parent().find('.item').eq(0).animate(
  749.                             {marginLeft: 0, opacity: 1},
  750.                             500,
  751.                             'swing'
  752.                         );
  753.                     });
  755.                     $('.arrows', lightbox).on('click', function (e) {
  756.                         e.stopPropagation();
  758.                         var wd = $(this).siblings('.items').find('.item').eq(0).width(),
  759.                             max = $(this).siblings('.items').find('.item').length,
  760.                             first = $(this).siblings('.items').find('.item').first(),
  761.                             last = $(this).siblings('.items').find('.item').last(),
  762.                             isRight = $(this).hasClass('right'),
  763.                             marginL = isRight ? -wd : 0,
  764.                             marginL0 = isRight ? 0: -wd,
  765.                             opacOn = isRight ? 1 : 0,
  766.                             opacOff = isRight ? 0 : 1;
  768.                         if (!isRight){
  769.                             $(last).insertBefore(first);
  770.                             $(last).css({marginLeft: -wd, opacity: 0});
  771.                             item++;
  772.                             if (item == max+1) {item = 1};
  773.                         } else {
  774.                             item--;
  775.                             if (item == 0) {item = max};
  776.                         };
  778.                         counter(item, max);
  780.                         var img = $(this).siblings('.items').find('.item').eq(0).find('.img');
  781.                         itemWidth(img);
  783.                         $(this).siblings('.items').find('.item').eq(1).animate(
  784.                             {opacity: opacOn},
  785.                             500,
  786.                             'swing');
  788.                         $(this).siblings('.items').find('.item').eq(0).animate(
  789.                             {marginLeft: marginL, opacity: 1},
  790.                             500,
  791.                             'swing',
  792.                             function(){
  793.                                 if (isRight){
  794.                                     $(this).insertAfter(last);
  795.                                     $(this).css({ marginLeft: 0, opacity: 1});
  796.                                 }
  797.                             }
  798.                         );
  799.                     });
  801.                     if (_ww > 768){
  802.                         $('.div-img-hover-2').hover(function (e) {
  803.                             $(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  804.                             var htext = $(this).find('.project-content').height();
  805.                             if (htext == undefined){htext = 0};
  806.                             $(this).find('.div-hover-2').animate({height : htext+180}, 150);
  807.                             $(this).find('.project-content').css({'visibility': 'visible'});
  808.                             $(this).find('.project-content').animate({opacity: 1}, 150);
  809.                         }, function() {
  810.                             $(this).find('.div-hover-2').animate({height : 85}, 150);
  811.                             $(this).find('.project-arrow-2').animate({opacity: 0}, 150);
  813.                             $(this).find('.project-content').animate({opacity: 0}, 150, function(){
  814.                                 $(this).find('.project-content').css({'visibility': 'hidden'});
  815.                             });
  816.                         });
  818.                     } else {
  819.                         $('.div-img-hover-2').on( "tap", function( event ) {
  820.                             var opened = $(this).find('.div-hover-2').hasClass('open'),
  821.                                 ht = opened ? 85 : '100%',
  822.                                 vis = opened ? 0 : 1;
  823.                             $(this).find('.div-hover-2').toggleClass('open');
  824.                             $(this).find('.div-hover-2').animate({height : ht}, 150);
  825.                             $(this).find('.project-arrow-2').animate({opacity: vis}, 150);
  826.                         });
  827.                     }
  828.                 })
  829.                 .catch((error) => {
  830.                     console.error('Error:', error);
  831.                 });
  832.         })
  833.     }
  835.     /*
  836.     window.addEventListener('scroll', function(){
  837.         let search = document.getElementById('submit-search');
  838.         const formSearch = document.getElementById('form-search-normal')
  839.         const subSearch = document.getElementById('sub-search-div')
  840.         const send = document.getElementById('send')
  841.         if (search) {
  842.             search.classList.toggle("stickyY", window.scrollY > 730);
  843.             if (search.classList.contains("stickyY")) {
  844.                 search.setAttribute('type', 'button')
  845.                 search.addEventListener('click', function (e) {
  846.                     e.preventDefault()
  847.                     formSearch.classList.toggle('stickyYForm')
  848.                     send.classList.toggle('send-display')
  849.                     subSearch.classList.toggle('sub-search-div-height')
  850.                 })
  851.             } else  search.setAttribute('type', 'submit')
  852.         }
  853.     })
  854. */
  855. </script>
  857. {#
  858. <script>
  859.     var _dropin = $('.dropdown'),
  860.         _delay = 150,
  861.         _ww = $(window).width();
  863.     $('.undroped', _dropin).on('click', function (e) {
  864.         console.log('CLICKKKK 1')
  865.         $('.dropdown-header').closest('.droped').removeClass('open');
  866.         $('.dropdown-header').closest('.dropdown').find('.undroped').show();
  867.         $('.dropdown-header').closest('.droped').hide();
  868.         $('.dropdown-header').closest('.droped').find('.items').animate({height: 0});
  871.         $(this).hide();
  872.         $(this).siblings('.droped').find('.items').height('auto');
  873.         $(this).siblings('.droped').show();
  875.         var ht = $(this).siblings('.droped').find('.items').height();
  876.         $(this).attr('data-ht', ht);
  877.         $(this).siblings('.droped').find('.items').height(0);
  878.         $(this).siblings('.droped').addClass('open');
  879.         $(this).siblings('.droped').find('.items').animate({height: ht + 40}, _delay);
  880.     });
  882.     $('.dropdown-header', _dropin).on('click', function (e) {
  883.         var ht = $(this).closest('.dropdown').find('.undroped').attr('data-ht');
  885.         $(this).closest('.droped').removeClass('open');
  886.         $(this).closest('.droped').find('.items').animate({height: 0}, _delay, function () {
  887.             $(this).closest('.dropdown').find('.undroped').show();
  888.             $(this).closest('.droped').hide();
  890.         });
  891.     });
  893.     const searchLocationm = document.getElementById('location-drop-mobile');
  894.     const searchLocationLim = document.getElementById('location-li-mobile');
  895.     const urlm = '/form/search';
  897.     searchLocationm.addEventListener("click", function (){
  898.         fetch(urlm, {
  899.             method: 'GET',
  900.             // body: JSON.stringify({
  901.             //     searchLocation: this.value
  902.             // })
  903.         }).then(function(response) {
  904.             return response.json()
  905.         }).then(function (data) {
  906.             searchLocationLim.innerHTML = '';
  907.             for (const datum in data) {
  908.                 const li = document.createElement('li')
  909.                 li.classList.add('item')
  911.                 li.dataset.value = data[datum]
  912.                 li.addEventListener('click', function () {
  913.                     searchLocationm.value = this.dataset.itemName
  914.                 })
  915.                 li.innerHTML += data[datum]
  916.                 searchLocationLim.appendChild(li)
  918.                 li.addEventListener('click', event => {
  919.                     li.classList.add('selected');
  920.                 });
  921.             }
  922.             searchLocationLim.addEventListener('click', function (e) {
  923.                 searchLocationLim.req
  924.                 let target = e.target;
  925.                 const dropId = document.getElementById('location-drop-mobile')
  926.                 dropId.querySelector('.undroped-subheader').innerHTML = target.innerHTML
  927.                 dropId.querySelector('.input-subheader').value = target.dataset.value
  928.                 dropId.classList.remove('open')
  929.                 dropId.querySelector('.undroped').style.display = 'block'
  930.                 dropId.querySelector('.droped').style.display = 'none'
  931.                 dropId.querySelector('.undroped-subheader').classList.add('selected')
  932.             })
  933.         });
  934.     })
  936.     if (window.location.href.includes('action=postule')) {
  937.         let select = document.getElementById('contact_form_object');
  938.         let options = select.childNodes;
  939.         let optionPostule = options[1];
  940.         optionPostule.setAttribute('selected', '')
  941.         console.log(optionPostule)
  942.     }
  943.     /* the viewport is less than 768 pixels wide */
  944.     //      $('#projects').slick({
  945.     //     dots: false,
  946.     //     infinite: true,
  947.     //     speed: 300,
  948.     //     slidesToShow: 1,
  949.     //     slidesToScroll: 1,
  950.     //     autoplay: true,
  951.     //     responsive: [
  952.     //         {
  953.     //             breakpoint: 576,
  954.     //             settings: {
  955.     //                 slidesToShow: 1,
  956.     //                 slidesToScroll: 1
  957.     //             }
  958.     //         }
  959.     //         // You can unslick at a given breakpoint now by adding:
  960.     //         // settings: "unslick"
  961.     //         // instead of a settings object
  962.     //     ]
  963.     // });
  965.     //
  966.     // const searchMobile = document.getElementById('search-detail-mobile')
  967.     // const searchSubDivMobile = document.getElementById('sub-search-div-mobile')
  968.     //
  969.     // searchMobile.addEventListener('click', function (e) {
  970.     //     e.preventDefault()
  971.     //     searchSubDivMobile.style.display = 'flex'
  972.     //     searchMobile.style.display = 'none'
  973.     // })
  974. </script>
  975. #}
  976. </body>
  977. </html>