Dark mode

lib/app.dart

@@ -5,6 +5,7 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:fsek_mobile/content_wrapper.dart';
 import 'package:fsek_mobile/services/abstract.service.dart';
 import 'package:fsek_mobile/services/theme.service.dart';
+import 'package:fsek_mobile/themes.dart';
 import 'package:fsek_mobile/util/PushNotificationsManager.dart';
 import 'package:fsek_mobile/util/app_exception.dart';
 import 'package:fsek_mobile/util/storage_wrapper.dart';
@@ -29,6 +30,11 @@ import 'package:flutter_localizations/flutter_localizations.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 
 class FsekMobileApp extends StatefulWidget {
+  final String initialThemeMode;
+
+  // We pull the cached theme from storage in main.dart since that is async
+  FsekMobileApp({required this.initialThemeMode});
+
   @override
   _FsekMobileAppState createState() => _FsekMobileAppState();
   static _FsekMobileAppState? of(BuildContext context) =>
@@ -43,6 +49,7 @@ class _FsekMobileAppState extends State<FsekMobileApp> {
   Locale? _locale;
   String? localeName;
   int backgroundIndex = 1;
+  String? _themeMode = "themeF";
 
   User? _user;
 
@@ -62,6 +69,7 @@ class _FsekMobileAppState extends State<FsekMobileApp> {
 
   @override
   void initState() {
+    _themeMode = widget.initialThemeMode;
     _locale = Locale('sv', '');
     _userService = locator<UserService>();
     //checkApiVersion();
@@ -109,73 +117,88 @@ class _FsekMobileAppState extends State<FsekMobileApp> {
   @override
   Widget build(BuildContext context) {
     SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
-    return BlocProvider<AuthenticationBloc>(
-        create: (context) => _authenticationBloc!,
-        child: MaterialApp(
-          localizationsDelegates: [
-            GlobalMaterialLocalizations.delegate,
-            GlobalWidgetsLocalizations.delegate,
-            AppLocalizations.delegate,
-            GlobalCupertinoLocalizations.delegate,
-          ],
-          supportedLocales: [
-            Locale('en', ''),
-            Locale('sv', ''),
-          ],
-          locale: _locale,
-          navigatorKey: locator<NavigationService>().navigatorKey,
-          theme: locator<ThemeService>().theme,
-          home: Stack(children: [
-            AppBackground(
-                backgroundColors: locator<ThemeService>().backgroundColors),
-            BlocConsumer<AuthenticationBloc, AuthenticationState>(
-              bloc: _authenticationBloc,
-              builder: (BuildContext context, AuthenticationState state) {
-                return AnimatedSwitcher(
-                  duration: Duration(milliseconds: 250),
-                  child: _buildPage(context, state,
-                      locator<NavigationService>().navbarDestinations),
-                );
-              },
-              listener: (context, state) {
-                if (state is AuthenticationDisconnected) {
-                  Navigator.push(
-                      context,
-                      MaterialPageRoute(
-                          builder: (context) => ErrorPage(
-                              authenticationBloc: _authenticationBloc,
-                              text:
-                                  "We could not connect to Fsektionen.se. Please check your connection or try again later.")));
-                }
-                if (state is AuthenticationError) {
-                  Navigator.push(
-                      context,
-                      MaterialPageRoute(
-                          builder: (context) => ErrorPage(
-                              authenticationBloc: _authenticationBloc,
-                              text: state.error)));
-                }
-
-                // Background-animation stuff
-                if (state is! AuthenticationUserFetched &&
-                    state is! AuthenticationAuthenticated) {
-                  setState(() {
-                    backgroundIndex = 0;
-                  });
-                } else {
-                  setState(() {
-                    backgroundIndex = 1;
-                  });
-                }
-              },
-            )
-          ]),
+    return MultiBlocProvider(
+      providers: [
+        BlocProvider<AuthenticationBloc>(
+          create: (context) => _authenticationBloc!,
+        ),
+        BlocProvider<ThemeCubit>(
+          create: (context) => ThemeCubit()..setTheme(locator<ThemeService>().getThemeData(_themeMode)),
+        ),
+      ],
+      child: BlocBuilder<ThemeCubit, ThemeData>(
+        builder: (context, theme) {
+          locator<ThemeService>().changeLogInIcon();
+
+          return MaterialApp(
+            theme: theme,
+            localizationsDelegates: [
+              GlobalMaterialLocalizations.delegate,
+              GlobalWidgetsLocalizations.delegate,
+              AppLocalizations.delegate,
+              GlobalCupertinoLocalizations.delegate,
+            ],
+            supportedLocales: [
+              Locale('en', ''),
+              Locale('sv', ''),
+            ],
+            locale: _locale,
+            navigatorKey: locator<NavigationService>().navigatorKey,
+            home: Stack(children: [
+              AppBackground(
+                  backgroundColors: locator<ThemeService>().backgroundColors),
+              BlocConsumer<AuthenticationBloc, AuthenticationState>(
+                bloc: _authenticationBloc,
+                builder: (BuildContext context, AuthenticationState state) {
+                  return AnimatedSwitcher(
+                    duration: Duration(milliseconds: 250),
+                    child: _buildPage(context, state,
+                        locator<NavigationService>().navbarDestinations),
+                  );
+                },
+                listener: (context, state) {
+                  if (state is AuthenticationDisconnected) {
+                    Navigator.push(
+                        context,
+                        MaterialPageRoute(
+                            builder: (context) => ErrorPage(
+                                authenticationBloc: _authenticationBloc,
+                                text:
+                                    "We could not connect to Fsektionen.se. Please check your connection or try again later.")));
+                  }
+                  if (state is AuthenticationError) {
+                    Navigator.push(
+                        context,
+                        MaterialPageRoute(
+                            builder: (context) => ErrorPage(
+                                authenticationBloc: _authenticationBloc,
+                                text: state.error)));
+                  }
+
+                  // Background-animation stuff
+                  if (state is! AuthenticationUserFetched &&
+                      state is! AuthenticationAuthenticated) {
+                    setState(() {
+                      backgroundIndex = 0;
+                    });
+                  } else {
+                    setState(() {
+                      backgroundIndex = 1;
+                    });
+                  }
+                },
+              )
+            ]),
+
           debugShowCheckedModeBanner: false,
           initialRoute: '/',
           routes: {
             // put named routes in main.dart please (add hot restart app if running)
           }..addAll(locator<NavigationService>().routes),
-        ));
+        );
+        }
+      )
+    );
   }
 
   Widget? _buildPage(BuildContext context, AuthenticationState state,

lib/app_background.dart

@@ -25,13 +25,13 @@ class _AppBackgroundState extends State<AppBackground> {
     return Stack(children: [
       Container(
         height: MediaQuery.of(context).size.height,
-        color: const Color(0xFFF1F1F1),
+        color: Theme.of(context).colorScheme.background,
       ),
       ClipPath(
         clipper: TopWaveClipper(),
         child: Container(
           decoration: BoxDecoration(
-            color: (isAprilFools ? Color(0xFFF17F9F) : Colors.orange[700]),
+            color: Theme.of(context).primaryColor,
           )
           //   gradient: LinearGradient(
           //       colors: widget.backgroundColors, begin: Alignment.centerLeft, end: Alignment.centerRight),

lib/april_fools.dart

@@ -1,26 +1,27 @@
 import 'package:flutter/material.dart';
 
-final ThemeData dsekTheme = ThemeData(
-  brightness: Brightness.light,
-  primaryColor: Color(0xFFF17F9F),
-  colorScheme:
-      ThemeData().colorScheme.copyWith(primary: Color(0xFFF17F9F), secondary: Color.fromARGB(255, 236, 148, 173)),
-  textButtonTheme: TextButtonThemeData(
-      style: ButtonStyle(
-          backgroundColor: MaterialStateProperty.all<Color>(Color(0xFFF17F9F)),
-          foregroundColor: MaterialStateProperty.all<Color>(Colors.white))),
-  bottomAppBarTheme: BottomAppBarTheme(color: Color(0xFFCF6D89)),
-  inputDecorationTheme: InputDecorationTheme(
-    focusedBorder: UnderlineInputBorder(borderSide: BorderSide(color: Color(0xFFF17F9F))),
-    labelStyle: TextStyle(color: Color(0xFFF17F9F)),
-    hintStyle: TextStyle(color: Colors.grey[600]),
-  ),
-);
+// Deprecated: Define in theme.dart instead. Kept since the colors might be useful
+// final ThemeData dsekTheme = ThemeData(
+//   brightness: Brightness.light,
+//   primaryColor: Color(0xFFF17F9F),
+//   colorScheme:
+//       ThemeData().colorScheme.copyWith(primary: Color(0xFFF17F9F), secondary: Color.fromARGB(255, 236, 148, 173)),
+//   textButtonTheme: TextButtonThemeData(
+//       style: ButtonStyle(
+//           backgroundColor: MaterialStateProperty.all<Color>(Color(0xFFF17F9F)),
+//           foregroundColor: MaterialStateProperty.all<Color>(Colors.white))),
+//   bottomAppBarTheme: BottomAppBarTheme(color: Color(0xFFCF6D89)),
+//   inputDecorationTheme: InputDecorationTheme(
+//     focusedBorder: UnderlineInputBorder(borderSide: BorderSide(color: Color(0xFFF17F9F))),
+//     labelStyle: TextStyle(color: Color(0xFFF17F9F)),
+//     hintStyle: TextStyle(color: Colors.grey[600]),
+//   ),
+// );
 
-final List<Color> dsekBackground = [
-  Color(0xFFF17F9F),
-  Color(0xFFCF6D89),
-];
+// final List<Color> dsekBackground = [
+//   Color(0xFFF17F9F),
+//   Color(0xFFCF6D89),
+// ];
 
 final bool isAprilFools = (DateTime(2024, 4, 1, 0, 0).compareTo(DateTime.now()) < 0 &&
     DateTime(2024, 4, 2, 0, 0).compareTo(DateTime.now()) > 0);

lib/content_wrapper.dart

@@ -115,7 +115,8 @@ class _ContentWrapperState extends State<ContentWrapper> with TickerProviderStat
           children: [
             IconButton(
               icon: Image(
-                image: (isAprilFools ? AssetImage("assets/img/d_logo.png") : AssetImage("assets/img/f_logo_black.png")),
+                image: (Theme.of(context).brightness == Brightness.dark ? 
+                  AssetImage("assets/img/f_logo_white.png") : AssetImage("assets/img/f_logo_black.png")),
                 width: 64,
               ),
               onPressed: () => {
@@ -145,7 +146,7 @@ class _ContentWrapperState extends State<ContentWrapper> with TickerProviderStat
               width: 8,
             ),
             Text(
-              isAprilFools ? AppLocalizations.of(context)!.dGuildName : AppLocalizations.of(context)!.fGuildName,
+              AppLocalizations.of(context)!.fGuildName,
               style: Theme.of(context).textTheme.headlineSmall,
             )
           ],
@@ -195,29 +196,25 @@ class _ContentWrapperState extends State<ContentWrapper> with TickerProviderStat
           ])),
           bottomNavigationBar: BottomAppBar(
             shape: CircularNotchedRectangle(),
+            // This should be set to the same color as backgroundColor of FsekAppBar
+            color: Theme.of(context).bottomAppBarTheme.color,
             child: FsekAppBar(
+              selectedColor: Theme.of(context).colorScheme.onPrimaryContainer,
+              color: Theme.of(context).colorScheme.onPrimary,
+              backgroundColor: Theme.of(context).bottomAppBarTheme.color,
               currentIndex: _currentIndex,
               centerItemText: "F-sektionen",
               onTabSelected: (int? index) {
                 setState(() {
                   _currentIndex = index ?? 0;
                 });
-                if (isAprilFools) {
-                  locator<ThemeService>().theme = dsekTheme;
-                  locator<ThemeService>().backgroundColors = dsekBackground;
-                } else {
-                  locator<ThemeService>().theme = fsekTheme;
-                  locator<ThemeService>().backgroundColors = fsekBackground;
-                }
                 widget.onNavigation!.add(widget.navbarDestinations[_currentIndex].widget.runtimeType);
               },
               items: [
                 ...widget.navbarDestinations.map((Destination destination) {
                   return FsekAppBarItem(iconData: destination.icon, text: indexToTitle[destination.index]);
                 }).toList()
               ],
-              selectedColor: Colors.white,
-              color: Colors.black,
             ),
           ),
         ),

lib/l10n/app_en.arb

@@ -82,6 +82,14 @@
     "settingsUnsavedText": "You have unsaved changes.\nDo you want to save or discard these?",
     "settingsDiscard": "Discard",
 
+    "themeSettingsTitle": "Theme",
+    "themeSettingsHelp": "Have you found a strange color in any of the themes? Contact the webmasters via the contact page and describe what looks weird and how you got there.",
+    "themeSettingsTheme1": "F-Orange (Standard)",
+    "themeSettingsTheme2": "n-Green",
+    "themeSettingsTheme3": "O-Brown (Alpha)",
+    "themeSettingsTheme4": "Pink (not a guild color at all) (Alpha)",
+    "themeSettingsTheme5": "V-Blue (Alpha)",
+
     "vegetarian": "Vegetarian",
     "vegan": "Vegan",
     "pescetarian": "Pescetarian",
@@ -106,6 +114,7 @@
     "otherFap": "The F-app",
     "otherAccount": "Account",
     "otherLanguage": "Language",
+    "otherTheme": "Theme",
     "otherContact": "Contact",
     "otherAnon": "Anonymous contact page",
     "otherAbout": "About",

lib/l10n/app_sv.arb

@@ -82,6 +82,14 @@
     "settingsUnsavedText": "Du har osparade ändringar.\nVill du spara eller slänga dessa?",
     "settingsDiscard": "Släng",
 
+    "themeSettingsTitle": "Tema",
+    "themeSettingsHelp": "Har du hittat en färgkombination som är osmaklig eller svår att tyda i någon av temana? Kontakta spindlarna på kontaktsidan och beskriv vad som ser fel ut och hur du kom dit.",
+    "themeSettingsTheme1": "F-Orange (Standard)",
+    "themeSettingsTheme2": "n-Grönt",
+    "themeSettingsTheme3": "O-Brunt (Alfa)",
+    "themeSettingsTheme4": "Rosa (absolut inte någon sektion) (Alfa)",
+    "themeSettingsTheme5": "V-Blått (Alfa)",
+
     "vegetarian": "Vegetarian",
     "vegan": "Vegan",
     "pescetarian": "Pescetarian",
@@ -106,6 +114,7 @@
     "otherFap": "F-appen",
     "otherAccount": "Konto",
     "otherLanguage": "Språk",
+    "otherTheme": "Tema",
     "otherContact": "Kontakt",
     "otherAnon": "Anonym kontaktsida",
     "otherAbout": "Om",