Files
Enkly 7a6f64e581
All checks were successful
Go CI Pipeline / build_and_test (push) Successful in 11m57s
Init Project
2025-12-09 17:47:21 +01:00

761 lines
32 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{{define "home"}}
<!--==================== BOOKING ====================-->
<section class="booking">
<div class="booking-content container">
<h1>Location des produits et services</h1>
<p>Des prix imbattables, des réservations flexibles.</p>
<form class="booking-form" id="booking-form">
<div class="form-group">
<i class="ri-map-pin-fill"></i>
<input type="text" placeholder="Localisation" required />
</div>
<div class="form-group">
<i class="ri-calendar-fill"></i>
<input type="text" onfocus="(this.type='date')" onblur="(this.type='text')" placeholder="Date de départ" required />
</div>
<div class="form-group">
<i class="ri-calendar-fill"></i>
<input type="text" onfocus="(this.type='date')" onblur="(this.type='text')" placeholder="Date de retour" required />
</div>
<button type="submit" class="btn btn-primary">Recherche</button>
</form>
</div>
</section>
<!--==================== SERVICES ====================-->
<section class="services section">
<div class="services__container container grid">
<article class="services__card">
<i class="ri-truck-line"></i>
<h3 class="services__title">Livraison gratuite</h3>
<p class="services__description">Pour plus de 1000€ de locations</p>
</article>
<article class="services__card">
<i class="ri-truck-line"></i>
<h3 class="services__title">Paiements sécurisés</h3>
<p class="services__description">100% de paiements sécurisés</p>
</article>
<article class="services__card">
<i class="ri-truck-line"></i>
<h3 class="services__title">Support 24/7</h3>
<p class="services__description">Nous contacter au 01 84 21 13 96</p>
</article>
</div>
</section>
<!--==================== HOME ====================-->
<section class="home" id="home">
<div class="home__container container" id="grid">
<div class="home__data">
<h1 class="home__title">
Nos catégories <br>
de produits
</h1>
<p class="home__description">
Trouve les meilleurs produits de tes catégories préférées,
explore des centaines de produits avec toutes les catégories
possibles, profite dune réduction de 15% et bien plus encore.
</p>
<a hx-get="/explore" hx-target="#view" hx-push-url="true" class="button" onclick="explore()">Découvrir maintenant</a>
</div>
<div class="home__images">
<div class="home__swiper swiper">
<div class="swiper-wrapper">
<article class="home__article swiper-slide">
<img src="/public/assets/img/tools/terres-agricoles.jpg" alt="image" class="home__img">
</article>
<article class="home__article swiper-slide">
<img src="/public/assets/img/tools/mat-construction.jpg" alt="image" class="home__img">
</article>
<article class="home__article swiper-slide">
<img src="/public/assets/img/tools/electromenagers.avif" alt="image" class="home__img">
</article>
<article class="home__article swiper-slide">
<img src="/public/assets/img/tools/vehicules.jpg" alt="image" class="home__img">
</article>
<article class="home__article swiper-slide">
<img src="/public/assets/img/tools/salles-evenementielles.jpg" alt="image" class="home__img">
</article>
<article class="home__article swiper-slide">
<img src="/public/assets/img/tools/logements-meubles.jpg" alt="image" class="home__img">
</article>
</div>
</div>
</div>
</div>
</section>
<!--==================== FARMLANDS ====================-->
<section class="farmland section" id="farmland">
<h2 class="section__title">Nos terres agricoles</h2>
<div class="farmland__container container">
<div class="farmland__swiper swiper">
<div class="swiper-wrapper">
<article class="farmland__card swiper-slide">
<img src="/public/assets/img/farmlands/terrain-attecoube.jpg" alt="image" class="farmland__img">
<h2 class="farmland__title">Terrain Nord</h2>
<div class="farmland__prices">
<span class="farmland__discount">180€/hectare</span>
<span class="farmland__price">250€/hectare</span>
</div>
<button class="skinny__border__button" onclick="farmlandAttecoubeByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="farmlandAttecoube()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="farmland__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="farmland__card swiper-slide">
<img src="/public/assets/img/farmlands/terrain-treichville.jpeg" alt="image" class="farmland__img">
<h2 class="farmland__title">Terrain Sud</h2>
<div class="farmland__prices">
<span class="farmland__discount">180€/hectare</span>
<span class="farmland__price">250€/hectare</span>
</div>
<button class="skinny__border__button" onclick="farmlandTreichvilleByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="farmlandTreichville()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="farmland__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="farmland__card swiper-slide">
<img src="/public/assets/img/farmlands/terrain-marcory.jpg" alt="image" class="farmland__img">
<h2 class="farmland__title">Terrain Ouest</h2>
<div class="farmland__prices">
<span class="farmland__discount">180€/hectare</span>
<span class="farmland__price">250€/hectare</span>
</div>
<button class="skinny__border__button" onclick="farmlandMarcoryByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="farmlandMarcory()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="farmland__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="farmland__card swiper-slide">
<img src="/public/assets/img/farmlands/terrain-bracodi.avif" alt="image" class="farmland__img">
<h2 class="farmland__title">Terrain Est</h2>
<div class="farmland__prices">
<span class="farmland__discount">180€/hectare</span>
<span class="farmland__price">250€/hectare</span>
</div>
<button class="skinny__border__button" onclick="farmlandBracodiByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="farmlandBracodi()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="farmland__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="farmland__card swiper-slide">
<img src="/public/assets/img/farmlands/terrain-sikasso.jpeg" alt="image" class="farmland__img">
<h2 class="farmland__title">Terrain Sud</h2>
<div class="farmland__prices">
<span class="farmland__discount">180€/hectare</span>
<span class="farmland__price">250€/hectare</span>
</div>
<button class="skinny__border__button" onclick="farmlandSikassoByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="farmlandSikasso()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="farmland__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
</div>
<div class="swiper-button-prev">
<i class="ri-arrow-left-s-line"></i>
</div>
<div class="swiper-button-next">
<i class="ri-arrow-right-s-line"></i>
</div>
</div>
</div>
</section>
<!--==================== BUILDING ====================-->
<section class="building section" id="building">
<h2 class="section__title">Matériels de construction</h2>
<div class="building__container container">
<div class="building__swiper swiper">
<div class="swiper-wrapper">
<article class="building__card swiper-slide">
<img src="/public/assets/img/tools/pelleteuse.avif" alt="image" class="building__img">
<h2 class="building__title">Pelleteuse</h2>
<div class="building__prices">
<span class="building__discount">12.50€/jour</span>
<span class="building__price">19.50€/jour</span>
</div>
<button class="skinny__border__button" onclick="buildingPelleteuseByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="buildingPelleteuse()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="building__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="building__card swiper-slide">
<img src="/public/assets/img/tools/marteau_piqueur.avif" alt="image" class="building__img">
<h2 class="building__title">Marteau piqueur</h2>
<div class="building__prices">
<span class="building__discount">12.50€/jour</span>
<span class="building__price">19.50€/jour</span>
</div>
<button class="skinny__border__button" onclick="buildingMarteauByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="buildingMarteau()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="building__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="building__card swiper-slide">
<img src="/public/assets/img/tools/benne_beton.avif" alt="image" class="building__img">
<h2 class="building__title">Benne à béton</h2>
<div class="building__prices">
<span class="building__discount">12.50€/jour</span>
<span class="building__price">19.50€/jour</span>
</div>
<button class="skinny__border__button" onclick="buildingBenneByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="buildingBenne()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="building__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
<article class="building__card swiper-slide">
<img src="/public/assets/img/tools/goulotte_materiaux.avif" alt="image" class="building__img">
<h2 class="building__title">Goulotte à matériaux</h2>
<div class="building__prices">
<span class="building__discount">12.50€/jour</span>
<span class="building__price">19.50€/jour</span>
</div>
<button class="skinny__border__button" onclick="buildingGoulotteByPhone()">
<i class="ri-phone-fill"></i>Réserver par téléphone
</button>
<button class="skinny__button" onclick="buildingGoulotte()">
<i class="ri-shopping-cart-fill"></i>Réserver en ligne
</button>
<div class="building__actions">
<button><i class="ri-search-line"></i></button>
<button><i class="ri-heart-3-line"></i></button>
<button><i class="ri-eye-line"></i></button>
</div>
</article>
</div>
<div class="swiper-button-prev">
<i class="ri-arrow-left-s-line"></i>
</div>
<div class="swiper-button-next">
<i class="ri-arrow-right-s-line"></i>
</div>
</div>
</div>
</section>
<!--==================== DISCOUNT ====================-->
<section class="discount section" id="discount">
<div class="discount__container container grid">
<div class="discount__data">
<h2 class="discount__title section__title">Jusqu'à 50% de réduction</h2>
<p class="discount__description">
Profitez des jours de réduction que nous avons pour vous,
louez vos produits préférés, plus vous louez, plus nous avons
de réductions pour vous.
</p>
<a href="#" class="button" id="discount-login">Louez maintenant</a>
</div>
<div class="discount__images">
<img src="/public/assets/img/tools/benne_beton.avif" alt="image" class="discount__img-1">
<img src="/public/assets/img/tools/boulonneuse.avif" alt="image" class="discount__img-2">
</div>
</div>
</section>
<!--==================== VEHICLE ====================-->
<section class="vehicle section" id="vehicle">
<h2 class="section__title">Véhicules</h2>
<div class="vehicle__container container">
<div class="vehicle__swiper swiper">
<div class="swiper-wrapper">
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-3.avif" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Audi</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-3.avif" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Audi</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-3.avif" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Audi</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
</div>
</div>
<div class="vehicle__swiper swiper">
<div class="swiper-wrapper">
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-3.avif" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Audi</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-3.avif" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Audi</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-3.avif" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Audi</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-1.jpg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Renault megane</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
<a href="#" class="vehicle__card swiper-slide">
<img src="/public/assets/img/tools/car-product-2.jpeg" alt="image" class="vehicle__img">
<div>
<h2 class="vehicle__title">Mazda</h2>
<div class="vehicle__prices">
<span class="vehicle__discount">78.43€</span>
<span class="vehicle__price">56.67€</span>
</div>
<div class="vehicle__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</div>
</a>
</div>
</div>
</div>
</section>
<!--==================== JOIN ====================-->
<section class="join section">
<div class="join__container">
<img src="/public/assets/img/tools/join-bg.avif" alt="image" class="join__bg">
<div class="join__data container grid">
<h2 class="join__title section__title">
Abonnez-vous pour recevoir <br>
les dernières mises à jour
</h2>
<form action="" class="join__form">
<input type="email" placeholder="Entrez votre email" class="join__input">
<button type="submit" class="join__button button">Abonnez-vous</button>
</form>
</div>
</div>
</section>
<!--==================== TESTIMONIAL ====================-->
<section class="testimonial section" id="testimonial">
<h2 class="section__title">Opinions des clients</h2>
<div class="testimonial__container container">
<div class="testimonial__swiper swiper">
<div class="swiper-wrapper">
<article class="testimonial__card swiper-slide">
<i class="ri-user-fill"></i>
<h2 class="testimonial__title">Alain Doumbia</h2>
<p class="testimonial__description">
La meilleure plateforme pour louer des produits,
la location est très facile à faire et offre de grandes réductions.
</p>
<div class="testimonial__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</article>
<article class="testimonial__card swiper-slide">
<i class="ri-user-fill"></i>
<h2 class="testimonial__title">Quentin Loz</h2>
<p class="testimonial__description">
La meilleure plateforme pour louer des produits,
la location est très facile à faire et offre de grandes réductions.
</p>
<div class="testimonial__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</article>
<article class="testimonial__card swiper-slide">
<i class="ri-user-fill"></i>
<h2 class="testimonial__title">Karim Sissoko</h2>
<p class="testimonial__description">
La meilleure plateforme pour louer des produits,
la location est très facile à faire et offre de grandes réductions.
</p>
<div class="testimonial__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</article>
<article class="testimonial__card swiper-slide">
<i class="ri-user-fill"></i>
<h2 class="testimonial__title">Abou Traoré</h2>
<p class="testimonial__description">
La meilleure plateforme pour louer des produits,
la location est très facile à faire et offre de grandes réductions.
</p>
<div class="testimonial__stars">
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-fill"></i>
<i class="ri-star-half-fill"></i>
</div>
</article>
</div>
</div>
</div>
</section>
{{end}}