Symfony Profiler

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tracol | {% block title %}{% endblock %}</title>
{% block metaDescription %}{% endblock %}
<meta name="viewport" content= "width=device-width, initial-scale=1.0">
{% block stylesheets %}
{{ encore_entry_link_tags('app') }}
<link rel="stylesheet" href="https://unpkg.com/@egjs/flicking/dist/flicking.css" crossorigin="anonymous" />
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>

{% endblock %}
{% block javascripts %}
{{ encore_entry_script_tags('app') }}
{# <script id="Cookiebot" src="https://consent.cookiebot.com/uc.js" data-cbid="d4dd1335-1dc0-4d3c-b4c3-49e9043d2e0e" data-blockingmode="auto" type="text/javascript"></script>#}
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous">
</script>
<script src="https://unpkg.com/@egjs/flicking/dist/flicking.pkgd.min.js" crossorigin="anonymous"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>

{% endblock %}
<style>
@media (min-width: 1200px) and (max-width:1498px) {
.navbar-expand-xl .navbar-collapse {
display: flex !important;
/* flex-basis: auto; */
justify-content: center;
}
}
</style>
</head>
<body>
{#<script id="CookieDeclaration" src="https://consent.cookiebot.com/d4dd1335-1dc0-4d3c-b4c3-49e9043d2e0e/cd.js" type="text/javascript" async></script>#}
{% for success in app.flashes('success') %}
<div class="alert alert-success" role="alert">
<p class="alert-link">{{ success }}</p>
</div>
{% endfor %}
{% for error in app.flashes('error') %}
<div class="col-lg-8 mx-auto alert alert-danger" role="alert">
<p class="alert-link">{{ error }}</p>
</div>
{% endfor %}
{#
<div class="d-flex flex-column flex-shrink-0 bg-light black" style="width: 4rem;">
<a href="https://www.facebook.com/tracolimmobilier/"><i class="fab fa-facebook-f"></i></a>
<a href="https://www.linkedin.com/company/tracol-immobilier-s-a-/"><i class="fab fa-linkedin"></i></a>
<a href="https://www.instagram.com/tracolimmobilier/"><i class="fab fa-instagram"></i></a>
</div>
<div id="div-newsletter" class="d-flex flex-column flex-shrink-0 bg-light orange">
<a id="text-vertical" class="text-vertical" href="#">NEWSLETTER</a>
<div id="div-form-newsletter" style="opacity: 0">
<span id="span-newsletter" style="opacity: 0">Restez informé ! Abonnez-vous à notre newsletter.</span>
<form action="{{ path('mailchimp') }}" id="form-newsletter" style="display: none">
<div class="input-group">
<input id="input-email" class="form-control input-email" type="email" name="email" placeholder="Votre adresse mail">
<button class="btn btn-primary button-newsletter" type="submit"><i class="fas fa-arrow-right"></i></button>
</div>
</form>
</div>
</div>
#}
<nav class="navbar navbar-expand-xl fixed-top homepage">
<div id="center-nav" class="container-fluid">
<button class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon">
<i class="fas fa-bars"></i>
</span>
</button>
<a href="{{ path('index') }}" class="tracol-logo">
<svg xmlns="http://www.w3.org/2000/svg" width="136.339" height="51.127" viewBox="0 0 136.339 51.127">
<g id="Groupe_4469" data-name="Groupe 4469" transform="translate(11823.999 14639)">
<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"/>
<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)"/>
<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)"/>
<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)"/>
<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)"/>
<rect id="Rectangle_73" data-name="Rectangle 73" width="1.585" height="8.956" transform="translate(-11803.191 -14596.829)"/>
<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)"/>
<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)"/>
<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)"/>
<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)"/>
<rect id="Rectangle_74" data-name="Rectangle 74" width="1.586" height="8.956" transform="translate(-11753.034 -14596.829)"/>
<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)"/>
<rect id="Rectangle_75" data-name="Rectangle 75" width="1.586" height="8.956" transform="translate(-11738.931 -14596.829)"/>
<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)"/>
<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)"/>
</g>
</svg>
</a>
<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">
<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">
<g id="Groupe_3817" data-name="Groupe 3817" transform="translate(-1528.861 -105)">
<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"/>
<g id="Groupe_3794" data-name="Groupe 3794" transform="translate(1545.335 126.696)">
<g id="np_search_1868241_000000">
<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"/>
<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"/>
</g>
</g>
</g>
</svg>
</button>

<div class="modal fade bd-example-modal-lg" id="exampleModal1" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="col-lg-12">
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" style="font-size:2em;position: absolute;right: 15px;"></button>
<div name="form-search-normal-mobile" id="form-search-normal-mobile" class="div-svg-header">
<form action="{{ path('results') }}" style="display: flex; align-items: center; width: 100%">
<div class="container-form-mobile" style="display: flex;flex-direction: column;justify-content: center; ">
<div class="selectors mobile" style="display: flex; align-items: center; width: auto;">
<div id="transaction-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Type de transaction</p>
<p name="transaction-type" class="undroped-subheader">Achat ou Location</p>
<input type="hidden" value="" class="input-subheader" name="transaction-type">
</div>
<div class="droped">
<div class="dropdown-header">Type de transaction</div>
<ul id="transaction-li" class="items">
<li class="item" data-value ="Vente">Achat</li>
<li class="item" data-value ="Location">Location</li>
{#
<li class="item" data-value ="Viager">Viager</li>
<li class="item" data-value ="Enchere">Enchère</li>
#}
</ul>
</div>
</div>
<div id="property-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Type de biens</p>
<p name="property-type" class="undroped-subheader">Appartement, Bureau, ...</p>
<input type="hidden" value="" class="input-subheader" name="property-type">
</div>
<div class="droped">
<div class="dropdown-header">Type de biens</div>
<ul id="property-li" class="items">
{% for type in get_properties.getTypesProperties() %}
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == type %}selected{% endif %}" data-value="{{ type }}">{{ type }}</li>
{% endfor %}
{#
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Studio' %}selected{% endif %}" data-value="Studio">Studio</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Appartement' %}selected{% endif %}" data-value="Appartement">Appartement</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Maison' %}selected{% endif %}" data-value="Maison">Maison</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Bureaux' %}selected{% endif %}" data-value="Bureaux">Bureau</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Commerce' %}selected{% endif %}" data-value="Commerce">Commerce</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Garage / Parking' %}selected{% endif %}" data-value="Garage / Parking">Garage / Parking</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Immeuble' %}selected{% endif %}" data-value="Immeuble">Immeuble</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Cave / Box' %}selected{% endif %}" data-value="Cave / Box">Cave / Box</li>
#}
</ul>
</div>
</div>
<div id="location-drop-mobile" class="dropdown">
<div class="undroped">
<p class="undroped-header">Localisation</p>
<p class="undroped-subheader">Choisissez une commune</p>
<input type="hidden" value="" class="input-subheader" name="location">
</div>
<div class="droped">
<div class="dropdown-header">Localisation</div>
<ul id="location-li-mobile" class="items">
{#
<li class="item" data-value ="Appartement">Luxembourg-Ville</li>
<li class="item" data-value ="Bureaux">Leudelange</li>
<li class="item" data-value ="Maison">Esch-Sur-Alzette</li>
#}
</ul>
</div>
</div>
</div>
<div id="sub-search-div-mobile" class="sub-search-div-mobile">
<div class="col-lg-3 div-form">
<input class="sub-search-input" name="budget" id="budget" type="text" placeholder="Budget max.">
</div>
<div id="rooms-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header transparent-font">Nombre de chambres</p>
<p class="undroped-subheader good-place"></p>
<input type="hidden" class="input-subheader" name="rooms">
</div>
<div class="droped">
<div class="dropdown-header" style="color:#5f5f5f">Nombre de chambres</div>
<ul id="rooms-li" class="items">
<li class="item" data-value ="">Indifférent</li>
<li class="item" data-value ="1">1</li>
<li class="item" data-value ="2">2</li>
<li class="item" data-value ="3">3</li>
<li class="item" data-value ="4">4</li>
<li class="item" data-value ="5">5</li>
<li class="item" data-value ="6">6</li>
</ul>
</div>
</div>

<div id="area-drop" class="dropdown" style="border: 1px solid black;">
<div class="undroped">
<p class="undroped-header transparent-font">
{% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined %}
{% if app.session.get('filter')['area-minimum'] == '' %}
Indifférent
{% else %}
{{ app.session.get('filter')['area-minimum'] }}
{% endif %}
{% else %}
Surface minimum
{% endif %}</p>
<p class="undroped-subheader good-place"></p>
<input type="hidden" class="input-subheader" name="area-minimum">
</div>
<div class="droped">
<div class="dropdown-header">Surface minimum</div>
<ul id="area-li" class="items">
<li class="item" data-value="">Indifférent</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 20 %}selected{% endif %}" data-value ="20">20 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 30 %}selected{% endif %}" data-value ="30">30 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 40 %}selected{% endif %}" data-value ="40">40 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 50 %}selected{% endif %}" data-value ="50">50 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 60 %}selected{% endif %}" data-value ="60">60 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 70 %}selected{% endif %}" data-value ="70">70 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 80 %}selected{% endif %}" data-value ="80">80 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 90 %}selected{% endif %}" data-value ="90">90 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 100 %}selected{% endif %}" data-value ="100">100 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 110 %}selected{% endif %}" data-value ="110">110 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 120 %}selected{% endif %}" data-value ="120">120 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 130 %}selected{% endif %}" data-value ="130">130 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 140 %}selected{% endif %}" data-value ="140">140 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 150 %}selected{% endif %}" data-value ="150">150 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 160 %}selected{% endif %}" data-value ="160">160 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 170 %}selected{% endif %}" data-value ="170">170 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 180 %}selected{% endif %}" data-value ="180">180 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 190 %}selected{% endif %}" data-value ="190">190 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 200 %}selected{% endif %}" data-value ="200">200 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 250 %}selected{% endif %}" data-value ="250">250 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 300 %}selected{% endif %}" data-value ="300">300 m²</li>
</ul>
</div>
</div>
</div>
<div>
<button style="background-color: transparent;border-color: transparent;" id="submit-search" type="submit">
<svg class="search-button" xmlns="http://www.w3.org/2000/svg" width="55.982" height="90.97" viewBox="0 0 55.982 90.97">
<g id="Groupe_3817" data-name="Groupe 3817" transform="translate(-1528.861 -105)">
<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"/>
<g id="Groupe_3794" data-name="Groupe 3794" transform="translate(1545.335 126.696)">
<g id="np_search_1868241_000000">
<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"/>
<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"/>
</g>
</g>
</g>
</svg></button>
<button class="btn btn-primary" id="send" type="submit" style="display: none">Envoyer</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="nav-elements collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
{#
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="{{ path('tracol') }}">Tracol</a>
</li>
#}
<li class="nav-item">
<a class="nav-link" href="{{ path('about') }}">Qui sommes-nous</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ path('properties', {'keyword': 'vente'}) }}">Acheter</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ path('properties', {'keyword': 'location'}) }}">Louer</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ path('vendre', {'keyword': 'location'}) }}">Vendre</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ path('projects', {'keyword': 'location'}) }}">Projets</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ path('reference') }}">Références</a>
</li>
{#
<li class="nav-item">
<a class="nav-link" href="{{ path('team') }}">Notre equipe</a>
</li>
#}
{# <li class="nav-item">#}
{# <a class="nav-link" href="#">Actualités</a>#}
{# </li>#}
{#
<li class="nav-item">
<a class="nav-link" href="{{ path('carrieres') }}">Carrières</a>
</li>
#}
<li id="enveloppe-mobile" class="nav-item">
<a class="nav-link" href="{{ path('contact') }}">
{#
<i class="far fa-envelope"></i>
#}
Contact
</a>
</li>
</ul>
</div>
<div class="contacts-social">
<div class="phone-contact">
<div>
<svg class="svg-phone" xmlns="http://www.w3.org/2000/svg" width="31.059" height="27.732" viewBox="0 0 31.059 27.732">
<g id="np_phone-call_3960627_000000" transform="translate(-6.248 -15.626)">
<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="#f6a400"/>
</g>
</svg>
</div>
<div>
<p class="phone">
{#
Besoin d'informations ? <br>
#}
<a href="tel:+3522658601">(+352) 26 58 60-1</a>
</p>
</div>
</div>
<div class="col-md-2 d-flex justify-content-between w-100 mt-3">
<a target="_blank" href="https://www.facebook.com/tracolimmobilier/" style="width:20px;"><i class="fab fa-facebook-f fa-2x" style="color:#f6a400;margin-top:0;width:20px;height:20px;"></i></a>
<a target="_blank" href="https://www.linkedin.com/company/tracol-immobilier-s-a-/" style="width:20px;"><i class="fab fa-linkedin fa-2x" style="color:#f6a400;margin-top:0;width:20px;height:20px;"></i></a>
<a target="_blank" href="https://www.instagram.com/tracolimmobilier/" style="width:20px;"><i class="fab fa-instagram fa-2x" style="color:#f6a400;margin-top:0;width:20px;height:20px;"></i></a>
<a target="_blank" href="https://www.youtube.com/channel/UCLl8G5ZCdyslVR_4ANkD6GA" class="d-flex align-items-end align-items-center" style="width:20px;"><i class="fab fa-youtube fa-2x" style="color:#f6a400;width:20px;height:20px;"></i></a>
</div>
</div>
<div id="footer-nav-mobile" class="col-lg-2" style="display: none">
<div class="col-lg-12 opacity-mobile" style="display: flex; flex-direction: row">
<div id="svg-phone" class="col-lg-4" style="margin-top:0;">
<a class="nav-link d-flex align-items-center" style="height: 42px;padding:0;margin-right:25px;" href="tel:+3522658601">
<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">
<g id="np_phone-call_3960627_000000" transform="translate(-6.248 -15.626)">
<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="black"/>
</g>
</svg>
</a>
</div>
<div class="col-lg-6 opacity-mobile">
<a class="nav-link d-flex align-items-center" style="height: 42px;padding:0;" href="{{ path('contact') }}"><i style="color: #5f5f5f;margin-right: 15px;" class="far fa-envelope fa-2x"></i></a>
</div>
</div>
<div class="col-8 col-lg-12 m-auto opacity-mobile mt-3" style="display: flex;justify-content: space-between; opacity: 0">
<div class="col-2 col-lg-2">
<a class="d-flex align-items-center justify-content-center" target="_blank" href="https://www.facebook.com/tracolimmobilier/"><i style="color: #5f5f5f;padding:0;margin:0;" class="fab fa-facebook-f"></i></a>
</div>
<div class="col-2 col-lg-2">
<a class="d-flex align-items-center justify-content-center" target="_blank" href="https://www.linkedin.com/company/tracol-immobilier-s-a-/"><i style="color: #5f5f5f;padding:0;margin:0;" class="fab fa-linkedin"></i></a>
</div>
<div class="col-2 col-lg-2">
<a class="d-flex align-items-center justify-content-center" target="_blank" href="https://www.instagram.com/tracolimmobilier/"><i style="color: #5f5f5f;padding:0;margin:0;" class="fab fa-instagram"></i></a>
</div>
<div class="col-2 col-lg-2">
<a class="d-flex align-items-center justify-content-center" target="_blank" href="https://www.youtube.com/channel/UCLl8G5ZCdyslVR_4ANkD6GA"><i style="color: #5f5f5f;padding:0;margin:0;" class="fab fa-youtube fa-2x"></i></a>
</div>
</div>
</div>
</div>
</nav>
<div id="formResearchNav" class="d-flex justify-content-center">
<form action="{{ path('results') }}" class="col-lg-8 form-search-filter" style="display: flex; align-items: center;">
<div class="container-form-search" style="display: flex;flex-direction: column;justify-content: center; width: 71.666vw;position:relative">
<div class="selectors" style="display: flex; align-items: center; width: auto;justify-content: space-between;z-index:9;">
<div id="transaction-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Type de transaction</p>
<p name="transaction-type" class="undroped-subheader {% if app.session.get('filter')['transaction-type'] is defined %}selected{% endif %}">
{% if app.session.get('filter') and app.session.get('filter')['transaction-type'] == 'Vente' or (app.request.attributes.get('_route_params')['keyword'] is defined and app.request.attributes.get('_route_params')['keyword'] == 'vente') %}
Achat
{% elseif app.session.get('filter') and app.session.get('filter')['transaction-type'] == 'Location' or (app.request.attributes.get('_route_params')['keyword'] is defined and app.request.attributes.get('_route_params')['keyword'] == 'location') %}
Location
{% else %}
Achat ou Location
{% endif %}
</p>
<input type="hidden"
{% if app.session.get('filter') and app.session.get('filter')['transaction-type'] == 'Vente' or (app.request.attributes.get('_route_params')['keyword'] is defined and app.request.attributes.get('_route_params')['keyword'] == 'vente') %}
value="Vente"
{% elseif app.session.get('filter') and app.session.get('filter')['transaction-type'] == 'Location' or (app.request.attributes.get('_route_params')['keyword'] is defined and app.request.attributes.get('_route_params')['keyword'] == 'location') %}
value="Location"
{% endif %}
value=""
class="input-subheader" name="transaction-type">
</div>
<div class="droped">
<div class="dropdown-header">Type de transaction</div>
<ul id="transaction-li" class="items">
{#
<li class="item" data-value="">Achat ou Location</li>
#}
<li class="item {% if app.session.get('filter') and app.session.get('filter')['transaction-type'] == 'Vente' or (app.request.attributes.get('_route_params')['keyword'] is defined and app.request.attributes.get('_route_params')['keyword'] == 'vente') %}selected{% endif %}" data-value ="Vente">Achat</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['transaction-type'] == 'Location' or (app.request.attributes.get('_route_params')['keyword'] is defined and app.request.attributes.get('_route_params')['keyword'] == 'location') %}selected{% endif %}" data-value ="Location">Location</li>
{#
<li class="item" data-value ="Location saisonnière">Location saisonniere</li>
<li class="item" data-value ="Programme">Programme</li>
#}
{# <li class="item" data-value ="Viager">Viager</li>#}
{# <li class="item" data-value ="Enchere">Enchère</li>#}
</ul>
</div>
</div>
<div id="property-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Type de biens</p>
<p name="property-type" class="undroped-subheader {% if app.session.get('filter')['property-type'] is defined %}selected{% endif %}">
{% if app.session.get('filter') is defined and app.session.get('filter')['property-type'] is defined and app.session.get('filter')['property-type'] != '' %}
{{ app.session.get('filter')['property-type'] }}
{% else %}
Tous
{% endif %}
</p>
<input type="hidden" value="{% if app.session.get('filter')['property-type'] is defined and app.session.get('filter')['property-type'] %}{{ app.session.get('filter')['property-type'] }}{% endif %}" class="input-subheader" name="property-type">
</div>
<div class="droped">
<div class="dropdown-header">Type de biens</div>
<ul id="property-li" class="items">
<li class="item" data-value="">Tous</li>
{% for type in get_properties.getTypesProperties() %}
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == type %}selected{% endif %}" data-value="{{ type }}">{{ type }}</li>
{% endfor %}
{#
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Appartement' %}selected{% endif %}" data-value="Appartement">Appartement</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Duplex' %}selected{% endif %}" data-value="Duplex">Duplex</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Maison' %}selected{% endif %}" data-value="Maison">Maison</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Bureaux' %}selected{% endif %}" data-value="Bureaux">Bureau</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Commerce' %}selected{% endif %}" data-value="Commerce">Commerce</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Immeuble' %}selected{% endif %}" data-value="Immeuble">Immeuble</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Garage / Parking' %}selected{% endif %}" data-value="Garage / Parking">Garage / Parking</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Cave / Box' %}selected{% endif %}" data-value="Cave / Box">Cave / Box</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Terrain' %}selected{% endif %}" data-value="Terrain">Terrain</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['property-type'] == 'Penthouse' %}selected{% endif %}" data-value="Penthouse">Penthouse</li>
#}
</ul>
</div>
</div>
<div id="location-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header">Localisation</p>
<p class="undroped-subheader {% if app.session.get('filter')['location'] is defined %}selected{% endif %}">
{% if app.session.get('filter') and app.session.get('filter')['location'] %}
{{ app.session.get('filter')['location'] }}
{% else %}
Choisissez une commune
{% endif %}
</p>
<input type="hidden" value="{% if app.session.get('filter')['location'] is defined and app.session.get('filter')['location'] %}{{ app.session.get('filter')['location'] }}{% endif %}" class="input-subheader" name="location">
</div>
<div class="droped">
<div class="dropdown-header">Localisation</div>
<ul id="location-li" class="items">
<li class="item" data-value ="">Tous</li>
{# <li class="item" data-value ="Appartement">Luxembourg-Ville</li>#}
{# <li class="item" data-value ="Bureaux">Leudelange</li>#}
{# <li class="item" data-value ="Maison">Esch-Sur-Alzette</li>#}
</ul>
</div>
</div>
<div class="div-form">
<button style="background-color: transparent;border-color: transparent;" id="submit-search" type="submit">
<svg class="search-button" xmlns="http://www.w3.org/2000/svg" width="55.982" height="90.97" viewBox="0 0 55.982 90.97">
<g id="Groupe_3817" data-name="Groupe 3817" transform="translate(-1528.861 -105)">
<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"/>
<g id="Groupe_3794" data-name="Groupe 3794" transform="translate(1545.335 126.696)">
<g id="np_search_1868241_000000">
<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"/>
<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"/>
</g>
</g>
</g>
</svg>
</button>
</div>
<div>
<button id="search-detail" class="btn btn-primary child search">RECHERCHE AVANCÉE</button>
<button class="btn btn-primary" id="send" type="submit" style="display: none">Envoyer</button>
</div>
</div>
<div id="sub-search-div" class="sub-search-div" style="display: none">
<div class="col-lg-3 div-form">
<input class="sub-search-input" name="budget" value="{% if app.session.get('filter') %}{{ app.session.get('filter')['budget'] }}{% endif %}" id="budget" type="text" placeholder="Budget max.">
</div>
<div id="rooms-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header transparent-font">{% if app.session.get('filter') and app.session.get('filter')['rooms'] %}{{ app.session.get('filter')['rooms'] }}{% else %}Nombre de chambres{% endif %}</p>
<p class="undroped-subheader good-place"></p>
<input type="hidden" class="input-subheader" name="rooms">
</div>
<div class="droped">
<div class="dropdown-header">Nombre de chambres</div>
<ul id="rooms-li" class="items">
<li class="item" data-value="">Indifférent</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['rooms'] == 1 %}selected{% endif %}" data-value ="1">1</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['rooms'] == 2 %}selected{% endif %}" data-value ="2">2</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['rooms'] == 3 %}selected{% endif %}" data-value ="3">3</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['rooms'] == 4 %}selected{% endif %}" data-value ="4">4</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['rooms'] == 5 %}selected{% endif %}" data-value ="5">5</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['rooms'] == 6 %}selected{% endif %}" data-value ="6">6</li>
</ul>
</div>
</div>
<div id="area-drop" class="dropdown">
<div class="undroped">
<p class="undroped-header transparent-font">
{% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined %}
{% if app.session.get('filter')['area-minimum'] == '' %}
Indifférent
{% else %}
{{ app.session.get('filter')['area-minimum'] }}
{% endif %}
{% else %}
Surface minimum
{% endif %}
</p>
<p class="undroped-subheader good-place"></p>
<input type="hidden" class="input-subheader" name="area-minimum">
</div>
<div class="droped">
<div class="dropdown-header">Surface minimum</div>
<ul id="area-li" class="items">
<li class="item {% if app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == '' %}selected{% endif %}" data-value="">Indifférent</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 20 %}selected{% endif %}" data-value ="20">20 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 30 %}selected{% endif %}" data-value ="30">30 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 40 %}selected{% endif %}" data-value ="40">40 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 50 %}selected{% endif %}" data-value ="50">50 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 60 %}selected{% endif %}" data-value ="60">60 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 70 %}selected{% endif %}" data-value ="70">70 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 80 %}selected{% endif %}" data-value ="80">80 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 90 %}selected{% endif %}" data-value ="90">90 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 100 %}selected{% endif %}" data-value ="100">100 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 110 %}selected{% endif %}" data-value ="110">110 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 120 %}selected{% endif %}" data-value ="120">120 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 130 %}selected{% endif %}" data-value ="130">130 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 140 %}selected{% endif %}" data-value ="140">140 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 150 %}selected{% endif %}" data-value ="150">150 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 160 %}selected{% endif %}" data-value ="160">160 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 170 %}selected{% endif %}" data-value ="170">170 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 180 %}selected{% endif %}" data-value ="180">180 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 190 %}selected{% endif %}" data-value ="190">190 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 200 %}selected{% endif %}" data-value ="200">200 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 250 %}selected{% endif %}" data-value ="250">250 m²</li>
<li class="item {% if app.session.get('filter') and app.session.get('filter')['area-minimum'] is defined and app.session.get('filter')['area-minimum'] == 300 %}selected{% endif %}" data-value ="300">300 m²</li>
</ul>
</div>
</div>
{#
<div class="col-lg-3 div-form">
<input class="sub-search-input" id="area-minimum" value="{% if app.session.get('filter') %}{{ app.session.get('filter')['area-minimum'] }}{% endif %}" name="area-minimum" type="text" placeholder="Surface minimum.">
</div>
#}
</div>
</div>
</form>
</div>
{% block body %}
{% endblock %}
{% if app.request.attributes.get('_route') == 'home' %}
<div id="div-newsletter-mobile" class="" style="display: none">
<div class="col-lg-12" style="display: flex; justify-content:center; margin-top: 20px;">
<div class="col-lg-12">
<p class="newsletter-title">NEWSLETTER</p>
</div>
</div>
<div class="col-lg-12" id="div-form-newsletter" style="display: flex; justify-content: space-around;">
<form method="post" action="{{ path('mailchimp') }}" id="form-newsletter">
<div class="input-group">
<input class="form-control input-email" type="email" name="email" placeholder="Votre adresse mail">
<button class="btn btn-primary button-newsletter" type="submit"><i class="fas fa-arrow-right"></i></button>
</div>
</form>
</div>
</div>
{% endif %}
<footer class="footer">
<div class="container-fluid">
<ul id="footer-menu" class="footer-menu" style="margin-bottom: -15px;margin-top: -15px;">
<li>
© {{ 'now'|date('Y') }} TRACOL - réalisé par <a href="https://www.idp.lu/" target="_blank" style="color:#fff;font-weight:bold">ID+P</a>
</li>
<li style="height: 160px">

<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>
</li>
<li class="row col-md-3">
<div class="col-md-6">
Bureaux commerciaux :<br>
<span style="font-weight: 600;">5 rue Jules Ferry</span><br>
<span> L-4368 Belvaux</span>
</div>
<div class="col-md-6">
Siège social :<br>
<span style="font-weight: 600;">Z.I. Rohlach</span><br>
<span>L-5280 Sandweiller</span>
</div>
</li>
<li style="height: 130px">

<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>
</li>
<li class="col-md-2 d-flex justify-content-around">
<a target="_blank" href="https://www.facebook.com/tracolimmobilier/"><i class="fab fa-facebook-f fa-2x" style="color:#fff;margin-top:0"></i></a>
<a target="_blank" href="https://www.linkedin.com/company/tracol-immobilier-s-a-/"><i class="fab fa-linkedin fa-2x" style="color:#fff;margin-top:0"></i></a>
<a target="_blank" href="https://www.instagram.com/tracolimmobilier/"><i class="fab fa-instagram fa-2x" style="color:#fff;margin-top:0"></i></a>
<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" style="color:#fff"></i></a>
</li>
<li style="height: 130px" class="last-separator">

<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>
</li>
<li class="grey legal d-flex align-items-center">
<a href="{{ path('contact') }}" class="contact-link"><i class="fa fa-envelope fa-2x" style="color:#fff"></i></a>
<div class="d-flex flex-column">
<a href="{{ path('mentions') }}" style="color:#fff!important;margin-bottom:6px;">Mentions légales</a>
<a href="{{ path('cgu') }}" style="color:#fff!important;margin-bottom:6px">Conditions Générales d'Utilisation</a>
<a href="{{ path('privacy_policy') }}" style="color:#fff!important;margin-bottom:6px">Politique de confidentialité</a>
<a href="{{ path('cookies') }}" style="color:#fff!important;margin-bottom:15px">Gestion des cookies</a>
</div>
</li>
</ul>
<ul id="footer-menu-mobile" class="footer-menu" style="display:none; margin-bottom: -15px;margin-top: -15px;">
<li class="grey legal d-flex align-items-center flex-column mt-3">
<a href="{{ path('contact') }}" class="contact-link mr-0" style="margin-right:0!important;"><i class="fa fa-envelope fa-2x" style="color:#fff"></i></a>
<div class="d-flex flex-column align-items-center">
<a href="{{ path('mentions') }}" style="color:#fff!important;margin-bottom:6px;">Mentions légales</a>
<a href="{{ path('cgu') }}" style="color:#fff!important;margin-bottom:6px">Conditions Générales d'Utilisation</a>
<a href="{{ path('privacy_policy') }}" style="color:#fff!important;margin-bottom:6px">Politique de confidentialité</a>
<a href="{{ path('cookies') }}" style="color:#fff!important;margin-bottom:15px">Gestion des cookies</a>
</div>
</li>
<li>
<div style="display: flex">
<span style="font-weight: 600;">Z.I. Rohlach</span><br>
<span>L-5280 Sandweiller</span>
</div>
</li>
<li>
© 2021 TRACOL - réalisé par <a href="https://www.idp.lu/" target="_blank" style="color:#fff;font-weight:bold">ID+P</a>
</li>
</ul>
</div>
</footer>
<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>
<script>
if (window.matchMedia("(max-width: 768px)").matches && window.location.pathname === '/') {
/* the viewport is less than 768 pixels wide */
// $('#projects').slick({
// dots: false,
// infinite: true,
// speed: 300,
// slidesToShow: 1,
// slidesToScroll: 1,
// autoplay: true,
// responsive: [
// {
// breakpoint: 576,
// settings: {
// slidesToShow: 1,
// slidesToScroll: 1
// }
// }
// // You can unslick at a given breakpoint now by adding:
// // settings: "unslick"
// // instead of a settings object
// ]
// });
}
//
// const searchMobile = document.getElementById('search-detail-mobile')
// const searchSubDivMobile = document.getElementById('sub-search-div-mobile')
//
// searchMobile.addEventListener('click', function (e) {
// e.preventDefault()
// searchSubDivMobile.style.display = 'flex'
// searchMobile.style.display = 'none'
// })
</script>
<script>
if (document.getElementById('filterProperties')) {
let formSelectProperties = document.getElementById('filterProperties');
let properties = document.querySelectorAll('#properties .div-img-hover-2');
let arrayProperties = [];
for (let property of properties) {
arrayProperties.push({
'property': property,
'price': property.getAttribute('data-price'),
'date': new Date(property.getAttribute('data-date')),
});
}
formSelectProperties.addEventListener('change', () => {
if (formSelectProperties.value === 'desc') {
arrayProperties.sort((a,b) => b.price - a.price )
} else if (formSelectProperties.value === 'asc') {
arrayProperties.sort((a,b) => a.price - b.price )
} else if (formSelectProperties.value === 'date') {
arrayProperties.sort((a,b) => b.date - a.date )
}
let finalProperties = [];
let containerProperties = document.getElementById('properties');
containerProperties.innerHTML = '';
for (let prop of arrayProperties) {
console.log(prop.property)
containerProperties.insertAdjacentElement('beforeend', prop.property)
}
});
}
// let searchglobal = document.getElementById('submit-searchglobal');
// searchglobal.addEventListener('click', function() {
// const formSearch = document.getElementById('form-searchglobal-normal')
// const subSearch = document.getElementById('sub-searchglobal-div')
// const send = document.getElementById('sendGlobal')
// formSearch.classList.toggle('stickyYForm')
// send.classList.toggle('send-display')
// subSearch.classList.toggle('sub-searchglobal-div-height')
// })
</script>
<script>
const swiper = new Swiper('.swiper', {
loop: false,
});
if (window.location.pathname === '/') {
const navbar = document.getElementsByClassName('navbar navbar-expand-xl fixed-top')
const header = document.getElementsByClassName('header-home')
navbar[0].style.backgroundColor = "#fff"
navbar[0].style.position = "fixed"
header[0].style.marginTop = "0px"
header[0].style.height = "100vw"
}
let widthWindow = window.innerWidth;
var searchLocation;
if (widthWindow > 770) {
searchLocation = document.getElementById('location-drop');
} else {
searchLocation = document.getElementById('location-drop-mobile');
}
var searchLocationLi;
if (widthWindow > 770) {
searchLocationLi = document.getElementById('location-li');
} else {
searchLocationLi = document.getElementById('location-li-mobile');
}
const url = '/form/search';
fetch(url, {
method: 'GET',
// body: JSON.stringify({
// searchLocation: this.value
// })
}).then(function(response) {
return response.json()
}).then(function (data) {
console.log(data)
searchLocationLi.innerHTML = '';
for (const datum in data) {
const li = document.createElement('li')
li.classList.add('item')
li.dataset.value = data[datum]
li.addEventListener('click', function () {
searchLocation.value = this.dataset.itemName
})
li.innerHTML += data[datum]
searchLocationLi.appendChild(li)
li.addEventListener('click', event => {
li.classList.add('selected');
});
}
searchLocation.addEventListener("click", function (){
searchLocationLi.addEventListener('click', function (e) {
let target = e.target;
var dropId;
if (widthWindow > 770) {
dropId = document.getElementById('location-drop');
} else {
dropId = document.getElementById('location-drop-mobile');
}
dropId.querySelector('.undroped-subheader').innerHTML = target.innerHTML
dropId.querySelector('.input-subheader').value = target.dataset.value
dropId.classList.remove('open')
dropId.querySelector('.undroped').style.display = 'block'
dropId.querySelector('.droped').style.display = 'none'
dropId.querySelector('.undroped-subheader').classList.add('selected')
})
});
})
const searchTransactionLi = document.getElementById('transaction-li');
console.log(searchTransactionLi);
const searchPropertyLi = document.getElementById('property-li');
const searchRoomLi = document.getElementById('rooms-li');
const searchAreaLi = document.getElementById('area-li');
searchTransactionLi.addEventListener('click', function (e) {
let target = e.target;
const dropId = document.getElementById('transaction-drop')
dropId.querySelector('.input-subheader').value = target.dataset.value
});
searchPropertyLi.addEventListener('click', function (e) {
let target = e.target;
const dropId = document.getElementById('property-drop')
dropId.querySelector('.input-subheader').value = target.dataset.value
});
searchRoomLi.addEventListener('click', function (e) {
let target = e.target;
const dropId = document.getElementById('rooms-drop');
dropId.querySelector('.input-subheader').value = target.dataset.value
});
searchAreaLi.addEventListener('click', function (e) {
let target = e.target;
const dropId = document.getElementById('area-drop')
dropId.querySelector('.input-subheader').value = target.dataset.value
});
for (const eElement of document.getElementsByClassName('projectButton')) {
eElement.addEventListener('click', function (e) {
e.preventDefault()
for (let button of document.getElementsByClassName('projectButton')) {
if (button.classList.contains('all')){
button.classList.remove('all')
button.classList.add('come')
button.querySelector('span').classList.replace('span-all', 'span-projects')
}
}
eElement.classList.remove('come')
eElement.classList.add('all')
eElement.querySelector('span').classList.replace('span-projects', 'span-all')
fetch('projects/home/display/'+this.dataset.id, {
method: 'GET',
})
.then(response => response.json())
.then(data => {
document.getElementById('projects').innerHTML = ''
document.getElementById('projects').innerHTML = data.data
if (window.matchMedia("(max-width: 768px)").matches && window.location.pathname === '/') {
// if (document.getElementById('projects').classList.contains('slick-initialized')) {
// document.getElementById('projects').classList.remove('slick-initialized')
// document.getElementById('projects').classList.remove('slick-slider')
// }
// $('#projects').slick({
// dots: false,
// infinite: true,
// speed: 300,
// slidesToShow: 1,
// slidesToScroll: 1,
// autoplay: true,
// responsive: [
// {
// breakpoint: 576,
// settings: {
// slidesToShow: 1,
// slidesToScroll: 1
// }
// }
// ]
// })
}
_ww = $(window).width();
if (_ww > 768){
$('.div-img-hover-2').hover(function (e) {
$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
var htext = $(this).find('.project-content').height();
if (htext == undefined){htext = 0};
$(this).find('.div-hover-2').animate({height : htext+180}, 150);
$(this).find('.project-content').css({'visibility': 'visible'});
$(this).find('.project-content').animate({opacity: 1}, 150);
//console.log('h : '+htext);
}, function() {
console.log('down');
$(this).find('.div-hover-2').animate({height : 85}, 150);
$(this).find('.project-arrow-2').animate({opacity: 0}, 150);
$(this).find('.project-content').animate({opacity: 0}, 150, function(){
$(this).find('.project-content').css({'visibility': 'hidden'});
});
});
} else {
$('.div-img-hover-2').on( "click", function( event ) {
console.log('tap tap');
var opened = $(this).find('.div-hover-2').hasClass('open'),
ht = opened ? 85 : '100%',
vis = opened ? 0 : 1;
$(this).find('.div-hover-2').toggleClass('open');
$(this).find('.div-hover-2').animate({height : ht}, 150);
$(this).find('.project-arrow-2').animate({opacity: vis}, 150);
$(this).find('.project-content').animate({opacity: 1}, 150);
});
}
$('.div-hover').hover(function (e) {
$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
}, function() {
$(this).find('.project-arrow-2').animate({opacity: 0}, 50);
});
$('.div-hover').hover(function (e) {
$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
var htext = $(this).find('.project-content').height();
if (htext == undefined){htext = 0};
$(this).animate({height : htext+180}, 150);
$(this).find('.project-content').css({'visibility': 'visible'});
$(this).find('.project-content').animate({opacity: 1}, 150);
console.log('h : '+htext);
}, function() {
$(this).find('.project-arrow-2').animate({opacity: 0}, 50);
$(this).animate({height : 70}, 150);
$(this).find('.project-content').animate({opacity: 0}, 150, function(){
$(this).find('.project-content').css({'visibility': 'hidden'});
});
});
})
.catch((error) => {
console.error('Error:', error);
});
})
}
for (const eElement of document.getElementsByClassName('projectButtonref')) {
eElement.addEventListener('click', function (e) {
e.preventDefault()
for (let button of document.getElementsByClassName('projectButtonref')) {
if (button.classList.contains('all')){
button.classList.remove('all')
button.classList.add('come')
button.querySelector('span').classList.replace('span-all', 'span-projects')
}
}
eElement.classList.remove('come')
eElement.classList.add('all')
eElement.querySelector('span').classList.replace('span-projects', 'span-all')
fetch('reference/home/display/'+this.dataset.id, {
method: 'GET',
})
.then(response => response.json())
.then(data => {
document.getElementById('references-home').innerHTML = ''
document.getElementById('references-home').innerHTML = data.data
_ww = $(window).width();
var lightbox = $('.lightbox'),
item = 0;
$('.lightbox-on').click(function(e){
e.stopPropagation();
item = 0;
console.log('click btn');
var id = $(this).attr('data-id'),
max = 0;
$('#'+id).toggle();
$('#'+id).animate({opacity: 1}, 300);
$('#'+id).find('img').each(function( i ) {
//console.log('h : '+$(this).height());
//console.log('w : '+$(this).width());
max = i;
item = 1;
counter(item, max+1);
itemWidth($(this));
});
});
lightbox.click(function(e) {
e.stopPropagation();
$(this).animate({opacity: 0}, 300, function(){
$(this).toggle();
});
});
$('.closer').on('click', function (e) {
e.stopPropagation();
$(this).parent().animate(
{opacity: 0},
300,
function(){
$(this).toggle();
}
);
});
function itemWidth(img){
img.closest('.items').width(img.width());
}
function counter(item, max){
$('.counter').text(item + ' / ' + max);
}
$('.item', lightbox).on('click, swipeleft', function (e) {
var wd = $(this).width(),
last = $(this).parent().find('.item').last(),
img = $(this).find('.img');
itemWidth(img);
$(this).animate(
{marginLeft: -wd, opacity: 0},
500,
'swing',
function(){
$(this).insertAfter(last);
$(this).css({marginLeft: 0, opacity: 1});
}
);
});
$('.item', lightbox).on('swiperight', function (e) {
var wd = $(this).width(),
first = $(this).parent().find('.item').first(),
last = $(this).parent().find('.item').last(),
img = $(this).find('.img');
itemWidth(img);
$(last).insertBefore($(this));
$(last).css({marginLeft: -wd, opacity: 0});
$(this).parent().find('.item').eq(0).animate(
{marginLeft: 0, opacity: 1},
500,
'swing'
);
});
$('.arrows', lightbox).on('click', function (e) {
e.stopPropagation();
var wd = $(this).siblings('.items').find('.item').eq(0).width(),
max = $(this).siblings('.items').find('.item').length,
first = $(this).siblings('.items').find('.item').first(),
last = $(this).siblings('.items').find('.item').last(),
isRight = $(this).hasClass('right'),
marginL = isRight ? -wd : 0,
marginL0 = isRight ? 0: -wd,
opacOn = isRight ? 1 : 0,
opacOff = isRight ? 0 : 1;
if (!isRight){
$(last).insertBefore(first);
$(last).css({marginLeft: -wd, opacity: 0});
item++;
if (item == max+1) {item = 1};
} else {
item--;
if (item == 0) {item = max};
};
counter(item, max);
var img = $(this).siblings('.items').find('.item').eq(0).find('.img');
itemWidth(img);
$(this).siblings('.items').find('.item').eq(1).animate(
{opacity: opacOn},
500,
'swing');
$(this).siblings('.items').find('.item').eq(0).animate(
{marginLeft: marginL, opacity: 1},
500,
'swing',
function(){
if (isRight){
$(this).insertAfter(last);
$(this).css({ marginLeft: 0, opacity: 1});
}
}
);
});
if (_ww > 768){
$('.div-img-hover-2').hover(function (e) {
$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
var htext = $(this).find('.project-content').height();
if (htext == undefined){htext = 0};
$(this).find('.div-hover-2').animate({height : htext+180}, 150);
$(this).find('.project-content').css({'visibility': 'visible'});
$(this).find('.project-content').animate({opacity: 1}, 150);
//console.log('h : '+htext);
}, function() {
console.log('down');
$(this).find('.div-hover-2').animate({height : 85}, 150);
$(this).find('.project-arrow-2').animate({opacity: 0}, 150);
$(this).find('.project-content').animate({opacity: 0}, 150, function(){
$(this).find('.project-content').css({'visibility': 'hidden'});
});
});
} else {
$('.div-img-hover-2').on( "tap", function( event ) {
console.log('tap tap');
var opened = $(this).find('.div-hover-2').hasClass('open'),
ht = opened ? 85 : '100%',
vis = opened ? 0 : 1;
$(this).find('.div-hover-2').toggleClass('open');
$(this).find('.div-hover-2').animate({height : ht}, 150);
$(this).find('.project-arrow-2').animate({opacity: vis}, 150);
});
}
})
.catch((error) => {
console.error('Error:', error);
});
})
}
/*
window.addEventListener('scroll', function(){
let search = document.getElementById('submit-search');
const formSearch = document.getElementById('form-search-normal')
const subSearch = document.getElementById('sub-search-div')
const send = document.getElementById('send')
if (search) {
search.classList.toggle("stickyY", window.scrollY > 730);
if (search.classList.contains("stickyY")) {
search.setAttribute('type', 'button')
search.addEventListener('click', function (e) {
e.preventDefault()
formSearch.classList.toggle('stickyYForm')
send.classList.toggle('send-display')
subSearch.classList.toggle('sub-search-div-height')
})
} else search.setAttribute('type', 'submit')
}
})
*/
</script>
{#
<script>
var _dropin = $('.dropdown'),
_delay = 150,
_ww = $(window).width();
$('.undroped', _dropin).on('click', function (e) {
console.log('CLICKKKK 1')
$('.dropdown-header').closest('.droped').removeClass('open');
$('.dropdown-header').closest('.dropdown').find('.undroped').show();
$('.dropdown-header').closest('.droped').hide();
$('.dropdown-header').closest('.droped').find('.items').animate({height: 0});
$(this).hide();
$(this).siblings('.droped').find('.items').height('auto');
$(this).siblings('.droped').show();
var ht = $(this).siblings('.droped').find('.items').height();
$(this).attr('data-ht', ht);
$(this).siblings('.droped').find('.items').height(0);
$(this).siblings('.droped').addClass('open');
$(this).siblings('.droped').find('.items').animate({height: ht + 40}, _delay);
});
$('.dropdown-header', _dropin).on('click', function (e) {
var ht = $(this).closest('.dropdown').find('.undroped').attr('data-ht');
$(this).closest('.droped').removeClass('open');
$(this).closest('.droped').find('.items').animate({height: 0}, _delay, function () {
$(this).closest('.dropdown').find('.undroped').show();
$(this).closest('.droped').hide();
});
});
const searchLocationm = document.getElementById('location-drop-mobile');
const searchLocationLim = document.getElementById('location-li-mobile');
const urlm = '/form/search';
searchLocationm.addEventListener("click", function (){
fetch(urlm, {
method: 'GET',
// body: JSON.stringify({
// searchLocation: this.value
// })
}).then(function(response) {
return response.json()
}).then(function (data) {
searchLocationLim.innerHTML = '';
for (const datum in data) {
const li = document.createElement('li')
li.classList.add('item')
li.dataset.value = data[datum]
li.addEventListener('click', function () {
searchLocationm.value = this.dataset.itemName
})
li.innerHTML += data[datum]
searchLocationLim.appendChild(li)
li.addEventListener('click', event => {
li.classList.add('selected');
});
}
searchLocationLim.addEventListener('click', function (e) {
searchLocationLim.req
let target = e.target;
const dropId = document.getElementById('location-drop-mobile')
dropId.querySelector('.undroped-subheader').innerHTML = target.innerHTML
dropId.querySelector('.input-subheader').value = target.dataset.value
dropId.classList.remove('open')
dropId.querySelector('.undroped').style.display = 'block'
dropId.querySelector('.droped').style.display = 'none'
dropId.querySelector('.undroped-subheader').classList.add('selected')
})
});
})
if (window.location.href.includes('action=postule')) {
let select = document.getElementById('contact_form_object');
let options = select.childNodes;
let optionPostule = options[1];
optionPostule.setAttribute('selected', '')
console.log(optionPostule)
}
/* the viewport is less than 768 pixels wide */
// $('#projects').slick({
// dots: false,
// infinite: true,
// speed: 300,
// slidesToShow: 1,
// slidesToScroll: 1,
// autoplay: true,
// responsive: [
// {
// breakpoint: 576,
// settings: {
// slidesToShow: 1,
// slidesToScroll: 1
// }
// }
// // You can unslick at a given breakpoint now by adding:
// // settings: "unslick"
// // instead of a settings object
// ]
// });
//
// const searchMobile = document.getElementById('search-detail-mobile')
// const searchSubDivMobile = document.getElementById('sub-search-div-mobile')
//
// searchMobile.addEventListener('click', function (e) {
// e.preventDefault()
// searchSubDivMobile.style.display = 'flex'
// searchMobile.style.display = 'none'
// })
</script>
#}
</body>
</html>

templates/base.html.twig line 6