From 8c515e64baa22ab6d8c24955c125aedc41fffdb2 Mon Sep 17 00:00:00 2001 From: Dayron Date: Thu, 9 Oct 2025 09:38:36 +0200 Subject: [PATCH] feat: Improve UI responsiveness with dynamic text and icon colors based on theme --- lib/components/home/home_content.dart | 26 +++++--- .../home/show_trip_details_content.dart | 66 ++++++++++++++----- 2 files changed, 65 insertions(+), 27 deletions(-) diff --git a/lib/components/home/home_content.dart b/lib/components/home/home_content.dart index 6c79992..566abf2 100644 --- a/lib/components/home/home_content.dart +++ b/lib/components/home/home_content.dart @@ -78,7 +78,7 @@ class _HomeContentState extends State { children: [ // Header de bienvenue Text( - 'Bonjour ${user.prenom ?? 'Voyageur'} !', + 'Bonjour ${user.prenom} !', style: TextStyle(fontSize: 28, fontWeight: FontWeight.bold), ), SizedBox(height: 8), @@ -181,6 +181,12 @@ class _HomeContentState extends State { Widget _buildTravelCard(Trip trip) { final colors = [Colors.blue, Colors.orange, Colors.green, Colors.purple, Colors.red]; final color = colors[trip.title.hashCode.abs() % colors.length]; + + // Détecter le thème actuel + final isDarkMode = Theme.of(context).brightness == Brightness.dark; + final textColor = isDarkMode ? Colors.white : Colors.black; + final secondaryTextColor = isDarkMode ? Colors.white70 : Colors.grey[700]; + final iconColor = isDarkMode ? Colors.white70 : Colors.grey[600]; return Card( elevation: 4, @@ -249,9 +255,9 @@ class _HomeContentState extends State { Expanded( child: Text( trip.location, - style: const TextStyle( + style: TextStyle( fontSize: 14, - color: Colors.white, + color: textColor, ), overflow: TextOverflow.ellipsis, ), @@ -277,7 +283,7 @@ class _HomeContentState extends State { trip.description, style: TextStyle( fontSize: 14, - color: Colors.grey[700], + color: secondaryTextColor, ), maxLines: 2, overflow: TextOverflow.ellipsis, @@ -291,14 +297,14 @@ class _HomeContentState extends State { Icon( Icons.calendar_today, size: 16, - color: Colors.grey[600], + color: iconColor, ), SizedBox(width: 8), Text( '${trip.startDate.day}/${trip.startDate.month}/${trip.startDate.year} - ${trip.endDate.day}/${trip.endDate.month}/${trip.endDate.year}', style: TextStyle( fontSize: 14, - color: Colors.grey[600], + color: iconColor, fontWeight: FontWeight.w500, ), ), @@ -310,13 +316,13 @@ class _HomeContentState extends State { // Participants Row( children: [ - Icon(Icons.group, size: 16, color: Colors.grey[600]), + Icon(Icons.group, size: 16, color: iconColor), SizedBox(width: 8), Text( '${trip.participants.length} participant${trip.participants.length > 1 ? 's' : ''}', style: TextStyle( fontSize: 14, - color: Colors.grey[600], + color: iconColor, fontWeight: FontWeight.w500, ), ), @@ -332,13 +338,13 @@ class _HomeContentState extends State { if (trip.budget! > 0) Row( children: [ - Icon(Icons.euro, size: 16, color: Colors.grey[600]), + Icon(Icons.euro, size: 16, color: iconColor), SizedBox(width: 8), Text( 'Budget: ${trip.budget?.toStringAsFixed(2)}€', style: TextStyle( fontSize: 14, - color: Colors.grey[600], + color: iconColor, fontWeight: FontWeight.w500, ), ), diff --git a/lib/components/home/show_trip_details_content.dart b/lib/components/home/show_trip_details_content.dart index b011f63..0a83e92 100644 --- a/lib/components/home/show_trip_details_content.dart +++ b/lib/components/home/show_trip_details_content.dart @@ -10,13 +10,13 @@ class ShowTripDetailsContent extends StatefulWidget { } class _ShowTripDetailsContentState extends State { - - - - @override Widget build(BuildContext context) { - // You can access the trip via widget.trip + // Détecter le thème actuel + final isDarkMode = Theme.of(context).brightness == Brightness.dark; + final textColor = isDarkMode ? Colors.white : Colors.black; + final secondaryTextColor = isDarkMode ? Colors.white70 : Colors.grey[600]; + return Scaffold( appBar: AppBar( title: Text(widget.trip.title), @@ -28,53 +28,85 @@ class _ShowTripDetailsContentState extends State { children: [ Text( widget.trip.title, - style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold), + style: TextStyle( + fontSize: 24, + fontWeight: FontWeight.bold, + color: textColor, + ), ), SizedBox(height: 8), - Text(widget.trip.description), + Text( + widget.trip.description, + style: TextStyle(color: textColor), + ), SizedBox(height: 16), Row( children: [ - Icon(Icons.location_on, size: 16, color: Colors.grey[600]), + Icon(Icons.location_on, size: 16, color: secondaryTextColor), SizedBox(width: 8), Text( widget.trip.location, - style: TextStyle(fontSize: 14, color: Colors.grey[600]), + style: TextStyle(fontSize: 14, color: secondaryTextColor), ), ], ), SizedBox(height: 8), Row( children: [ - Icon(Icons.calendar_today, size: 16, color: Colors.grey[600]), + Icon(Icons.calendar_today, size: 16, color: secondaryTextColor), SizedBox(width: 8), Text( - '${widget.trip.startDate.toLocal()} - ${widget.trip.endDate.toLocal()}', - style: TextStyle(fontSize: 14, color: Colors.grey[600]), + '${widget.trip.startDate.day}/${widget.trip.startDate.month}/${widget.trip.startDate.year} - ${widget.trip.endDate.day}/${widget.trip.endDate.month}/${widget.trip.endDate.year}', + style: TextStyle(fontSize: 14, color: secondaryTextColor), ), ], ), SizedBox(height: 8), Row( children: [ - Icon(Icons.group, size: 16, color: Colors.grey[600]), + Icon(Icons.group, size: 16, color: secondaryTextColor), SizedBox(width: 8), Text( '${widget.trip.participants.length} participant${widget.trip.participants.length > 1 ? 's' : ''}', style: TextStyle( fontSize: 14, - color: Colors.grey[600], + color: secondaryTextColor, ), ), ], ), SizedBox(height: 16), - Text('Budget: ${widget.trip.budget ?? 'N/A'}€'), + Text( + 'Budget: ${widget.trip.budget ?? 'N/A'}€', + style: TextStyle(color: textColor), + ), SizedBox(height: 16), - // Add more trip details as needed + SizedBox( + width: double.infinity, + height: 50, + child: ElevatedButton( + onPressed: () { + // Handle button press + }, + style: ElevatedButton.styleFrom( + backgroundColor: Color.fromARGB(255, 0, 123, 255), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(12), + ), + ), + child: Text( + 'Modifier les informations du voyage', + style: TextStyle( + color: Colors.white, + fontWeight: FontWeight.bold, + fontSize: 16, + ), + ), + ), + ), ], ), - ) + ), ); } } \ No newline at end of file