Init Project
All checks were successful
Go CI Pipeline / build_and_test (push) Successful in 11m57s

This commit is contained in:
Enkly
2025-12-09 17:47:21 +01:00
parent d1ebb9fb9b
commit 7a6f64e581
62 changed files with 5238 additions and 0 deletions

View File

@@ -0,0 +1,760 @@
{{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}}