Refactoring - Version OK

unionflow-mobile-apps/lib/features/about/presentation/pages/about_page.dart

@@ -1,6 +1,9 @@
 import 'package:flutter/material.dart';
 import 'package:package_info_plus/package_info_plus.dart';
 import 'package:url_launcher/url_launcher.dart';
+import '../../../../shared/design_system/tokens/color_tokens.dart';
+import '../../../../shared/design_system/tokens/spacing_tokens.dart';
+
 
 /// Page À propos - UnionFlow Mobile
 /// 
@@ -70,17 +73,17 @@ class _AboutPageState extends State<AboutPage> {
   /// Header harmonisé avec le design system
   Widget _buildHeader() {
     return Container(
-      padding: const EdgeInsets.all(16),
+      padding: const EdgeInsets.all(SpacingTokens.xl),
       decoration: BoxDecoration(
         gradient: const LinearGradient(
-          colors: [Color(0xFF6C5CE7), Color(0xFF5A4FCF)],
+          colors: ColorTokens.primaryGradient,
           begin: Alignment.topLeft,
           end: Alignment.bottomRight,
         ),
-        borderRadius: BorderRadius.circular(16),
+        borderRadius: BorderRadius.circular(SpacingTokens.xl),
         boxShadow: [
           BoxShadow(
-            color: const Color(0xFF6C5CE7).withOpacity(0.3),
+            color: ColorTokens.primary.withOpacity(0.3),
             blurRadius: 20,
             offset: const Offset(0, 8),
           ),
@@ -175,11 +178,11 @@ class _AboutPageState extends State<AboutPage> {
                   height: 80,
                   decoration: BoxDecoration(
                     gradient: const LinearGradient(
-                      colors: [Color(0xFF6C5CE7), Color(0xFF5A4FCF)],
+                      colors: ColorTokens.primaryGradient,
                       begin: Alignment.topLeft,
                       end: Alignment.bottomRight,
                     ),
-                    borderRadius: BorderRadius.circular(20),
+                    borderRadius: BorderRadius.circular(SpacingTokens.xxl),
                   ),
                   child: const Icon(
                     Icons.account_balance,
@@ -294,19 +297,19 @@ class _AboutPageState extends State<AboutPage> {
             'UnionFlow Team',
             'Développement & Architecture',
             Icons.code,
-            const Color(0xFF6C5CE7),
+            ColorTokens.primary,
           ),
           _buildTeamMember(
             'Design System',
             'Interface utilisateur & UX',
             Icons.design_services,
-            const Color(0xFF0984E3),
+            ColorTokens.info,
           ),
           _buildTeamMember(
             'Support Technique',
             'Maintenance & Support',
             Icons.support_agent,
-            const Color(0xFF00B894),
+            ColorTokens.success,
           ),
         ],
       ),
@@ -401,31 +404,31 @@ class _AboutPageState extends State<AboutPage> {
             'Gestion des membres',
             'Administration complète des adhérents',
             Icons.people,
-            const Color(0xFF6C5CE7),
+            ColorTokens.primary,
           ),
           _buildFeatureItem(
             'Organisations',
             'Gestion des syndicats et fédérations',
             Icons.business,
-            const Color(0xFF0984E3),
+            ColorTokens.info,
           ),
           _buildFeatureItem(
             'Événements',
             'Planification et suivi des événements',
             Icons.event,
-            const Color(0xFF00B894),
+            ColorTokens.success,
           ),
           _buildFeatureItem(
             'Tableau de bord',
             'Statistiques et métriques en temps réel',
             Icons.dashboard,
-            const Color(0xFFE17055),
+            ColorTokens.warning,
           ),
           _buildFeatureItem(
             'Authentification sécurisée',
             'Connexion via Keycloak OIDC',
             Icons.security,
-            const Color(0xFF00CEC9),
+            ColorTokens.tertiary,
           ),
         ],
       ),
@@ -555,18 +558,18 @@ class _AboutPageState extends State<AboutPage> {
         child: Row(
           children: [
             Container(
-              padding: const EdgeInsets.all(8),
+              padding: const EdgeInsets.all(SpacingTokens.md),
               decoration: BoxDecoration(
-                color: const Color(0xFF6C5CE7).withOpacity(0.1),
-                borderRadius: BorderRadius.circular(8),
+                color: ColorTokens.primary.withOpacity(0.1),
+                borderRadius: BorderRadius.circular(SpacingTokens.md),
               ),
               child: Icon(
                 icon,
-                color: const Color(0xFF6C5CE7),
+                color: ColorTokens.primary,
                 size: 20,
               ),
             ),
-            const SizedBox(width: 12),
+            const SizedBox(width: SpacingTokens.lg),
             Expanded(
               child: Column(
                 crossAxisAlignment: CrossAxisAlignment.start,
@@ -784,8 +787,8 @@ class _AboutPageState extends State<AboutPage> {
               _launchUrl('mailto:support@unionflow.com?subject=Rapport de bug - UnionFlow Mobile');
             },
             style: ElevatedButton.styleFrom(
-              backgroundColor: const Color(0xFF6C5CE7),
-              foregroundColor: Colors.white,
+              backgroundColor: ColorTokens.primary,
+              foregroundColor: ColorTokens.onPrimary,
             ),
             child: const Text('Envoyer un email'),
           ),
@@ -815,8 +818,8 @@ class _AboutPageState extends State<AboutPage> {
               _launchUrl('mailto:support@unionflow.com?subject=Suggestion d\'amélioration - UnionFlow Mobile');
             },
             style: ElevatedButton.styleFrom(
-              backgroundColor: const Color(0xFF6C5CE7),
-              foregroundColor: Colors.white,
+              backgroundColor: ColorTokens.primary,
+              foregroundColor: ColorTokens.onPrimary,
             ),
             child: const Text('Envoyer une suggestion'),
           ),
@@ -847,8 +850,8 @@ class _AboutPageState extends State<AboutPage> {
               _showErrorSnackBar('Fonctionnalité bientôt disponible');
             },
             style: ElevatedButton.styleFrom(
-              backgroundColor: const Color(0xFF6C5CE7),
-              foregroundColor: Colors.white,
+              backgroundColor: ColorTokens.primary,
+              foregroundColor: ColorTokens.onPrimary,
             ),
             child: const Text('Évaluer maintenant'),
           ),