Xeewy/TravelMate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Improve UI responsiveness with dynamic text and icon colors based on theme

Browse Source
This commit is contained in:
Dayron
2025-10-09 09:38:36 +02:00
parent 56211e0b58
commit 8c515e64ba
2 changed files with 65 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
lib/components/home/home_content.dart
View File

@@ -78,7 +78,7 @@ class _HomeContentState extends State<HomeContent> {
children: [ children: [
// Header de bienvenue // Header de bienvenue
Text( Text(
'Bonjour ${user.prenom ?? 'Voyageur'} !', 'Bonjour ${user.prenom} !',
style: TextStyle(fontSize: 28, fontWeight: FontWeight.bold), style: TextStyle(fontSize: 28, fontWeight: FontWeight.bold),
), ),
SizedBox(height: 8), SizedBox(height: 8),
@@ -181,6 +181,12 @@ class _HomeContentState extends State<HomeContent> {
Widget _buildTravelCard(Trip trip) { Widget _buildTravelCard(Trip trip) {
final colors = [Colors.blue, Colors.orange, Colors.green, Colors.purple, Colors.red]; final colors = [Colors.blue, Colors.orange, Colors.green, Colors.purple, Colors.red];
final color = colors[trip.title.hashCode.abs() % colors.length]; 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( return Card(
elevation: 4, elevation: 4,
@@ -249,9 +255,9 @@ class _HomeContentState extends State<HomeContent> {
Expanded( Expanded(
child: Text( child: Text(
trip.location, trip.location,
style: const TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
color: Colors.white, color: textColor,
), ),
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), ),
@@ -277,7 +283,7 @@ class _HomeContentState extends State<HomeContent> {
trip.description, trip.description,
style: TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
color: Colors.grey[700], color: secondaryTextColor,
), ),
maxLines: 2, maxLines: 2,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
@@ -291,14 +297,14 @@ class _HomeContentState extends State<HomeContent> {
Icon( Icon(
Icons.calendar_today, Icons.calendar_today,
size: 16, size: 16,
color: Colors.grey[600], color: iconColor,
), ),
SizedBox(width: 8), SizedBox(width: 8),
Text( Text(
'${trip.startDate.day}/${trip.startDate.month}/${trip.startDate.year} - ${trip.endDate.day}/${trip.endDate.month}/${trip.endDate.year}', '${trip.startDate.day}/${trip.startDate.month}/${trip.startDate.year} - ${trip.endDate.day}/${trip.endDate.month}/${trip.endDate.year}',
style: TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
color: Colors.grey[600], color: iconColor,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),
@@ -310,13 +316,13 @@ class _HomeContentState extends State<HomeContent> {
// Participants // Participants
Row( Row(
children: [ children: [
Icon(Icons.group, size: 16, color: Colors.grey[600]), Icon(Icons.group, size: 16, color: iconColor),
SizedBox(width: 8), SizedBox(width: 8),
Text( Text(
'${trip.participants.length} participant${trip.participants.length > 1 ? 's' : ''}', '${trip.participants.length} participant${trip.participants.length > 1 ? 's' : ''}',
style: TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
color: Colors.grey[600], color: iconColor,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),
@@ -332,13 +338,13 @@ class _HomeContentState extends State<HomeContent> {
if (trip.budget! > 0) if (trip.budget! > 0)
Row( Row(
children: [ children: [
Icon(Icons.euro, size: 16, color: Colors.grey[600]), Icon(Icons.euro, size: 16, color: iconColor),
SizedBox(width: 8), SizedBox(width: 8),
Text( Text(
'Budget: ${trip.budget?.toStringAsFixed(2)}€', 'Budget: ${trip.budget?.toStringAsFixed(2)}€',
style: TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
color: Colors.grey[600], color: iconColor,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),

66
lib/components/home/show_trip_details_content.dart
View File

@@ -10,13 +10,13 @@ class ShowTripDetailsContent extends StatefulWidget {
} }
class _ShowTripDetailsContentState extends State<ShowTripDetailsContent> { class _ShowTripDetailsContentState extends State<ShowTripDetailsContent> {
@override @override
Widget build(BuildContext context) { 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( return Scaffold(
appBar: AppBar( appBar: AppBar(
title: Text(widget.trip.title), title: Text(widget.trip.title),
@@ -28,53 +28,85 @@ class _ShowTripDetailsContentState extends State<ShowTripDetailsContent> {
children: [ children: [
Text( Text(
widget.trip.title, widget.trip.title,
style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold), style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
color: textColor,
),
), ),
SizedBox(height: 8), SizedBox(height: 8),
Text(widget.trip.description), Text(
widget.trip.description,
style: TextStyle(color: textColor),
),
SizedBox(height: 16), SizedBox(height: 16),
Row( Row(
children: [ children: [
Icon(Icons.location_on, size: 16, color: Colors.grey[600]), Icon(Icons.location_on, size: 16, color: secondaryTextColor),
SizedBox(width: 8), SizedBox(width: 8),
Text( Text(
widget.trip.location, widget.trip.location,
style: TextStyle(fontSize: 14, color: Colors.grey[600]), style: TextStyle(fontSize: 14, color: secondaryTextColor),
), ),
], ],
), ),
SizedBox(height: 8), SizedBox(height: 8),
Row( Row(
children: [ children: [
Icon(Icons.calendar_today, size: 16, color: Colors.grey[600]), Icon(Icons.calendar_today, size: 16, color: secondaryTextColor),
SizedBox(width: 8), SizedBox(width: 8),
Text( Text(
'${widget.trip.startDate.toLocal()} - ${widget.trip.endDate.toLocal()}', '${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: Colors.grey[600]), style: TextStyle(fontSize: 14, color: secondaryTextColor),
), ),
], ],
), ),
SizedBox(height: 8), SizedBox(height: 8),
Row( Row(
children: [ children: [
Icon(Icons.group, size: 16, color: Colors.grey[600]), Icon(Icons.group, size: 16, color: secondaryTextColor),
SizedBox(width: 8), SizedBox(width: 8),
Text( Text(
'${widget.trip.participants.length} participant${widget.trip.participants.length > 1 ? 's' : ''}', '${widget.trip.participants.length} participant${widget.trip.participants.length > 1 ? 's' : ''}',
style: TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
color: Colors.grey[600], color: secondaryTextColor,
), ),
), ),
], ],
), ),
SizedBox(height: 16), SizedBox(height: 16),
Text('Budget: ${widget.trip.budget ?? 'N/A'}€'), Text(
'Budget: ${widget.trip.budget ?? 'N/A'}€',
style: TextStyle(color: textColor),
),
SizedBox(height: 16), 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,
),
),
),
),
], ],
), ),
) ),
); );
} }
} }