Enhance UI consistency across multiple components: Update SectionTitle sizes and margins in StyleGuidePage, AdminPanel, ChallengesSection, HousesSection, LeaderboardSection, and ProfileForm. Add descriptive subtitles and additional text for improved user guidance.

This commit is contained in:
Julien Froidefond
2025-12-18 08:13:55 +01:00
parent a62e61a314
commit 4a415f79e0
6 changed files with 32 additions and 9 deletions

View File

@@ -38,7 +38,7 @@ export default function AdminPanel({ initialPreferences }: AdminPanelProps) {
return (
<section className="relative w-full min-h-screen flex flex-col items-center overflow-hidden pt-24 pb-16">
<div className="relative z-10 w-full max-w-6xl mx-auto px-8 py-16">
<SectionTitle variant="gradient" size="md" className="mb-8 text-center">
<SectionTitle variant="gradient" size="md" className="mb-16 text-center">
ADMIN
</SectionTitle>

View File

@@ -159,9 +159,18 @@ export default function ChallengesSection({
</div>
<div className="relative z-10 w-full max-w-6xl mx-auto px-4 sm:px-8 py-16">
<SectionTitle variant="gradient" size="md" className="mb-8 text-center">
<SectionTitle
variant="gradient"
size="xl"
subtitle="Défiez vos collègues et gagnez des points"
className="mb-16"
>
DÉFIS ENTRE JOUEURS
</SectionTitle>
<p className="text-gray-400 text-sm max-w-2xl mx-auto text-center mb-16">
Créez des défis personnalisés, acceptez ceux de vos collègues et
remportez des récompenses en points pour monter dans le classement
</p>
{successMessage && (
<Alert variant="success" className="mb-4">

View File

@@ -149,12 +149,16 @@ export default function HousesSection({
{/* Title Section */}
<SectionTitle
variant="gradient"
size="lg"
size="xl"
subtitle="Rejoignez une maison ou créez la vôtre"
className="mb-12 overflow-hidden"
className="mb-16"
>
MAISONS
</SectionTitle>
<p className="text-gray-400 text-sm max-w-2xl mx-auto text-center mb-16">
Formez des équipes, créez votre propre maison et rivalisez avec les
autres maisons pour dominer le classement collectif
</p>
<div className="space-y-4 sm:space-y-6">
{session?.user && (

View File

@@ -74,12 +74,17 @@ export default function LeaderboardSection({
{/* Title Section */}
<SectionTitle
variant="gradient"
size="lg"
size="xl"
subtitle="Top Players"
className="mb-12 overflow-hidden"
className="mb-16"
>
LEADERBOARD
</SectionTitle>
<p className="text-gray-400 text-sm max-w-2xl mx-auto text-center mb-16">
Consultez le classement des meilleurs joueurs et des maisons les plus
performantes. Montez dans les rangs en participant aux événements et en
relevant des défis
</p>
{/* Players Leaderboard Table */}
<div className="bg-black/60 border border-pixel-gold/30 rounded-lg backdrop-blur-sm overflow-x-auto">

View File

@@ -171,12 +171,17 @@ export default function ProfileForm({
{/* Title Section */}
<SectionTitle
variant="gradient"
size="lg"
size="xl"
subtitle="Gérez votre profil"
className="mb-12"
className="mb-16"
>
PROFIL
</SectionTitle>
<p className="text-gray-400 text-sm max-w-2xl mx-auto text-center mb-16">
Personnalisez votre avatar, votre bio, votre classe de personnage et
consultez vos statistiques. Gérez vos préférences et votre mot de
passe
</p>
{/* Profile Card */}
<Card variant="default" className="overflow-hidden">