melvin-leveque/interface-kaznautes
2
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: suppression d'une migration et amélioration des formulaires + messages d'erreur (révision design + placeholders ajoutés)

Browse Source
This commit is contained in:
maurine
2026-04-09 19:36:55 +02:00
parent 6f9523f9e7
commit 1bb651b7e4
5 changed files with 36 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
templates/home/home.html.twig
View File

@@ -20,19 +20,19 @@
TODO : Gérer les données avec Pahéko, mise en service en cours par un des développeurs de l'association. Cela sera vu à posteriori du stage #}
<div class="bg-bouton/10 border border-bouton/30 rounded-lg p-5">
<h3 class="font-semibold text-title mb-3 flex items-center gap-2">
Votre abonnement actuellement :
Ton abonnement actuellement :
</h3>
<ul class="space-y-2 text-sm text-text">
<li class="flex flex-col sm:flex-row sm:items-center gap-1 sm:gap-2">
<span class="font-semibold text-gris-fonce">Formule souscrite :</span>
{# TODO API : Remplacer par la vraie variable #}
<span class="italic opacity-70">Ajouter la vraie valeur</span>
{# TODO API : Remplacer par la vraie variable quand connexion Pahéko OK #}
<span class="italic opacity-70">Ici s'affichera la donnée récupérée grâce à l'API</span>
</li>
<li class="flex flex-col sm:flex-row sm:items-center gap-1 sm:gap-2">
<span class="font-semibold text-gris-fonce">Date de validité :</span>
{# TODO API : Remplacer par la vraie variable #}
<span class="italic opacity-70">Ajouter la vraie valeur</span>
{# TODO API : Remplacer par la vraie variable quand connexion Pahéko OK #}
<span class="italic opacity-70">Ici s'affichera la donnée récupérée grâce à l'API</span>
</li>
</ul>
</div>

54
templates/user/edit_password.html.twig
View File

@@ -6,19 +6,22 @@
<div class="min-h-screen bg-bg-primaire flex items-center justify-center p-4 font-sora">
<div class="max-w-md w-full bg-white rounded-2xl shadow-xl p-8 border-t-4 border-bouton">
<h1 class="font-caveat text-4xl text-text mb-6 text-center">
Sécurité du compte
<h1 class="font-caveat text-4xl text-text mb-12 text-center">
Modifier le mot de passe de mon espace kaznaute
</h1>
{{ form_start(form) }}
<div class="space-y-4">
<div class="space-y-6">
{# Champ Ancien Mot de Passe #}
<div class="space-y-1">
{{ form_label(form.oldPassword, 'Mot de passe actuel', {
{{ form_label(form.oldPassword, 'Mon mot de passe actuel', {
'label_attr': {'class': 'block text-sm font-semibold text-text'}
}) }}
{{ form_widget(form.oldPassword, {
'attr': {'class': 'w-full px-4 py-3 border border-gris-clair rounded-lg focus:outline-none focus:border-bouton focus:ring-1 focus:ring-bouton placeholder-gris-moyen transition-shadow'}
'attr': {
'class': 'w-full px-4 py-3 border border-gris-clair rounded-lg focus:outline-none focus:border-bouton focus:ring-1 focus:ring-bouton placeholder-gris-moyen transition-shadow',
'placeholder':'Saisissez votre ancien mot de passe'
}
}) }}
{# Affichage message pour les erreurs de saisie de l'ancien mot de passe #}
@@ -28,45 +31,46 @@
</div>
{# Champs Nouveau Mot de Passe #}
<div class="space-y-4 pt-2">
{# Affichage de l'erreur si les deux champs ne correspondent pas #}
<div class="space-y-6">
{# Affichage d'un message d'erreur si les deux champs ne correspondent pas #}
<div class="text-red-500 text-xs italic">
{{ form_errors(form.newPassword) }}
</div>
<div class="space-y-1">
{{ form_label(form.newPassword.first, 'Nouveau mot de passe', {
<div class="flex flex-col gap-1.5">
{{ form_label(form.newPassword.first, 'Mon nouveau mot de passe', {
'label_attr': {'class': 'block text-sm font-semibold text-text'}
}) }}
{{ form_widget(form.newPassword.first, {
'attr': {'class': 'w-full px-4 py-3 border border-gris-clair rounded-lg focus:outline-none focus:border-bouton focus:ring-1 focus:ring-bouton transition-shadow'}
'attr': {
'class': 'w-full px-4 py-3 border border-gris-clair rounded-lg focus:outline-none focus:border-bouton focus:ring-1 focus:ring-bouton placeholder-gris-moyen transition-all',
'placeholder':'Saisissez un nouveau mot de passe'
}
}) }}
{# Affichage de l'erreur de longueur (min 8 caractères) #}
<div class="text-red-500 text-xs mt-1 italic">
<div class="text-red-500 text-xs italic">
{{ form_errors(form.newPassword.first) }}
</div>
</div>
<div class="space-y-1">
{{ form_label(form.newPassword.second, 'Confirmer le nouveau mot de passe', {
<div class="flex flex-col gap-1.5">
{{ form_label(form.newPassword.second, 'Confirmer mon nouveau mot de passe', {
'label_attr': {'class': 'block text-sm font-semibold text-text'}
}) }}
{{ form_widget(form.newPassword.second, {
'attr': {'class': 'w-full px-4 py-3 border border-gris-clair rounded-lg focus:outline-none focus:border-bouton focus:ring-1 focus:ring-bouton transition-shadow'}
'attr': {
'class': 'w-full px-4 py-3 border border-gris-clair rounded-lg focus:outline-none focus:border-bouton focus:ring-1 focus:ring-bouton placeholder-gris-moyen transition-all',
'placeholder': 'Confirmez votre saisie'
}
}) }}
</div>
<div class="text-red-500 text-xs mt-1">
{{ form_errors(form.newPassword) }}
</div>
</div>
{# Bouton de validation #}
<div class="md:col-span-3 w-full flex justify-center pt-8 pb-4">
<button type="submit"
class="px-8 py-2.5 bg-bouton hover:bg-bouton-hover text-text text-sm font-bold rounded-lg shadow transition-colors">
Mettre à jour mon mot de passe
</button>
<div class="flex justify-center pt-12">
<button type="submit"
class="w-full sm:w-auto px-8 py-3 bg-bouton hover:bg-bouton-hover text-text text-sm font-bold rounded-lg shadow transition-all active:scale-95">
Mettre à jour mon mot de passe
</button>
</div>
</div>
{{ form_end(form) }}