70 lines
3.6 KiB
HTML
70 lines
3.6 KiB
HTML
<div class="container mt-5">
|
|
<div class="text-center mb-5">
|
|
<h2 class="fw-bold text-primary">Contactez-nous</h2>
|
|
<p class="text-muted">Vous avez une question ? Contactez-nous via le formulaire ou rendez-vous dans l'un de nos centres.</p>
|
|
</div>
|
|
|
|
<div class="row g-4 mb-3">
|
|
<!-- Liste des centres -->
|
|
<div class="col-lg-6 mb-3">
|
|
<div class="card contact-card shadow-lg border-0 rounded-4">
|
|
<div class="card-body">
|
|
<h4 class="card-title text-primary mb-4">Nos Centres</h4>
|
|
<ul class="list-group list-group-flush">
|
|
<li class="list-group-item py-3 d-flex align-items-start" *ngFor="let address of addresses">
|
|
<i class="bi bi-geo-alt-fill text-primary me-3 fs-4"></i>
|
|
<div>
|
|
<h5 class="mb-1">{{ address.title }}</h5>
|
|
<p class="text-muted mb-1"><strong>Type :</strong> {{ address.type }}</p>
|
|
<p class="text-muted mb-0"><strong>Adresse :</strong> {{ address.address }}</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Formulaire de contact -->
|
|
<div class="col-lg-6 mb-3">
|
|
<div class="card contact-form shadow-lg border-0 rounded-4">
|
|
<div class="card-body p-4">
|
|
<h4 class="card-title text-primary mb-4">Laissez-nous un message</h4>
|
|
<form>
|
|
<div class="mb-3">
|
|
<label for="name" class="form-label">Nom</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-light"><i class="bi bi-person-fill"></i></span>
|
|
<input type="text" class="form-control custom-input" id="name" placeholder="Votre nom">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="email" class="form-label">Email</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-light"><i class="bi bi-envelope-fill"></i></span>
|
|
<input type="email" class="form-control custom-input" id="email" placeholder="Votre email">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="subject" class="form-label">Sujet</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-light"><i class="bi bi-chat-left-text-fill"></i></span>
|
|
<input type="text" class="form-control custom-input" id="subject" placeholder="Sujet de votre message">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="message" class="form-label">Message</label>
|
|
<textarea class="form-control custom-input" id="message" rows="4" placeholder="Votre message"></textarea>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary w-100 py-2 rounded-pill custom-btn">
|
|
<i class="bi bi-send-fill"></i> Envoyer
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|