From ad61292263d65870ea8b6a1f68dca3191240cbf1 Mon Sep 17 00:00:00 2001 From: Rene Kievits Date: Fri, 31 Oct 2025 07:39:32 +0100 Subject: [PATCH] working on themes --- lib/main.dart | 20 +++++++++++++++++++- lib/src/screens/home_screen.dart | 24 ++++++++++++++---------- lib/src/screens/start_screen.dart | 12 ++++++++---- lib/src/widgets/options_grid.dart | 6 +++--- 4 files changed, 44 insertions(+), 18 deletions(-) diff --git a/lib/main.dart b/lib/main.dart index 0fe6d68..a4eb04c 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -33,7 +33,25 @@ class WkApp extends StatelessWidget { return MaterialApp( title: 'Hirameki SRS', debugShowCheckedModeBanner: false, - theme: ThemeData.dark(useMaterial3: true), + theme: ThemeData( + colorScheme: const ColorScheme( + brightness: Brightness.dark, + primary: Color(0xFF90CAF9), // Light blue for primary elements + onPrimary: Colors.black, + secondary: Color(0xFFBBDEFB), // Slightly lighter blue for secondary elements + onSecondary: Colors.black, + tertiary: Color(0xFFA5D6A7), // Light green for success/correct states + onTertiary: Colors.black, + error: Color(0xFFEF9A9A), // Light red for error states + onError: Colors.black, + surface: Color(0xFF121212), // Very dark gray + onSurface: Colors.white, + surfaceContainer: Color(0xFF1E1E1E), // Slightly lighter dark gray + surfaceContainerHighest: Color(0xFF424242), // A distinct dark gray for surface variants + onSurfaceVariant: Colors.white70, + ), + useMaterial3: true, + ), home: const StartScreen(), ); } diff --git a/lib/src/screens/home_screen.dart b/lib/src/screens/home_screen.dart index 7f292ad..a5d847e 100644 --- a/lib/src/screens/home_screen.dart +++ b/lib/src/screens/home_screen.dart @@ -326,11 +326,11 @@ class _HomeScreenState extends State with SingleTickerProviderStateM content: Text( isCorrect ? 'Correct!' : 'Wrong — correct: $correctDisplay', style: TextStyle( - color: isCorrect ? Colors.greenAccent : Colors.redAccent, + color: isCorrect ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error, fontWeight: FontWeight.bold, ), ), - backgroundColor: const Color(0xFF222222), + backgroundColor: Theme.of(context).colorScheme.surfaceContainerHighest, duration: const Duration(milliseconds: 900), ); if (mounted) { @@ -341,7 +341,11 @@ class _HomeScreenState extends State with SingleTickerProviderStateM _isAnswering = true; // Disable input after showing result }); - Future.delayed(const Duration(milliseconds: 900), () => _nextQuestion()); + Future.delayed(const Duration(milliseconds: 900), () { + if (mounted) { + _nextQuestion(); + } + }); } @override @@ -353,7 +357,7 @@ class _HomeScreenState extends State with SingleTickerProviderStateM child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ - const Text('WaniKani API key is not set.', style: TextStyle(color: Colors.white)), + Text('WaniKani API key is not set.', style: TextStyle(color: Theme.of(context).colorScheme.onSurface)), const SizedBox(height: 16), ElevatedButton( onPressed: () async { @@ -382,7 +386,7 @@ class _HomeScreenState extends State with SingleTickerProviderStateM ], ), ), - backgroundColor: const Color(0xFF121212), + backgroundColor: Theme.of(context).colorScheme.surface, body: TabBarView( controller: _tabController, children: [ @@ -426,11 +430,11 @@ class _HomeScreenState extends State with SingleTickerProviderStateM Expanded( child: Text( _status, - style: const TextStyle(color: Colors.white), + style: TextStyle(color: Theme.of(context).colorScheme.onSurface), ), ), if (_loading) - const CircularProgressIndicator(color: Colors.blueAccent), + CircularProgressIndicator(color: Theme.of(context).colorScheme.primary), ], ), const SizedBox(height: 18), @@ -446,8 +450,8 @@ class _HomeScreenState extends State with SingleTickerProviderStateM child: KanjiCard( characters: prompt, subtitle: subtitle, - backgroundColor: const Color(0xFF1E1E1E), - textColor: Colors.white, + backgroundColor: Theme.of(context).colorScheme.surface, + textColor: Theme.of(context).colorScheme.onSurface, ), ), ), @@ -468,7 +472,7 @@ class _HomeScreenState extends State with SingleTickerProviderStateM const SizedBox(height: 8), Text( 'Score: ${quizState.score} / ${quizState.asked}', - style: const TextStyle(color: Colors.white), + style: TextStyle(color: Theme.of(context).colorScheme.onSurface), ), ], ), diff --git a/lib/src/screens/start_screen.dart b/lib/src/screens/start_screen.dart index 61876c5..adb2ad9 100644 --- a/lib/src/screens/start_screen.dart +++ b/lib/src/screens/start_screen.dart @@ -28,8 +28,8 @@ class StartScreen extends StatelessWidget { decoration: BoxDecoration( gradient: LinearGradient( colors: [ - const Color(0xFF121212), - Colors.grey[900]!, + Theme.of(context).colorScheme.surface, + Theme.of(context).colorScheme.surface, ], begin: Alignment.topLeft, end: Alignment.bottomRight, @@ -113,14 +113,18 @@ class StartScreen extends StatelessWidget { const SizedBox(height: 16), Text( title, - style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold), + style: Theme.of(context).textTheme.titleMedium?.copyWith( + fontWeight: FontWeight.bold, + ), textAlign: TextAlign.center, ), const SizedBox(height: 8), Expanded( child: Text( description, - style: const TextStyle(fontSize: 12, color: Colors.grey), + style: Theme.of(context).textTheme.bodySmall?.copyWith( + color: Theme.of(context).colorScheme.onSurfaceVariant, + ), textAlign: TextAlign.center, softWrap: true, ), diff --git a/lib/src/widgets/options_grid.dart b/lib/src/widgets/options_grid.dart index d1043cd..ee61642 100644 --- a/lib/src/widgets/options_grid.dart +++ b/lib/src/widgets/options_grid.dart @@ -40,9 +40,9 @@ class OptionsGrid extends StatelessWidget { if (showResult) { if (correctAnswers != null && correctAnswers!.contains(o)) { - currentButtonColor = Colors.green; + currentButtonColor = theme.colorScheme.tertiary; } else if (o == selectedOption) { - currentButtonColor = Colors.red; + currentButtonColor = theme.colorScheme.error; } } @@ -60,7 +60,7 @@ class OptionsGrid extends StatelessWidget { ), child: Text( o, - style: TextStyle(fontSize: 20, color: currentTextColor), + style: theme.textTheme.titleMedium?.copyWith(color: currentTextColor), textAlign: TextAlign.center, ), ),