Files
LOGIS/templates/properties/partials/contact_modal.html
T
2026-05-28 23:43:20 +02:00

74 lines
3.0 KiB
HTML

{% load i18n %}
{# Modale de contact — injectée dans la page detail #}
<div id="contact-modal" class="modal" role="dialog" aria-modal="true"
aria-labelledby="contact-modal-title" hidden>
<div class="modal-overlay" id="contact-overlay"></div>
<div class="modal-box">
<button class="modal-close" id="contact-modal-close" aria-label="{% trans 'Fermer' %}">&times;</button>
<h2 id="contact-modal-title" class="modal-title">
✉ {% trans "Demande de renseignements" %}
</h2>
{# Zone de retour message succès #}
<div id="contact-success" class="contact-success" hidden>
<p class="success-icon"></p>
<p class="success-title">{% trans "Message envoyé !" %}</p>
<p class="success-body">{% trans "Nous vous répondrons dans les plus brefs délais." %}</p>
</div>
{# Formulaire #}
<form id="contact-form" class="contact-form" novalidate>
{% csrf_token %}
{# Honeypot invisible #}
<div class="hp-field" aria-hidden="true">
<input type="text" name="website" id="id_website" tabindex="-1" autocomplete="off">
</div>
<input type="hidden" name="property_id" id="id_property_id">
<div class="form-group">
<label for="id_name">{% trans "Nom complet" %} <span class="required">*</span></label>
<input type="text" id="id_name" name="name" required
autocomplete="name" maxlength="200"
placeholder="{% trans 'Votre nom et prénom' %}">
<span class="field-error" data-field="name"></span>
</div>
<div class="form-group">
<label for="id_email">{% trans "Adresse email" %} <span class="required">*</span></label>
<input type="email" id="id_email" name="email" required
autocomplete="email"
placeholder="{% trans 'votre@email.com' %}">
<span class="field-error" data-field="email"></span>
</div>
<div class="form-group">
<label for="id_phone">{% trans "Téléphone" %} <span class="optional">({% trans "facultatif" %})</span></label>
<input type="tel" id="id_phone" name="phone"
autocomplete="tel" maxlength="30"
placeholder="+33 6 XX XX XX XX">
<span class="field-error" data-field="phone"></span>
</div>
<div class="form-group">
<label for="id_message">{% trans "Message" %} <span class="required">*</span></label>
<textarea id="id_message" name="message" required rows="5"
placeholder="{% trans 'Votre message, vos questions…' %}"></textarea>
<span class="field-error" data-field="message"></span>
</div>
<p class="form-notice">
{% trans "* champs obligatoires — vos coordonnées ne seront utilisées que pour répondre à votre demande." %}
</p>
<div class="form-global-error" id="contact-global-error" hidden></div>
<button type="submit" class="btn btn-primary btn-full" id="contact-submit">
{% trans "Envoyer" %}
</button>
</form>
</div>
</div>