admin/e-ticket
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Migrate inline styles to CSS classes: login, forgot_password, contact, create_event

Browse Source 
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Serreau Jovann
2026-03-20 15:17:18 +01:00
parent fbc7570a59
commit f0dcfa2711
4 changed files with 83 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
templates/account/create_event.html.twig
View File

@@ -3,68 +3,66 @@
{% block title %}Creer un evenement - E-Ticket{% endblock %}
{% block body %}
<div style="max-width:50rem;margin:0 auto;padding:3rem 1rem;">
<a href="{{ path('app_account', {tab: 'events'}) }}" class="inline-flex items-center gap-2 text-sm font-black uppercase tracking-widest text-gray-500 hover:text-gray-900 transition-colors" style="margin-bottom:2rem;display:inline-flex;">
<div class="page-container">
<a href="{{ path('app_account', {tab: 'events'}) }}" class="inline-flex items-center gap-2 text-sm font-black uppercase tracking-widest text-gray-500 hover:text-gray-900 transition-colors mb-8">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M15 19l-7-7 7-7"/></svg>
Retour aux evenements
</a>
<h1 class="text-3xl font-black uppercase tracking-tighter italic" style="border-bottom:4px solid #111827;display:inline-block;margin-bottom:0.5rem;">Creer un evenement</h1>
<p class="font-bold text-gray-600 italic" style="margin-bottom:2rem;">Renseignez les informations de votre evenement.</p>
<h1 class="text-3xl font-black uppercase tracking-tighter italic heading-page">Creer un evenement</h1>
<p class="font-bold text-gray-600 italic mb-8">Renseignez les informations de votre evenement.</p>
{% for message in app.flashes('error') %}
<div style="border:4px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);background:#fee2e2;padding:1rem 1.5rem;margin-bottom:1.5rem;">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-error"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
<form method="post" action="{{ path('app_account_create_event') }}" enctype="multipart/form-data" style="display:flex;flex-direction:column;gap:1.5rem;">
<form method="post" action="{{ path('app_account_create_event') }}" enctype="multipart/form-data" class="form-col">
<div>
<label for="event_title" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Titre de l'evenement</label>
<input type="text" id="event_title" name="title" required style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;" class="focus:border-indigo-600" placeholder="Brocante de printemps 2026">
<label for="event_title" class="text-xs font-black uppercase tracking-widest form-label">Titre de l'evenement</label>
<input type="text" id="event_title" name="title" required class="form-input focus:border-indigo-600" placeholder="Brocante de printemps 2026">
</div>
<div>
<label for="event_description" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Description</label>
<label for="event_description" class="text-xs font-black uppercase tracking-widest form-label">Description</label>
<e-ticket-editor>
<textarea id="event_description" name="description" rows="5" placeholder="Decrivez votre evenement..."></textarea>
</e-ticket-editor>
</div>
<div style="display:flex;flex-wrap:wrap;gap:1.5rem;">
<div style="flex:1;min-width:200px;">
<label for="event_start_at" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Date et heure de debut</label>
<input type="datetime-local" id="event_start_at" name="start_at" required style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;" class="focus:border-indigo-600">
<div class="form-row">
<div class="form-group">
<label for="event_start_at" class="text-xs font-black uppercase tracking-widest form-label">Date et heure de debut</label>
<input type="datetime-local" id="event_start_at" name="start_at" required class="form-input focus:border-indigo-600">
</div>
<div style="flex:1;min-width:200px;">
<label for="event_end_at" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Date et heure de fin</label>
<input type="datetime-local" id="event_end_at" name="end_at" required style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;" class="focus:border-indigo-600">
<div class="form-group">
<label for="event_end_at" class="text-xs font-black uppercase tracking-widest form-label">Date et heure de fin</label>
<input type="datetime-local" id="event_end_at" name="end_at" required class="form-input focus:border-indigo-600">
</div>
</div>
<div>
<label for="event_address" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Adresse</label>
<input type="text" id="event_address" name="address" required style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;" class="focus:border-indigo-600" placeholder="12 avenue de la Republique">
<label for="event_address" class="text-xs font-black uppercase tracking-widest form-label">Adresse</label>
<input type="text" id="event_address" name="address" required class="form-input focus:border-indigo-600" placeholder="12 avenue de la Republique">
</div>
<div style="display:flex;flex-wrap:wrap;gap:1.5rem;">
<div style="flex:1;min-width:120px;max-width:200px;">
<label for="event_zipcode" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Code postal</label>
<input type="text" id="event_zipcode" name="zipcode" required maxlength="10" style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;" class="focus:border-indigo-600" placeholder="75011">
<div class="form-row">
<div class="flex-1 min-w-[120px] max-w-[200px]">
<label for="event_zipcode" class="text-xs font-black uppercase tracking-widest form-label">Code postal</label>
<input type="text" id="event_zipcode" name="zipcode" required maxlength="10" class="form-input focus:border-indigo-600" placeholder="75011">
</div>
<div style="flex:2;min-width:200px;">
<label for="event_city" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Ville</label>
<input type="text" id="event_city" name="city" required style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;" class="focus:border-indigo-600" placeholder="Paris">
<div class="flex-[2] min-w-[200px]">
<label for="event_city" class="text-xs font-black uppercase tracking-widest form-label">Ville</label>
<input type="text" id="event_city" name="city" required class="form-input focus:border-indigo-600" placeholder="Paris">
</div>
</div>
<div>
<label for="event_main_picture" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Image principale</label>
<input type="file" id="event_main_picture" name="event_main_picture" accept="image/*" style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;background:white;">
<label for="event_main_picture" class="text-xs font-black uppercase tracking-widest form-label">Image principale</label>
<input type="file" id="event_main_picture" name="event_main_picture" accept="image/*" class="form-file">
</div>
<div>
<button type="submit" style="padding:0.75rem 2rem;border:3px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);background:#fabf04;cursor:pointer;" class="font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
<button type="submit" class="btn-brutal font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
Creer l'evenement
</button>
</div>

60
templates/contact/index.html.twig
View File

@@ -4,68 +4,50 @@
{% block description %}Contactez l'equipe E-Ticket pour toute question sur la plateforme de billetterie associative{% endblock %}
{% block body %}
<div style="max-width:50rem;margin:0 auto;padding:3rem 1rem;">
<h1 class="text-3xl font-black uppercase tracking-tighter italic" style="border-bottom:4px solid #111827;display:inline-block;margin-bottom:0.5rem;">Contact</h1>
<p class="font-bold text-gray-600 italic" style="margin-bottom:2rem;">Une question, une demande ? Ecrivez-nous.</p>
<div class="page-container">
<h1 class="text-3xl font-black uppercase tracking-tighter italic heading-page">Contact</h1>
<p class="font-bold text-gray-600 italic mb-8">Une question, une demande ? Ecrivez-nous.</p>
{% for message in app.flashes('success') %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#d1fae5;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-success mb-8"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
{% for message in app.flashes('error') %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#fee2e2;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-error mb-8"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
<form method="post" action="{{ path('app_contact') }}" style="display:flex;flex-direction:column;gap:1.5rem;">
<div style="display:flex;flex-wrap:wrap;gap:1.5rem;">
<div style="flex:1;min-width:200px;">
<label for="contact_name" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Nom</label>
<input type="text" id="contact_name" name="name" required
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
placeholder="Dupont">
<form method="post" action="{{ path('app_contact') }}" class="form-col">
<div class="form-row">
<div class="form-group">
<label for="contact_name" class="text-xs font-black uppercase tracking-widest form-label">Nom</label>
<input type="text" id="contact_name" name="name" required class="form-input focus:border-indigo-600" placeholder="Dupont">
</div>
<div style="flex:1;min-width:200px;">
<label for="contact_surname" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Prenom</label>
<input type="text" id="contact_surname" name="surname" required
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
placeholder="Jean">
<div class="form-group">
<label for="contact_surname" class="text-xs font-black uppercase tracking-widest form-label">Prenom</label>
<input type="text" id="contact_surname" name="surname" required class="form-input focus:border-indigo-600" placeholder="Jean">
</div>
</div>
<div>
<label for="contact_email" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Email</label>
<input type="email" id="contact_email" name="email" required
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
placeholder="jean.dupont@exemple.fr">
<label for="contact_email" class="text-xs font-black uppercase tracking-widest form-label">Email</label>
<input type="email" id="contact_email" name="email" required class="form-input focus:border-indigo-600" placeholder="jean.dupont@exemple.fr">
</div>
<div>
<label for="contact_message" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Message</label>
<textarea id="contact_message" name="message" required rows="6"
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;resize:vertical;"
class="focus:border-indigo-600"
placeholder="Votre message..."></textarea>
<label for="contact_message" class="text-xs font-black uppercase tracking-widest form-label">Message</label>
<textarea id="contact_message" name="message" required rows="6" class="form-textarea focus:border-indigo-600" placeholder="Votre message..."></textarea>
</div>
<div>
<button type="submit"
style="padding:0.75rem 2rem;border:3px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);cursor:pointer;"
class="bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
<button type="submit" class="btn-brutal bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
Envoyer
</button>
</div>
</form>
<div style="border:4px solid #111827;padding:1.5rem;background:#f9fafb;box-shadow:6px 6px 0 rgba(0,0,0,1);margin-top:3rem;">
<h2 class="text-lg font-black uppercase" style="margin-bottom:0.5rem;">Autres moyens de contact</h2>
<ul style="list-style:disc;padding-left:1.5rem;" class="text-sm font-bold text-gray-700">
<div class="card-brutal-info mt-12">
<h2 class="text-lg font-black uppercase mb-2">Autres moyens de contact</h2>
<ul class="list-disc pl-6 text-sm font-bold text-gray-700">
<li>Email : <a href="mailto:contact@e-cosplay.fr" class="text-indigo-600 hover:underline">contact@e-cosplay.fr</a></li>
<li>Adresse : 42 rue de Saint-Quentin, 02800 Beautor, France</li>
</ul>

47
templates/security/forgot_password.html.twig
View File

@@ -4,9 +4,9 @@
{% block description %}Reinitialisation de votre mot de passe E-Ticket{% endblock %}
{% block body %}
<div style="max-width:28rem;margin:0 auto;padding:3rem 1rem;">
<h1 class="text-3xl font-black uppercase tracking-tighter italic" style="border-bottom:4px solid #111827;display:inline-block;margin-bottom:0.5rem;">Mot de passe oublie</h1>
<p class="font-bold text-gray-600 italic" style="margin-bottom:2rem;">
<div class="page-container-xs">
<h1 class="text-3xl font-black uppercase tracking-tighter italic heading-page">Mot de passe oublie</h1>
<p class="font-bold text-gray-600 italic mb-8">
{% if step == 'email' %}
Saisissez votre email pour recevoir un code.
{% else %}
@@ -15,66 +15,51 @@
</p>
{% for message in app.flashes('success') %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#d1fae5;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-success mb-8"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
{% for message in app.flashes('error') %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#fee2e2;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-error mb-8"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
{% if step == 'email' %}
<form method="post" action="{{ path('app_forgot_password') }}" style="display:flex;flex-direction:column;gap:1.5rem;">
<form method="post" action="{{ path('app_forgot_password') }}" class="form-col">
<input type="hidden" name="step" value="email">
<div>
<label for="forgot_email" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Email</label>
<label for="forgot_email" class="text-xs font-black uppercase tracking-widest form-label">Email</label>
<input type="email" id="forgot_email" name="email" required autofocus
value="{{ email }}"
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
placeholder="jean.dupont@exemple.fr">
value="{{ email }}" class="form-input focus:border-indigo-600" placeholder="jean.dupont@exemple.fr">
</div>
<div>
<button type="submit"
style="width:100%;padding:0.75rem 2rem;border:3px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);cursor:pointer;"
class="bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
<button type="submit" class="btn-brutal-full bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
Envoyer le code
</button>
</div>
</form>
{% else %}
<form method="post" action="{{ path('app_forgot_password') }}" style="display:flex;flex-direction:column;gap:1.5rem;">
<form method="post" action="{{ path('app_forgot_password') }}" class="form-col">
<input type="hidden" name="step" value="code">
<input type="hidden" name="email" value="{{ email }}">
<div>
<label for="forgot_code" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Code de verification</label>
<label for="forgot_code" class="text-xs font-black uppercase tracking-widest form-label">Code de verification</label>
<input type="text" id="forgot_code" name="code" required autofocus
maxlength="6" pattern="[0-9]{6}" inputmode="numeric"
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;text-align:center;font-size:1.5rem;letter-spacing:0.3em;"
class="focus:border-indigo-600"
placeholder="000000">
class="form-input focus:border-indigo-600 text-center text-2xl tracking-[0.3em]" placeholder="000000">
</div>
<div>
<label for="forgot_password" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Nouveau mot de passe</label>
<label for="forgot_password" class="text-xs font-black uppercase tracking-widest form-label">Nouveau mot de passe</label>
<input type="password" id="forgot_password" name="password" required minlength="8"
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
placeholder="••••••••">
class="form-input focus:border-indigo-600" placeholder="••••••••">
</div>
<div>
<button type="submit"
style="width:100%;padding:0.75rem 2rem;border:3px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);cursor:pointer;"
class="bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
<button type="submit" class="btn-brutal-full bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
Reinitialiser le mot de passe
</button>
</div>
</form>
{% endif %}
<div style="margin-top:2rem;text-align:center;">
<div class="mt-8 text-center">
<p class="text-sm font-bold text-gray-600"><a href="{{ path('app_login') }}" class="text-indigo-600 hover:underline font-black">Retour a la connexion</a></p>
</div>
</div>

48
templates/security/login.html.twig
View File

@@ -4,74 +4,62 @@
{% block description %}Connectez-vous a votre compte E-Ticket pour gerer vos evenements et billets{% endblock %}
{% block body %}
<div style="max-width:28rem;margin:0 auto;padding:3rem 1rem;">
<h1 class="text-3xl font-black uppercase tracking-tighter italic" style="border-bottom:4px solid #111827;display:inline-block;margin-bottom:0.5rem;">Connexion</h1>
<p class="font-bold text-gray-600 italic" style="margin-bottom:2rem;">Accedez a votre espace.</p>
<div class="page-container-xs">
<h1 class="text-3xl font-black uppercase tracking-tighter italic heading-page">Connexion</h1>
<p class="font-bold text-gray-600 italic mb-8">Accedez a votre espace.</p>
{% for message in app.flashes('success') %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#d1fae5;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-success mb-8"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
{% if error %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#fee2e2;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ error.messageKey|trans(error.messageData, 'security') }}</p>
</div>
<div class="flash-error mb-8"><p class="font-black text-sm">{{ error.messageKey|trans(error.messageData, 'security') }}</p></div>
{% endif %}
{% for message in app.flashes('error') %}
<div style="border:4px solid #111827;padding:1rem 1.5rem;margin-bottom:2rem;background:#fee2e2;box-shadow:4px 4px 0 rgba(0,0,0,1);">
<p class="font-black text-sm">{{ message }}</p>
</div>
<div class="flash-error mb-8"><p class="font-black text-sm">{{ message }}</p></div>
{% endfor %}
<form method="post" action="{{ path('app_login') }}" style="display:flex;flex-direction:column;gap:1.5rem;">
<form method="post" action="{{ path('app_login') }}" class="form-col">
<div>
<label for="login_email" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Email</label>
<label for="login_email" class="text-xs font-black uppercase tracking-widest form-label">Email</label>
<input type="email" id="login_email" name="_username" required autofocus
value="{{ last_username }}"
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
class="form-input focus:border-indigo-600"
placeholder="jean.dupont@exemple.fr">
</div>
<div>
<label for="login_password" class="text-xs font-black uppercase tracking-widest" style="display:block;margin-bottom:0.5rem;">Mot de passe</label>
<label for="login_password" class="text-xs font-black uppercase tracking-widest form-label">Mot de passe</label>
<input type="password" id="login_password" name="_password" required
style="width:100%;padding:0.75rem 1rem;border:3px solid #111827;font-weight:700;outline:none;"
class="focus:border-indigo-600"
class="form-input focus:border-indigo-600"
placeholder="••••••••">
</div>
<div style="text-align:right;">
<div class="text-right">
<a href="{{ path('app_forgot_password') }}" class="text-xs font-bold text-indigo-600 hover:underline">Mot de passe oublie ?</a>
</div>
<input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
<div>
<button type="submit"
style="width:100%;padding:0.75rem 2rem;border:3px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);cursor:pointer;"
class="bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
<button type="submit" class="btn-brutal-full bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
Se connecter
</button>
</div>
</form>
<div style="display:flex;align-items:center;gap:1rem;margin-top:2rem;">
<div style="flex:1;height:3px;background:#111827;"></div>
<div class="flex items-center gap-4 mt-8">
<div class="divider"></div>
<span class="text-xs font-black uppercase tracking-widest text-gray-500">ou</span>
<div style="flex:1;height:3px;background:#111827;"></div>
<div class="divider"></div>
</div>
<a href="{{ path('app_oauth_keycloak') }}"
style="display:block;width:100%;padding:0.75rem 2rem;border:3px solid #111827;box-shadow:4px 4px 0 rgba(0,0,0,1);text-align:center;text-decoration:none;margin-top:1.5rem;"
class="bg-gray-900 text-white font-black uppercase text-sm tracking-widest hover:bg-indigo-600 transition-all">
<a href="{{ path('app_oauth_keycloak') }}" class="btn-brutal-dark mt-6 bg-gray-900 text-white font-black uppercase text-sm tracking-widest hover:bg-indigo-600 transition-all">
Se connecter avec E-Cosplay
</a>
<div style="margin-top:2rem;text-align:center;">
<div class="mt-8 text-center">
<p class="text-sm font-bold text-gray-600">Pas encore de compte ? <a href="{{ path('app_register') }}" class="text-indigo-600 hover:underline font-black">Inscription</a></p>
</div>
</div>