wkadmin/the-tip-top-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: add descriptive alt text to tea icon images for accessibility

Browse Source 
Updated all decorative tea icons with proper alt attributes:
- teapot-green.png: "Théière verte"
- tea-cup.png: "Tasse de thé"
- gift-box.png: "Boîte cadeau"
- tea-leaves.png: "Feuilles de thé"
- teapot-pink.png: "Théière rose"

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
soufiane 2025-11-29 00:19:57 +01:00
parent bbbfc76034
commit 534b6fc50c
3 changed files with 105 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
app/login/page.tsx
View File

@ -87,53 +87,53 @@ export default function LoginPage() {
{/* Icônes de thé dispersées avec animation de descente - 35 icônes */} {/* Icônes de thé dispersées avec animation de descente - 35 icônes */}
<div key={animationKey} className="absolute inset-0 opacity-[0.5]"> <div key={animationKey} className="absolute inset-0 opacity-[0.5]">
{/* Ligne 1 - 5 icons */} {/* Ligne 1 - 5 icons */}
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[5%] left-[10%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[5%] left-[10%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[7%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[7%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[6%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[6%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[8%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[8%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[5%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[5%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} />
{/* Ligne 2 - 5 icons */} {/* Ligne 2 - 5 icons */}
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[18%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[18%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[20%] left-[35%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[20%] left-[35%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[19%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[19%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[21%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[21%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[18%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[18%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} />
{/* Ligne 3 - 5 icons */} {/* Ligne 3 - 5 icons */}
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[31%] left-[10%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[31%] left-[10%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[33%] left-[30%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[33%] left-[30%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[32%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[32%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[34%] left-[70%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[34%] left-[70%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[31%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[31%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} />
{/* Ligne 4 - 5 icons */} {/* Ligne 4 - 5 icons */}
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[44%] left-[15%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[44%] left-[15%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[46%] left-[35%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[46%] left-[35%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[45%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[45%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[47%] left-[75%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[47%] left-[75%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[44%] left-[95%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[44%] left-[95%] animate-float-gentle" style={{animationDuration: '29s'}} />
{/* Ligne 5 - 5 icons */} {/* Ligne 5 - 5 icons */}
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[57%] left-[10%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[57%] left-[10%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[59%] left-[30%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[59%] left-[30%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[58%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[58%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[60%] left-[70%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[60%] left-[70%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[57%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[57%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} />
{/* Ligne 6 - 5 icons */} {/* Ligne 6 - 5 icons */}
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[70%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[70%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[72%] left-[35%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[72%] left-[35%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[71%] left-[55%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[71%] left-[55%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[73%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[73%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[70%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[70%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} />
{/* Ligne 7 - 5 icons */} {/* Ligne 7 - 5 icons */}
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[83%] left-[10%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[83%] left-[10%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[85%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[85%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[84%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[84%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[86%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[86%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[83%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[83%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} />
</div> </div>
{/* Overlay lumineux pour harmoniser */} {/* Overlay lumineux pour harmoniser */}

70
app/page.tsx
View File

@ -25,53 +25,53 @@ export default function HomePage() {
{/* Icônes de thé dispersées avec animation de descente - 35 icônes */} {/* Icônes de thé dispersées avec animation de descente - 35 icônes */}
<div key={animationKey} className="absolute inset-0 opacity-[0.5]"> <div key={animationKey} className="absolute inset-0 opacity-[0.5]">
{/* Ligne 1 - 5 icons */} {/* Ligne 1 - 5 icons */}
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[5%] left-[10%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[5%] left-[10%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[7%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[7%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[6%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[6%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[8%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[8%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[5%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[5%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} />
{/* Ligne 2 - 5 icons */} {/* Ligne 2 - 5 icons */}
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[18%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[18%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[20%] left-[35%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[20%] left-[35%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[19%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[19%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[21%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[21%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[18%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[18%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} />
{/* Ligne 3 - 5 icons */} {/* Ligne 3 - 5 icons */}
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[31%] left-[10%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[31%] left-[10%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[33%] left-[30%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[33%] left-[30%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[32%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[32%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[34%] left-[70%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[34%] left-[70%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[31%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[31%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} />
{/* Ligne 4 - 5 icons */} {/* Ligne 4 - 5 icons */}
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[44%] left-[15%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[44%] left-[15%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[46%] left-[35%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[46%] left-[35%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[45%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[45%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[47%] left-[75%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[47%] left-[75%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[44%] left-[95%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[44%] left-[95%] animate-float-gentle" style={{animationDuration: '29s'}} />
{/* Ligne 5 - 5 icons */} {/* Ligne 5 - 5 icons */}
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[57%] left-[10%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[57%] left-[10%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[59%] left-[30%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[59%] left-[30%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[58%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[58%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[60%] left-[70%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[60%] left-[70%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[57%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[57%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} />
{/* Ligne 6 - 5 icons */} {/* Ligne 6 - 5 icons */}
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[70%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[70%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[72%] left-[35%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[72%] left-[35%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[71%] left-[55%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[71%] left-[55%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[73%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[73%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[70%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[70%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} />
{/* Ligne 7 - 5 icons */} {/* Ligne 7 - 5 icons */}
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[83%] left-[10%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[83%] left-[10%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[85%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[85%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[84%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[84%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[86%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[86%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[83%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[83%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} />
</div> </div>
{/* Overlay lumineux pour harmoniser */} {/* Overlay lumineux pour harmoniser */}

70
app/register/page.tsx
View File

@ -44,53 +44,53 @@ export default function RegisterPage() {
{/* Icônes de thé dispersées avec animation de descente - 35 icônes */} {/* Icônes de thé dispersées avec animation de descente - 35 icônes */}
<div key={animationKey} className="absolute inset-0 opacity-[0.5]"> <div key={animationKey} className="absolute inset-0 opacity-[0.5]">
{/* Ligne 1 - 5 icons */} {/* Ligne 1 - 5 icons */}
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[5%] left-[10%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[5%] left-[10%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[7%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[7%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[6%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[6%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[8%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[8%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[5%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[5%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} />
{/* Ligne 2 - 5 icons */} {/* Ligne 2 - 5 icons */}
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[18%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[18%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[20%] left-[35%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[20%] left-[35%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[19%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[19%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[21%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[21%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[18%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[18%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} />
{/* Ligne 3 - 5 icons */} {/* Ligne 3 - 5 icons */}
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[31%] left-[10%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[31%] left-[10%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[33%] left-[30%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[33%] left-[30%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[32%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[32%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[34%] left-[70%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[34%] left-[70%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[31%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[31%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} />
{/* Ligne 4 - 5 icons */} {/* Ligne 4 - 5 icons */}
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[44%] left-[15%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[44%] left-[15%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[46%] left-[35%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[46%] left-[35%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[45%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[45%] left-[55%] animate-float-gentle" style={{animationDuration: '33s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[47%] left-[75%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[47%] left-[75%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[44%] left-[95%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[44%] left-[95%] animate-float-gentle" style={{animationDuration: '29s'}} />
{/* Ligne 5 - 5 icons */} {/* Ligne 5 - 5 icons */}
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[57%] left-[10%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[57%] left-[10%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[59%] left-[30%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[59%] left-[30%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[58%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[58%] left-[50%] animate-float-gentle" style={{animationDuration: '30s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[60%] left-[70%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[60%] left-[70%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[57%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[57%] left-[90%] animate-float-gentle" style={{animationDuration: '32s'}} />
{/* Ligne 6 - 5 icons */} {/* Ligne 6 - 5 icons */}
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[70%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[70%] left-[15%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[72%] left-[35%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[72%] left-[35%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[71%] left-[55%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[71%] left-[55%] animate-float-gentle" style={{animationDuration: '31s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[73%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[73%] left-[75%] animate-float-gentle" style={{animationDuration: '28s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[70%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[70%] left-[95%] animate-float-gentle" style={{animationDuration: '30s'}} />
{/* Ligne 7 - 5 icons */} {/* Ligne 7 - 5 icons */}
<Image src="/images/tea-icons/gift-box.png" alt="" width={56} height={56} className="absolute top-[83%] left-[10%] animate-float-gentle" style={{animationDuration: '26s'}} /> <Image src="/images/tea-icons/gift-box.png" alt="Boîte cadeau" width={56} height={56} className="absolute top-[83%] left-[10%] animate-float-gentle" style={{animationDuration: '26s'}} />
<Image src="/images/tea-icons/teapot-green.png" alt="" width={56} height={56} className="absolute top-[85%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} /> <Image src="/images/tea-icons/teapot-green.png" alt="Théière verte" width={56} height={56} className="absolute top-[85%] left-[30%] animate-float-gentle" style={{animationDuration: '32s'}} />
<Image src="/images/tea-icons/tea-leaves.png" alt="" width={56} height={56} className="absolute top-[84%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} /> <Image src="/images/tea-icons/tea-leaves.png" alt="Feuilles de thé" width={56} height={56} className="absolute top-[84%] left-[50%] animate-float-gentle" style={{animationDuration: '29s'}} />
<Image src="/images/tea-icons/tea-cup.png" alt="" width={56} height={56} className="absolute top-[86%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} /> <Image src="/images/tea-icons/tea-cup.png" alt="Tasse de thé" width={56} height={56} className="absolute top-[86%] left-[70%] animate-float-gentle" style={{animationDuration: '27s'}} />
<Image src="/images/tea-icons/teapot-pink.png" alt="" width={56} height={56} className="absolute top-[83%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} /> <Image src="/images/tea-icons/teapot-pink.png" alt="Théière rose" width={56} height={56} className="absolute top-[83%] left-[90%] animate-float-gentle" style={{animationDuration: '31s'}} />
</div> </div>
{/* Overlay lumineux pour harmoniser */} {/* Overlay lumineux pour harmoniser */}