templates/home/index.html.twig line 1

Open in your IDE?
  1. {% extends 'basefront.html.twig' %}
  2. {% block stylesheets %}
  3.     <style>
  4.         @media (min-width: 992px) {
  5.             .intro .intro-title {
  6.                 font-size: 3rem !important;
  7.             }
  8.         }
  9.         @media (max-width: 900px) {
  10.             #log{
  11.                 width: 40px !important;
  12.             }
  13.         }
  14.         @media (min-width: 900px) {
  15.             #log{
  16.                 width: 100px !important;
  17.             }
  18.         }
  19.     </style>
  20. {% endblock %}
  21. {% block body %}
  22.     <nav class="navbar navbar-default navbar-trans navbar-expand-lg fixed-top" style="padding-top: 0px !important;padding-bottom: 0px !important;">
  23.         <div class="container">
  24.             <button class="navbar-toggler collapsed" type="button" data-bs-toggle="collapse"
  25.                     data-bs-target="#navbarDefault" aria-controls="navbarDefault" aria-expanded="false"
  26.                     aria-label="Toggle navigation">
  27.                 <span></span>
  28.                 <span></span>
  29.                 <span></span>
  30.             </button>
  31.             <a class="navbar-brand text-brand" href="/" ><img id="log" src="{{ asset('image/logoestradori.png') }}" alt="Estate Immobilière">
  32.                 </a>
  33.             <div class="navbar-collapse collapse justify-content-center" id="navbarDefault">
  34.                 <ul class="navbar-nav" style="font-size: 12px;font-weight: bold;">
  35.                     <li class="nav-item">
  36.                         <a class="nav-link active" href="/" style="font-size: 12px;font-weight: bold;">Accueil</a>
  37.                     </li>
  38.                     <li class="nav-item dropdown">
  39.                         <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" style="font-size: 12px;font-weight: bold;"
  40.                            data-bs-toggle="dropdown"
  41.                            aria-haspopup="true" aria-expanded="false">Location</a>
  42.                         <div class="dropdown-menu">
  43.                             {% for type in types %}
  44.                                 <a class="dropdown-item " style="font-size: 12px;font-weight: bold;" href="{{ path('app_liste_type', {'id': type.id,'categorie':'location'}) }}">{{ type.nom }}</a>
  45.                             {% endfor %}
  46.                         </div>
  47.                     </li>
  48.                     <li class="nav-item dropdown">
  49.                         <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" style="font-size: 12px;font-weight: bold;"
  50.                            data-bs-toggle="dropdown"
  51.                            aria-haspopup="true" aria-expanded="false">Vente</a>
  52.                         <div class="dropdown-menu">
  53.                             {% for type in types %}
  54.                                 <a class="dropdown-item " style="font-size: 12px;font-weight: bold;" href="{{ path('app_liste_type', {'id': type.id,'categorie':'vente'}) }}">{{ type.nom }}</a>
  55.                             {% endfor %}
  56.                         </div>
  57.                     </li>
  58.                     <li class="nav-item">
  59.                         <a class="nav-link " href="#" style="font-size: 12px;font-weight: bold;">Vacances</a>
  60.                     </li>
  61.                     <li class="nav-item">
  62.                         <a class="nav-link " href="/contact" style="font-size: 12px;font-weight: bold;">Contact</a>
  63.                     </li>
  64.                 </ul>
  65.                 <ul id="respMenu2" class="ace-responsive-menu float-right wa" data-menu-style="horizontal" style="font-size: 12px;font-weight: bold;">
  66.                     <li class="list-inline-item list_c"><a href="tel:0021629707148">
  67.                             <span class="bi bi-phone mr7"></span>/ <span class="bi bi-whatsapp mr7">
  68.                             </span>  (+216)  29 707 148</a></li>
  69.                     <li class="list-inline-item list_c"><a href="mailto:eha.immobilier@gmail.com">
  70.                             <span class="bi bi-envelope mr7"></span>
  71.                             eha.immobilier@gmail.com</a></li> </ul>
  72.             </div>
  73.         </div>
  74.     </nav>
  75.     <div class="intro intro-carousel swiper position-relative">
  76.         <div class="swiper-wrapper">
  77.             <div class="swiper-slide carousel-item-a intro-item bg-image"
  78.                  style="background-image: url({{ asset('templatefront/assets/img/slide-1.jpg') }}">
  79.                 <div class="overlay overlay-a"></div>
  80.                 <div class="intro-content display-table">
  81.                     <div class="table-cell">
  82.                         <div class="container">
  83.                             <div class="row">
  84.                                 <div class="col-lg-12">
  85.                                     <div class="intro-body">
  86.                                         <h6 class="intro-title mb-4">
  87.                                             <span class="color-b" style="color:white !important;"> Un Bien Immobilier à Vendre Ou à Louer ! </span>
  88.                                         </h6>
  89.                                     </div>
  90.                                 </div>
  91.                             </div>
  92.                         </div>
  93.                     </div>
  94.                 </div>
  95.             </div>
  96.             <div class="swiper-slide carousel-item-a intro-item bg-image"
  97.                  style="background-image: url({{ asset('templatefront/assets/img/slide.jpg') }}">
  98.                 <div class="overlay overlay-a"></div>
  99.                 <div class="intro-content display-table">
  100.                     <div class="table-cell">
  101.                         <div class="container">
  102.                             <div class="row">
  103.                                 <div class="col-lg-12">
  104.                                     <div class="intro-body">
  105.                                         <h6 class="intro-title mb-4 ">
  106.                                             <span class="color-b" style="color:white !important;">Trouvez Votre Maison Parfaite </span>
  107.                                         </h6>
  108.                                     </div>
  109.                                 </div>
  110.                             </div>
  111.                         </div>
  112.                     </div>
  113.                 </div>
  114.             </div>
  115.             <div class="swiper-slide carousel-item-a intro-item bg-image"
  116.                  style="background-image: url({{ asset('templatefront/assets/img/slid.jpg') }}">
  117.                 <div class="overlay overlay-a"></div>
  118.                 <div class="intro-content display-table">
  119.                     <div class="table-cell">
  120.                         <div class="container">
  121.                             <div class="row">
  122.                                 <div class="col-lg-12">
  123.                                     <div class="intro-body">
  124.                                         <h6 class="intro-title mb-4">
  125.                                             <span class="color-b" style="color:white !important;"> Un Bien Immobilier à Vendre Ou à Louer ! </span>
  126.                                         </h6>
  127.                                     </div>
  128.                                 </div>
  129.                             </div>
  130.                         </div>
  131.                     </div>
  132.                 </div>
  133.             </div>
  134.             <div class="swiper-slide carousel-item-a intro-item bg-image"
  135.                  style="background-image: url({{ asset('templatefront/assets/img/slide-2.jpg') }}">
  136.                 <div class="overlay overlay-a"></div>
  137.                 <div class="intro-content display-table">
  138.                     <div class="table-cell">
  139.                         <div class="container">
  140.                             <div class="row">
  141.                                 <div class="col-lg-12">
  142.                                     <div class="intro-body">
  143.                                         <h6 class="intro-title mb-4">
  144.                                             <span class="color-b" style="color:white !important;"> Un Bien Immobilier à Vendre Ou à Louer ! </span>
  145.                                         </h6>
  146.                                     </div>
  147.                                 </div>
  148.                             </div>
  149.                         </div>
  150.                     </div>
  151.                 </div>
  152.             </div>
  153.         </div>
  154.         <div class="swiper-pagination"></div>
  155.     </div>
  156.     <main id="main">
  157.         <section class="section-services section-t8">
  158.             <div class="container">
  159.                 <div class="row">
  160.                     <div class="col-md-12">
  161.                         <div class="title-wrap d-flex justify-content-between">
  162.                             <div class="title-box">
  163.                                 <h2 class="title-a">
  164.                                     À propos</h2>
  165.                                 <p>
  166.                                     Votre agence immobilière . Achat, vente, location. Appartements, villas, maisons, terrains
  167.                                     agence immobilière nouvelle génération, avec une équipe d'agents immobiliers sur qui il faut compter pour votre projet d'achat ou de location en Tunisie !
  168.                                 </p>
  169.                             </div>
  170.                         </div>
  171.                     </div>
  172.                 </div>
  173.                 <div class="row text-center">
  174.                     <div class="col-md-4">
  175.                         <div class="card-box-c foo">
  176.                             <div class="card-header-c d-flex">
  177.                                 <div class="card-box-ico" style="margin-left:100px !important;">
  178.                                     <span class="bi bi-chat-quote-fill"></span>
  179.                                 </div>
  180.                                 <div class="card-title-c align-self-center">
  181.                                     <h2 class="title-c"></h2>
  182.                                 </div>
  183.                             </div>
  184.                             <div class="card-body-c">
  185.                                 <p class="content-c">
  186.                                     Des milliers de personnes font confiance
  187.                                 </p>
  188.                             </div>
  189.                         </div>
  190.                     </div>
  191.                     <div class="col-md-4">
  192.                         <div class="card-box-c foo">
  193.                             <div class="card-header-c d-flex">
  194.                                 <div class="card-box-ico" style="margin-left:100px !important;">
  195.                                     <span class="bi bi-house"></span>
  196.                                 </div>
  197.                                 <div class="card-title-c align-self-center">
  198.                                     <h2 class="title-c"></h2>
  199.                                 </div>
  200.                             </div>
  201.                             <div class="card-body-c">
  202.                                 <p class="content-c">
  203.                                     Large gamme de propriétés
  204.                                 </p>
  205.                             </div>
  206.                         </div>
  207.                     </div>
  208.                     <div class="col-md-4 ">
  209.                         <div class="card-box-c foo text-center">
  210.                             <div class="card-header-c d-flex">
  211.                                 <div class="card-box-ico" style="margin-left:100px !important;">
  212.                                     <span class="bi bi-phone"></span>
  213.                                 </div>
  214.                                 <div class="card-title-c align-self-center">
  215.                                     <h2 class="title-c"></h2>
  216.                                 </div>
  217.                             </div>
  218.                             <div class="card-body-c">
  219.                                 <p class="content-c">
  220.                                     Le financement en toute simplicité
  221.                                 </p>
  222.                             </div>
  223.                         </div>
  224.                     </div>
  225.                 </div>
  226.             </div>
  227.         </section>
  228.         <section class="section-property section-t8  mb-4">
  229.             <div class="container">
  230.                 <div class="row text-center">
  231.                     <div class="col-md-12 text-center">
  232.                         <div class="title-wrap d-flex justify-content-between text-center">
  233.                             <div class="title-box ">
  234.                                 <h5 class="title-a" style="font-size: 2rem">Annonces Récentes</h5>
  235.                             </div>
  236.                             <div class="title-link">
  237.                                 <a href="{{ path('app_liste') }}">Voir tous
  238.                                     <span class="bi bi-chevron-right"></span>
  239.                                 </a>
  240.                             </div>
  241.                         </div>
  242.                     </div>
  243.                 </div>
  244.                 <div id="property-carousel" class="swiper">
  245.                     <div class="swiper-wrapper">
  246.                         {% set n =0 %}
  247.                         {% for annonce in annonces %}
  248.                             {% if(n >= annonces|length-6) %}
  249.                                 <div class="carousel-item-b swiper-slide">
  250.                                     <div class="card-box-a card-shadow">
  251.                                         <div class="img-box-a">
  252.                                             {% set i =0 %}
  253.                                             {% for image in annonce.images %}
  254.                                                 {% if(i == annonce.images|length-1) %}
  255.                                                     <img src="{{ asset('images/annonces/'~image.name) }}" alt=""
  256.                                                          class="img-a img-fluid">
  257.                                                 {% endif %}
  258.                                                 {% set i =i+1 %}
  259.                                             {% endfor %}
  260.                                         </div>
  261.                                         <div class="card-overlay">
  262.                                             <div class="card-overlay-a-content">
  263.                                                 <div class="card-header-a">
  264.                                                     <h2 class="card-title-a">
  265.                                                         <a href="{{ path('details_annonce', {'id': annonce.id}) }}">{{ annonce.titre }}</a>
  266.                                                     </h2>
  267.                                                 </div>
  268.                                                 <div class="card-body-a">
  269.                                                     <div class="price-box d-flex">
  270.                                                         <span class="price-a">{{ annonce.categorie }} | {{ annonce.prix }}{{ annonce.devise }}</span>
  271.                                                     </div>
  272.                                                     <a href="{{ path('details_annonce', {'id': annonce.id}) }}" class="link-a">Voir détails
  273.                                                         <span class="bi bi-chevron-right"></span>
  274.                                                     </a>
  275.                                                 </div>
  276.                                                 <div class="card-footer-a">
  277.                                                     <ul class="card-info d-flex justify-content-around">
  278.                                                         <li>
  279.                                                             <h4 class="card-info-title">Surface</h4>
  280.                                                             <span>{{ annonce.surface }} {{ annonce.unite }}
  281.                                                             <sup>2</sup>
  282.                                                         </span>
  283.                                                         </li>
  284.                                                         <li>
  285.                                                             <h4 class="card-info-title">Chambres</h4>
  286.                                                             <span>{{ annonce.nbchambre }}</span>
  287.                                                         </li>
  288.                                                         <li>
  289.                                                             <h4 class="card-info-title">S.D.B</h4>
  290.                                                             <span>{{ annonce.nbsdb }}</span>
  291.                                                         </li>
  292.                                                     </ul>
  293.                                                 </div>
  294.                                             </div>
  295.                                         </div>
  296.                                     </div>
  297.                                 </div>
  298.                             {% endif %}
  299.                             {% set n =n+1 %}
  300.                             {% else %}
  301.                                 <div class="row" style="    margin-left: auto;
  302.     margin-right: auto;">
  303.                                         <div id="contenedor_busqueda_fallida" style="padding: 0 12.5px;
  304.     width: 100%;
  305.     margin: 100px auto;
  306.     max-width: 1165px;
  307.     margin: 0 auto;
  308.     position: relative;
  309.     overflow: hidden;
  310.     padding: 0 12.5px;
  311.     position: relative;
  312.     width: 100%;">
  313.                                             <div class="busqueda">
  314.                                                 <img style="width: 250px; height: 200px;" src="{{ asset('image/no_results_found.svg') }}" alt="">
  315.                                                  <div class="text_fail_busqueda">
  316.                                                     <p class="title">Aucun résultat trouvé</p>
  317.                                                 </div>
  318.                                             </div>
  319.                                         </div>
  320.                                 </div>
  321.                         {% endfor %}
  322.                     </div>
  323.                 </div>
  324.                 <div class="propery-carousel-pagination carousel-pagination"></div>
  325.             </div>
  326.         </section><!-- End Latest Properties Section -->
  327.     </main>
  328. {% endblock %}