Merge dev into preprod: WAVE accessibility fixes
This commit is contained in:
commit
c2a236b406
|
|
@ -97,7 +97,7 @@ export default function ContactPage() {
|
|||
{/* Nom complet */}
|
||||
<div>
|
||||
<label htmlFor="fullName" className="block text-sm font-semibold text-gray-700 mb-2">
|
||||
Nom complet <span className="text-red-500">*</span>
|
||||
Nom complet <span className="text-red-600" aria-hidden="true">*</span>
|
||||
</label>
|
||||
<input
|
||||
id="fullName"
|
||||
|
|
@ -114,7 +114,7 @@ export default function ContactPage() {
|
|||
{/* Email */}
|
||||
<div>
|
||||
<label htmlFor="email" className="block text-sm font-semibold text-gray-700 mb-2">
|
||||
Email <span className="text-red-500">*</span>
|
||||
Email <span className="text-red-600" aria-hidden="true">*</span>
|
||||
</label>
|
||||
<input
|
||||
id="email"
|
||||
|
|
@ -131,7 +131,7 @@ export default function ContactPage() {
|
|||
{/* Sujet */}
|
||||
<div>
|
||||
<label htmlFor="subject" className="block text-sm font-semibold text-gray-700 mb-2">
|
||||
Sujet <span className="text-red-500">*</span>
|
||||
Sujet <span className="text-red-600" aria-hidden="true">*</span>
|
||||
</label>
|
||||
<select
|
||||
id="subject"
|
||||
|
|
@ -153,7 +153,7 @@ export default function ContactPage() {
|
|||
{/* Message */}
|
||||
<div>
|
||||
<label htmlFor="message" className="block text-sm font-semibold text-gray-700 mb-2">
|
||||
Message <span className="text-red-500">*</span>
|
||||
Message <span className="text-red-600" aria-hidden="true">*</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="message"
|
||||
|
|
@ -183,7 +183,7 @@ export default function ContactPage() {
|
|||
<Link href="/privacy" className="text-primary-500 underline hover:text-primary-600">
|
||||
politique de confidentialité
|
||||
</Link>{' '}
|
||||
<span className="text-red-500">*</span>
|
||||
<span className="text-red-600" aria-hidden="true">*</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -291,9 +291,10 @@ export default function ContactPage() {
|
|||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 z-10 group"
|
||||
aria-label="Voir notre emplacement sur Google Maps - 18 Avenue Thiers, Nice"
|
||||
>
|
||||
<span className="block w-6 h-6 bg-primary-500 rounded-full border-2 border-white shadow-lg cursor-pointer hover:scale-125 transition-transform animate-pulse"></span>
|
||||
<span className="absolute -bottom-1 left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-[6px] border-r-[6px] border-t-[8px] border-l-transparent border-r-transparent border-t-primary-500"></span>
|
||||
<span className="block w-6 h-6 bg-primary-500 rounded-full border-2 border-white shadow-lg cursor-pointer hover:scale-125 transition-transform animate-pulse" aria-hidden="true"></span>
|
||||
<span className="absolute -bottom-1 left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-[6px] border-r-[6px] border-t-[8px] border-l-transparent border-r-transparent border-t-primary-500" aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<a
|
||||
|
|
|
|||
|
|
@ -163,12 +163,17 @@ export default function HistoriquePage() {
|
|||
<div className="flex flex-col md:flex-row gap-4">
|
||||
<div className="flex-1">
|
||||
<div className="relative">
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-500 w-5 h-5" />
|
||||
<label htmlFor="search-tickets" className="sr-only">
|
||||
Rechercher par code ticket
|
||||
</label>
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-500 w-5 h-5" aria-hidden="true" />
|
||||
<input
|
||||
id="search-tickets"
|
||||
type="text"
|
||||
placeholder="Rechercher par code ticket..."
|
||||
value={searchQuery}
|
||||
onChange={(e) => setSearchQuery(e.target.value)}
|
||||
aria-label="Rechercher par code ticket"
|
||||
className="w-full pl-10 pr-4 py-3 border-2 border-beige-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ export default function Footer() {
|
|||
<div className="mb-4">
|
||||
<Logo variant="default" size="md" showText={true} />
|
||||
</div>
|
||||
<p className="text-sm text-beige-600 mb-4">
|
||||
<p className="text-sm text-beige-700 mb-4">
|
||||
Découvrez nos thés premium bio et artisanaux. Participez à notre grand
|
||||
jeu-concours 100% gagnant et tentez de remporter nos magnifiques lots !
|
||||
</p>
|
||||
|
|
@ -58,7 +58,7 @@ export default function Footer() {
|
|||
href="https://www.facebook.com/profile.php?id=61584261567579"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-beige-700 hover:text-primary-500 transition-colors"
|
||||
aria-label="Facebook"
|
||||
>
|
||||
<svg className="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
|
||||
|
|
@ -69,7 +69,7 @@ export default function Footer() {
|
|||
href="https://www.instagram.com/thetiptopgr3/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-beige-700 hover:text-primary-500 transition-colors"
|
||||
aria-label="Instagram"
|
||||
>
|
||||
<svg className="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
|
||||
|
|
@ -80,7 +80,7 @@ export default function Footer() {
|
|||
href="https://www.pinterest.com/The_Tip_Top_/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-beige-700 hover:text-primary-500 transition-colors"
|
||||
aria-label="Pinterest"
|
||||
>
|
||||
<svg className="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
|
||||
|
|
@ -99,7 +99,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href={ROUTES.HOME}
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Accueil
|
||||
</Link>
|
||||
|
|
@ -107,7 +107,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href={isAuthenticated ? ROUTES.GAME : ROUTES.REGISTER}
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Participer au jeu
|
||||
</Link>
|
||||
|
|
@ -115,7 +115,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href="/contact"
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Contact
|
||||
</Link>
|
||||
|
|
@ -123,7 +123,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href="/faq"
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
FAQ
|
||||
</Link>
|
||||
|
|
@ -138,7 +138,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href="/terms"
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Conditions d'utilisation
|
||||
</Link>
|
||||
|
|
@ -146,7 +146,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href="/privacy"
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Politique de confidentialité
|
||||
</Link>
|
||||
|
|
@ -154,7 +154,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href="/rules"
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Règlement du jeu
|
||||
</Link>
|
||||
|
|
@ -162,7 +162,7 @@ export default function Footer() {
|
|||
<li>
|
||||
<Link
|
||||
href="/legal"
|
||||
className="text-sm text-beige-600 hover:text-primary-500 transition-colors"
|
||||
className="text-sm text-beige-700 hover:text-primary-500 transition-colors"
|
||||
>
|
||||
Mentions légales
|
||||
</Link>
|
||||
|
|
@ -173,16 +173,21 @@ export default function Footer() {
|
|||
{/* Newsletter */}
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-primary-500 mb-4">NEWSLETTER</h3>
|
||||
<p className="text-sm text-beige-600 mb-4">
|
||||
<p className="text-sm text-beige-700 mb-4">
|
||||
Inscrivez-vous pour recevoir nos offres exclusives et nouveautés !
|
||||
</p>
|
||||
<form onSubmit={handleNewsletterSubmit} className="space-y-3">
|
||||
<div>
|
||||
<label htmlFor="newsletter-email" className="sr-only">
|
||||
Adresse email pour la newsletter
|
||||
</label>
|
||||
<input
|
||||
id="newsletter-email"
|
||||
type="email"
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
placeholder="Votre email"
|
||||
aria-label="Adresse email pour la newsletter"
|
||||
className="w-full px-4 py-2 text-sm border border-beige-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white text-beige-800 placeholder-beige-500"
|
||||
disabled={isLoading}
|
||||
/>
|
||||
|
|
@ -205,7 +210,7 @@ export default function Footer() {
|
|||
)}
|
||||
</form>
|
||||
<div className="mt-4 pt-4 border-t border-beige-300">
|
||||
<p className="text-xs text-beige-600 flex items-center gap-1">
|
||||
<p className="text-xs text-beige-700 flex items-center gap-1">
|
||||
<span>✉️</span>
|
||||
<a
|
||||
href="mailto:thetiptopgr3@gmail.com"
|
||||
|
|
@ -214,7 +219,7 @@ export default function Footer() {
|
|||
thetiptopgr3@gmail.com
|
||||
</a>
|
||||
</p>
|
||||
<p className="text-xs text-beige-600 mt-1 flex items-center gap-1">
|
||||
<p className="text-xs text-beige-700 mt-1 flex items-center gap-1">
|
||||
<span>📞</span>
|
||||
<a
|
||||
href="tel:+33123456789"
|
||||
|
|
@ -232,8 +237,8 @@ export default function Footer() {
|
|||
<div className="border-t border-beige-300">
|
||||
<div className="container mx-auto px-4 py-6">
|
||||
<div className="flex items-center justify-center text-sm">
|
||||
<p className="text-beige-600">
|
||||
© {currentYear} Tous droits réservés. <span className="text-beige-500 text-xs">Site étudiant</span>
|
||||
<p className="text-beige-700">
|
||||
© {currentYear} Tous droits réservés. <span className="text-beige-600 text-xs">Site étudiant</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -109,40 +109,40 @@ export default function ProfilePage({
|
|||
</div>
|
||||
<div className="p-6">
|
||||
{!isEditing ? (
|
||||
<div className="space-y-4">
|
||||
<dl className="space-y-4">
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-600">
|
||||
<dt className="text-sm font-medium text-gray-700">
|
||||
Prénom
|
||||
</label>
|
||||
<p className="text-lg text-gray-900">{user.firstName}</p>
|
||||
</dt>
|
||||
<dd className="text-lg text-gray-900">{user.firstName}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-600">
|
||||
<dt className="text-sm font-medium text-gray-700">
|
||||
Nom
|
||||
</label>
|
||||
<p className="text-lg text-gray-900">{user.lastName}</p>
|
||||
</dt>
|
||||
<dd className="text-lg text-gray-900">{user.lastName}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-600">
|
||||
<dt className="text-sm font-medium text-gray-700">
|
||||
Email
|
||||
</label>
|
||||
<p className="text-lg text-gray-900">{user.email}</p>
|
||||
</dt>
|
||||
<dd className="text-lg text-gray-900">{user.email}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-600">
|
||||
<dt className="text-sm font-medium text-gray-700">
|
||||
Téléphone
|
||||
</label>
|
||||
<p className="text-lg text-gray-900">
|
||||
</dt>
|
||||
<dd className="text-lg text-gray-900">
|
||||
{user.phone || "Non renseigné"}
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-600">
|
||||
<dt className="text-sm font-medium text-gray-700">
|
||||
Rôle
|
||||
</label>
|
||||
<div className="mt-1">
|
||||
</dt>
|
||||
<dd className="mt-1">
|
||||
<Badge variant={badgeVariant}>{roleLabel}</Badge>
|
||||
</div>
|
||||
</dd>
|
||||
</div>
|
||||
<div className="pt-4">
|
||||
<button
|
||||
|
|
@ -152,7 +152,7 @@ export default function ProfilePage({
|
|||
Modifier mes informations
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</dl>
|
||||
) : (
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
|
||||
<Input
|
||||
|
|
@ -216,14 +216,14 @@ export default function ProfilePage({
|
|||
<h2 className="text-xl font-bold text-gray-900">Statut du compte</h2>
|
||||
</div>
|
||||
<div className="p-6 space-y-4">
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-600">
|
||||
<dl>
|
||||
<dt className="text-sm font-medium text-gray-700">
|
||||
Membre depuis
|
||||
</label>
|
||||
<p className="text-sm text-gray-900 mt-1">
|
||||
</dt>
|
||||
<dd className="text-sm text-gray-900 mt-1">
|
||||
{formatDate(user.createdAt)}
|
||||
</p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user