working on themes

This commit is contained in:
Rene Kievits
2025-10-31 07:39:32 +01:00
parent 4a6fce37b2
commit ad61292263
4 changed files with 44 additions and 18 deletions

View File

@@ -33,7 +33,25 @@ class WkApp extends StatelessWidget {
return MaterialApp( return MaterialApp(
title: 'Hirameki SRS', title: 'Hirameki SRS',
debugShowCheckedModeBanner: false, 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(), home: const StartScreen(),
); );
} }

View File

@@ -326,11 +326,11 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
content: Text( content: Text(
isCorrect ? 'Correct!' : 'Wrong — correct: $correctDisplay', isCorrect ? 'Correct!' : 'Wrong — correct: $correctDisplay',
style: TextStyle( style: TextStyle(
color: isCorrect ? Colors.greenAccent : Colors.redAccent, color: isCorrect ? Theme.of(context).colorScheme.primary : Theme.of(context).colorScheme.error,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
), ),
backgroundColor: const Color(0xFF222222), backgroundColor: Theme.of(context).colorScheme.surfaceContainerHighest,
duration: const Duration(milliseconds: 900), duration: const Duration(milliseconds: 900),
); );
if (mounted) { if (mounted) {
@@ -341,7 +341,11 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
_isAnswering = true; // Disable input after showing result _isAnswering = true; // Disable input after showing result
}); });
Future.delayed(const Duration(milliseconds: 900), () => _nextQuestion()); Future.delayed(const Duration(milliseconds: 900), () {
if (mounted) {
_nextQuestion();
}
});
} }
@override @override
@@ -353,7 +357,7 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ 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), const SizedBox(height: 16),
ElevatedButton( ElevatedButton(
onPressed: () async { onPressed: () async {
@@ -382,7 +386,7 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
], ],
), ),
), ),
backgroundColor: const Color(0xFF121212), backgroundColor: Theme.of(context).colorScheme.surface,
body: TabBarView( body: TabBarView(
controller: _tabController, controller: _tabController,
children: [ children: [
@@ -426,11 +430,11 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
Expanded( Expanded(
child: Text( child: Text(
_status, _status,
style: const TextStyle(color: Colors.white), style: TextStyle(color: Theme.of(context).colorScheme.onSurface),
), ),
), ),
if (_loading) if (_loading)
const CircularProgressIndicator(color: Colors.blueAccent), CircularProgressIndicator(color: Theme.of(context).colorScheme.primary),
], ],
), ),
const SizedBox(height: 18), const SizedBox(height: 18),
@@ -446,8 +450,8 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
child: KanjiCard( child: KanjiCard(
characters: prompt, characters: prompt,
subtitle: subtitle, subtitle: subtitle,
backgroundColor: const Color(0xFF1E1E1E), backgroundColor: Theme.of(context).colorScheme.surface,
textColor: Colors.white, textColor: Theme.of(context).colorScheme.onSurface,
), ),
), ),
), ),
@@ -468,7 +472,7 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
const SizedBox(height: 8), const SizedBox(height: 8),
Text( Text(
'Score: ${quizState.score} / ${quizState.asked}', 'Score: ${quizState.score} / ${quizState.asked}',
style: const TextStyle(color: Colors.white), style: TextStyle(color: Theme.of(context).colorScheme.onSurface),
), ),
], ],
), ),

View File

@@ -28,8 +28,8 @@ class StartScreen extends StatelessWidget {
decoration: BoxDecoration( decoration: BoxDecoration(
gradient: LinearGradient( gradient: LinearGradient(
colors: [ colors: [
const Color(0xFF121212), Theme.of(context).colorScheme.surface,
Colors.grey[900]!, Theme.of(context).colorScheme.surface,
], ],
begin: Alignment.topLeft, begin: Alignment.topLeft,
end: Alignment.bottomRight, end: Alignment.bottomRight,
@@ -113,14 +113,18 @@ class StartScreen extends StatelessWidget {
const SizedBox(height: 16), const SizedBox(height: 16),
Text( Text(
title, title,
style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold), style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center, textAlign: TextAlign.center,
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
Expanded( Expanded(
child: Text( child: Text(
description, 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, textAlign: TextAlign.center,
softWrap: true, softWrap: true,
), ),

View File

@@ -40,9 +40,9 @@ class OptionsGrid extends StatelessWidget {
if (showResult) { if (showResult) {
if (correctAnswers != null && correctAnswers!.contains(o)) { if (correctAnswers != null && correctAnswers!.contains(o)) {
currentButtonColor = Colors.green; currentButtonColor = theme.colorScheme.tertiary;
} else if (o == selectedOption) { } else if (o == selectedOption) {
currentButtonColor = Colors.red; currentButtonColor = theme.colorScheme.error;
} }
} }
@@ -60,7 +60,7 @@ class OptionsGrid extends StatelessWidget {
), ),
child: Text( child: Text(
o, o,
style: TextStyle(fontSize: 20, color: currentTextColor), style: theme.textTheme.titleMedium?.copyWith(color: currentTextColor),
textAlign: TextAlign.center, textAlign: TextAlign.center,
), ),
), ),