11import 'package:firebase_analytics/firebase_analytics.dart' ;
22import 'package:flutter/material.dart' ;
33import 'package:flutter_riverpod/flutter_riverpod.dart' ;
4+ import 'package:flex_color_scheme/flex_color_scheme.dart' ;
45import 'package:pockaw/core/constants/app_colors.dart' ;
56import 'package:pockaw/core/constants/app_constants.dart' ;
6- import 'package:pockaw/core/constants/app_spacing.dart' ;
77import 'package:pockaw/core/constants/app_text_styles.dart' ;
88import 'package:pockaw/core/router/app_router.dart' ;
99import 'package:pockaw/features/theme_switcher/presentation/riverpod/theme_mode_provider.dart' ;
@@ -23,113 +23,12 @@ class MyApp extends ConsumerWidget {
2323 Widget build (BuildContext context, WidgetRef ref) {
2424 final themeMode = ref.watch (themeModeProvider);
2525
26- final buttonShape = RoundedRectangleBorder (
27- borderRadius: BorderRadius .circular (8.0 ),
28- );
29- const buttonMinimumSize = Size .fromHeight (48 );
30-
31- // Define the light theme using the standard ThemeData
32- final lightTheme = ThemeData (
33- useMaterial3: true ,
34- fontFamily: AppConstants .fontFamilyPrimary,
35- scaffoldBackgroundColor: AppColors .light,
36- colorScheme: const ColorScheme .light (
37- primary: AppColors .primary,
38- primaryContainer: AppColors .primary100,
39- secondary: AppColors .secondary,
40- secondaryContainer: AppColors .secondaryAlpha10,
41- tertiary: AppColors .tertiary,
42- tertiaryContainer: AppColors .tertiary100,
43- error: AppColors .red,
44- ),
45- appBarTheme: const AppBarTheme (
46- backgroundColor: Colors .white,
47- foregroundColor: Colors .black,
48- ),
49- inputDecorationTheme: InputDecorationTheme (
50- border: OutlineInputBorder (borderRadius: BorderRadius .circular (8.0 )),
51- hintStyle: AppTextStyles .body3.copyWith (color: AppColors .neutral300),
52- ),
53- elevatedButtonTheme: ElevatedButtonThemeData (
54- style: ElevatedButton .styleFrom (
55- minimumSize: buttonMinimumSize,
56- shape: buttonShape,
57- ),
58- ),
59- outlinedButtonTheme: OutlinedButtonThemeData (
60- style: OutlinedButton .styleFrom (
61- padding: const EdgeInsets .all (AppSpacing .spacing20),
62- backgroundColor: context.colors.secondaryContainer,
63- side: const BorderSide (color: AppColors .purpleAlpha10),
64- minimumSize: buttonMinimumSize,
65- shape: buttonShape,
66- foregroundColor: AppColors .purple,
67- ),
68- ),
69- textButtonTheme: TextButtonThemeData (
70- style: TextButton .styleFrom (
71- minimumSize: buttonMinimumSize,
72- shape: buttonShape,
73- ),
74- ),
75- textTheme: TextTheme (bodyMedium: AppTextStyles .body2),
76- );
77-
78- // Define the dark theme using the standard ThemeData
79- final darkTheme = ThemeData (
80- useMaterial3: true ,
81- brightness: Brightness .dark,
82- fontFamily: AppConstants .fontFamilyPrimary,
83- scaffoldBackgroundColor: AppColors .dark,
84- colorScheme: const ColorScheme .dark (
85- primary: AppColors .primary400,
86- primaryContainer: AppColors .primary900,
87- secondary: AppColors .secondary400,
88- secondaryContainer: AppColors .secondaryAlpha25,
89- tertiary: AppColors .tertiary400,
90- tertiaryContainer: AppColors .tertiary900,
91- error: AppColors .red400,
92- ),
93- appBarTheme: const AppBarTheme (backgroundColor: AppColors .dark),
94- inputDecorationTheme: InputDecorationTheme (
95- border: OutlineInputBorder (borderRadius: BorderRadius .circular (8.0 )),
96- hintStyle: AppTextStyles .body3.copyWith (color: AppColors .neutral600),
97- ),
98- elevatedButtonTheme: ElevatedButtonThemeData (
99- style: ElevatedButton .styleFrom (
100- minimumSize: buttonMinimumSize,
101- shape: buttonShape,
102- ),
103- ),
104- outlinedButtonTheme: OutlinedButtonThemeData (
105- style: OutlinedButton .styleFrom (
106- padding: const EdgeInsets .all (AppSpacing .spacing20),
107- backgroundColor: AppColors .secondaryAlpha10,
108- side: const BorderSide (color: AppColors .purpleAlpha10),
109- minimumSize: buttonMinimumSize,
110- shape: buttonShape,
111- foregroundColor: AppColors .light,
112- ),
113- ),
114- textButtonTheme: TextButtonThemeData (
115- style: TextButton .styleFrom (
116- minimumSize: buttonMinimumSize,
117- shape: buttonShape,
118- ),
119- ),
120- bottomSheetTheme: BottomSheetThemeData (
121- modalBarrierColor: AppColors .neutral700.withAlpha (150 ),
122- ),
123- textTheme: TextTheme (bodyMedium: AppTextStyles .body2),
124- );
125-
12626 return ToastificationWrapper (
12727 child: MaterialApp .router (
128- key: rootKey,
12928 title: AppConstants .appName,
13029 debugShowCheckedModeBanner: false ,
131- theme: lightTheme ,
132- darkTheme: darkTheme ,
30+ theme: _buildTheme ( Brightness .light) ,
31+ darkTheme: _buildTheme ( Brightness .dark) ,
13332 themeMode: themeMode, // Set the theme mode from the provider
13433 builder: (context, child) => ResponsiveBreakpoints .builder (
13534 child: MediaQuery (
@@ -164,6 +63,65 @@ class MyApp extends ConsumerWidget {
16463 ],
16564 ),
16665 routerConfig: router,
66+ // Add the observer to the router's navigator observers
67+ // Note: GoRouter automatically adds this to its navigator.
68+ // We just need to pass it in the constructor.
69+ ),
70+ );
71+ }
72+
73+ ThemeData _buildTheme (Brightness brightness) {
74+ final colorScheme = brightness == Brightness .light
75+ ? const ColorScheme .light (
76+ primary: AppColors .primary,
77+ primaryContainer: AppColors .primary100,
78+ secondary: AppColors .secondary,
79+ secondaryContainer: AppColors .secondaryAlpha10,
80+ tertiary: AppColors .tertiary,
81+ tertiaryContainer: AppColors .tertiary100,
82+ error: AppColors .red,
83+ surface: AppColors .light,
84+ )
85+ : const ColorScheme .dark (
86+ primary: AppColors .primary400,
87+ primaryContainer: AppColors .primary900,
88+ secondary: AppColors .secondary400,
89+ secondaryContainer: AppColors .secondaryAlpha25,
90+ tertiary: AppColors .tertiary400,
91+ tertiaryContainer: AppColors .tertiary900,
92+ error: AppColors .red400,
93+ surface: AppColors .dark,
94+ );
95+
96+ // Use FlexThemeData.dark for the dark theme.
97+ final baseTheme = brightness == Brightness .light
98+ ? FlexThemeData .light (
99+ colorScheme: colorScheme,
100+ useMaterial3: true ,
101+ fontFamily: AppConstants .fontFamilyPrimary,
102+ )
103+ : FlexThemeData .dark (
104+ colorScheme: colorScheme,
105+ useMaterial3: true ,
106+ fontFamily: AppConstants .fontFamilyPrimary,
107+ );
108+
109+ return baseTheme.copyWith (
110+ // Let FlexColorScheme handle the text theme colors.
111+ // If you need to override font size or weight, do it like this,
112+ // but avoid setting a specific color.
113+ textTheme: baseTheme.textTheme.copyWith (
114+ bodyMedium: AppTextStyles .body2.copyWith (
115+ color: colorScheme.onSurface, // Explicitly use theme color
116+ ),
117+ ),
118+ inputDecorationTheme: InputDecorationTheme (
119+ border: OutlineInputBorder (borderRadius: BorderRadius .circular (8.0 )),
120+ hintStyle: AppTextStyles .body3, // Let the theme handle hint color
121+ ),
122+ bottomSheetTheme: BottomSheetThemeData (
123+ backgroundColor: colorScheme.surface,
124+ modalBarrierColor: colorScheme.shadow.withAlpha (180 ),
167125 ),
168126 );
169127 }
0 commit comments