feat: Make the main color editable for users

lib/config/app_config.dart

@@ -1,5 +1,7 @@
 import 'dart:ui';
 
+import 'package:matrix/matrix.dart';
+
 abstract class AppConfig {
   static String _applicationName = 'FluffyChat';
   static String get applicationName => _applicationName;
@@ -9,6 +11,7 @@ abstract class AppConfig {
   static String get defaultHomeserver => _defaultHomeserver;
   static String jitsiInstance = 'https://meet.jit.si/';
   static double fontSizeFactor = 1;
+  static Color chatColor = primaryColor;
   static const double messageFontSize = 15.75;
   static const bool allowOtherHomeservers = true;
   static const bool enableRegistration = true;
@@ -54,6 +57,15 @@ abstract class AppConfig {
   static const double columnWidth = 360.0;
 
   static void loadFromJson(Map<String, dynamic> json) {
+    if (json['chat_color'] != null) {
+      try {
+        chatColor = Color(json['application_name']);
+      } catch (e) {
+        Logs().w(
+            'Invalid color in config.json! Please make sure to define the color in this format: "0xffdd0000"',
+            e);
+      }
+    }
     if (json['application_name'] is String) {
       _applicationName = json['application_name'];
     }

lib/config/setting_keys.dart

@@ -4,6 +4,7 @@ abstract class SettingKeys {
   static const String renderHtml = 'chat.fluffy.renderHtml';
   static const String hideRedactedEvents = 'chat.fluffy.hideRedactedEvents';
   static const String hideUnknownEvents = 'chat.fluffy.hideUnknownEvents';
+  static const String chatColor = 'chat.fluffy.chat_color';
   static const String sentry = 'sentry';
   static const String theme = 'theme';
   static const String amoledEnabled = 'amoled_enabled';

lib/config/themes.dart

@@ -31,177 +31,179 @@ abstract class FluffyThemes {
           subtitle2: fallbackTextStyle)
       : const TextTheme();
 
-  static ThemeData light = ThemeData(
-    visualDensity: VisualDensity.standard,
-    primaryColorDark: Colors.white,
-    primaryColorLight: const Color(0xff121212),
-    brightness: Brightness.light,
-    primaryColor: AppConfig.primaryColor,
-    colorScheme: ThemeData.light().colorScheme.copyWith(
-          primary: AppConfig.primaryColor,
-          secondary: AppConfig.primaryColor,
-          secondaryVariant: AppConfig.secondaryColor,
+  static ThemeData get light => ThemeData(
+        visualDensity: VisualDensity.standard,
+        primaryColorDark: Colors.white,
+        primaryColorLight: const Color(0xff121212),
+        brightness: Brightness.light,
+        primaryColor: AppConfig.chatColor,
+        colorScheme: ThemeData.light().colorScheme.copyWith(
+              primary: AppConfig.chatColor,
+              secondary: AppConfig.chatColor,
+              secondaryVariant: AppConfig.secondaryColor,
+            ),
+        backgroundColor: Colors.white,
+        secondaryHeaderColor: Colors.blueGrey.shade50,
+        scaffoldBackgroundColor: Colors.white,
+        textTheme: Typography.material2018().black.merge(fallbackTextTheme),
+        snackBarTheme:
+            const SnackBarThemeData(behavior: SnackBarBehavior.floating),
+        pageTransitionsTheme: const PageTransitionsTheme(
+          builders: {
+            TargetPlatform.fuchsia: ZoomPageTransitionsBuilder(),
+            TargetPlatform.android: ZoomPageTransitionsBuilder(),
+            TargetPlatform.linux: CupertinoPageTransitionsBuilder(),
+            TargetPlatform.macOS: CupertinoPageTransitionsBuilder(),
+            TargetPlatform.windows: CupertinoPageTransitionsBuilder(),
+            TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
+          },
         ),
-    backgroundColor: Colors.white,
-    secondaryHeaderColor: const Color(0xffeeeffe),
-    scaffoldBackgroundColor: Colors.white,
-    textTheme: Typography.material2018().black.merge(fallbackTextTheme),
-    snackBarTheme: const SnackBarThemeData(behavior: SnackBarBehavior.floating),
-    pageTransitionsTheme: const PageTransitionsTheme(
-      builders: {
-        TargetPlatform.fuchsia: ZoomPageTransitionsBuilder(),
-        TargetPlatform.android: ZoomPageTransitionsBuilder(),
-        TargetPlatform.linux: CupertinoPageTransitionsBuilder(),
-        TargetPlatform.macOS: CupertinoPageTransitionsBuilder(),
-        TargetPlatform.windows: CupertinoPageTransitionsBuilder(),
-        TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
-      },
-    ),
-    dialogTheme: DialogTheme(
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-      ),
-    ),
-    popupMenuTheme: PopupMenuThemeData(
-      elevation: 4,
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-      ),
-    ),
-    floatingActionButtonTheme: const FloatingActionButtonThemeData(
-      backgroundColor: AppConfig.primaryColor,
-      foregroundColor: Colors.white,
-    ),
-    elevatedButtonTheme: ElevatedButtonThemeData(
-      style: ElevatedButton.styleFrom(
-        primary: AppConfig.primaryColor,
-        onPrimary: Colors.white,
-        elevation: 6,
-        shadowColor: const Color(0x44000000),
-        minimumSize: const Size.fromHeight(48),
-        shape: RoundedRectangleBorder(
-          borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+        dialogTheme: DialogTheme(
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          ),
         ),
-        padding: const EdgeInsets.all(12),
-      ),
-    ),
-    cardTheme: CardTheme(
-      elevation: 6,
-      shadowColor: const Color(0x44000000),
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-      ),
-      clipBehavior: Clip.hardEdge,
-    ),
-    inputDecorationTheme: InputDecorationTheme(
-      border: OutlineInputBorder(
-          borderRadius: BorderRadius.circular(AppConfig.borderRadius)),
-      enabledBorder: OutlineInputBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-        borderSide: BorderSide(
-          color: lighten(AppConfig.primaryColor, .51),
+        popupMenuTheme: PopupMenuThemeData(
+          elevation: 4,
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          ),
         ),
-      ),
-      filled: true,
-      fillColor: lighten(AppConfig.primaryColor, .51),
-    ),
-    appBarTheme: const AppBarTheme(
-      elevation: 6,
-      shadowColor: Color(0x44000000),
-      systemOverlayStyle: SystemUiOverlayStyle.dark,
-      backgroundColor: Colors.white,
-      titleTextStyle: TextStyle(
-        color: Colors.black,
-        fontSize: 20,
-      ),
-      iconTheme: IconThemeData(color: Colors.black),
-    ),
-  );
+        floatingActionButtonTheme: FloatingActionButtonThemeData(
+          backgroundColor: AppConfig.chatColor,
+          foregroundColor: Colors.white,
+        ),
+        elevatedButtonTheme: ElevatedButtonThemeData(
+          style: ElevatedButton.styleFrom(
+            primary: AppConfig.chatColor,
+            onPrimary: Colors.white,
+            elevation: 6,
+            shadowColor: const Color(0x44000000),
+            minimumSize: const Size.fromHeight(48),
+            shape: RoundedRectangleBorder(
+              borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+            ),
+            padding: const EdgeInsets.all(12),
+          ),
+        ),
+        cardTheme: CardTheme(
+          elevation: 6,
+          shadowColor: const Color(0x44000000),
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          ),
+          clipBehavior: Clip.hardEdge,
+        ),
+        inputDecorationTheme: InputDecorationTheme(
+          border: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(AppConfig.borderRadius)),
+          enabledBorder: OutlineInputBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+            borderSide: BorderSide(
+              color: lighten(AppConfig.chatColor, .51),
+            ),
+          ),
+          filled: true,
+          fillColor: lighten(AppConfig.chatColor, .51),
+        ),
+        appBarTheme: const AppBarTheme(
+          elevation: 6,
+          shadowColor: Color(0x44000000),
+          systemOverlayStyle: SystemUiOverlayStyle.dark,
+          backgroundColor: Colors.white,
+          titleTextStyle: TextStyle(
+            color: Colors.black,
+            fontSize: 20,
+          ),
+          iconTheme: IconThemeData(color: Colors.black),
+        ),
+      );
 
-  static ThemeData dark = ThemeData.dark().copyWith(
-    visualDensity: VisualDensity.standard,
-    primaryColorDark: const Color(0xff121212),
-    primaryColorLight: Colors.white,
-    primaryColor: AppConfig.primaryColor,
-    errorColor: const Color(0xFFCF6679),
-    backgroundColor: Colors.black,
-    scaffoldBackgroundColor: Colors.black,
-    colorScheme: ThemeData.dark().colorScheme.copyWith(
-          primary: AppConfig.primaryColorLight,
-          secondary: AppConfig.primaryColorLight,
-          secondaryVariant: AppConfig.secondaryColor,
+  static ThemeData get dark => ThemeData.dark().copyWith(
+        visualDensity: VisualDensity.standard,
+        primaryColorDark: const Color(0xff121212),
+        primaryColorLight: Colors.white,
+        primaryColor: AppConfig.chatColor,
+        errorColor: const Color(0xFFCF6679),
+        backgroundColor: Colors.black,
+        scaffoldBackgroundColor: Colors.black,
+        colorScheme: ThemeData.dark().colorScheme.copyWith(
+              primary: AppConfig.primaryColorLight,
+              secondary: AppConfig.primaryColorLight,
+              secondaryVariant: AppConfig.secondaryColor,
+            ),
+        secondaryHeaderColor: Colors.blueGrey.shade900,
+        textTheme: Typography.material2018().white.merge(fallbackTextTheme),
+        dialogTheme: DialogTheme(
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          ),
         ),
-    secondaryHeaderColor: const Color(0xff232543),
-    textTheme: Typography.material2018().white.merge(fallbackTextTheme),
-    dialogTheme: DialogTheme(
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-      ),
-    ),
-    popupMenuTheme: PopupMenuThemeData(
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-      ),
-    ),
-    cardTheme: CardTheme(
-      elevation: 7,
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-      ),
-      clipBehavior: Clip.hardEdge,
-    ),
-    pageTransitionsTheme: const PageTransitionsTheme(
-      builders: {
-        TargetPlatform.fuchsia: ZoomPageTransitionsBuilder(),
-        TargetPlatform.android: ZoomPageTransitionsBuilder(),
-        TargetPlatform.linux: CupertinoPageTransitionsBuilder(),
-        TargetPlatform.macOS: CupertinoPageTransitionsBuilder(),
-        TargetPlatform.windows: CupertinoPageTransitionsBuilder(),
-        TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
-      },
-    ),
-    floatingActionButtonTheme: const FloatingActionButtonThemeData(
-      backgroundColor: AppConfig.primaryColor,
-      foregroundColor: Colors.white,
-    ),
-    inputDecorationTheme: InputDecorationTheme(
-      border: OutlineInputBorder(
-          borderRadius: BorderRadius.circular(AppConfig.borderRadius)),
-      filled: true,
-      fillColor: FluffyThemes.darken(AppConfig.primaryColorLight, .71),
-      enabledBorder: OutlineInputBorder(
-        borderRadius: BorderRadius.circular(AppConfig.borderRadius),
-        borderSide: BorderSide(
-          color: FluffyThemes.darken(AppConfig.primaryColor, .31),
+        popupMenuTheme: PopupMenuThemeData(
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          ),
         ),
-      ),
-    ),
-    elevatedButtonTheme: ElevatedButtonThemeData(
-      style: ElevatedButton.styleFrom(
-        primary: AppConfig.primaryColor,
-        onPrimary: Colors.white,
-        minimumSize: const Size.fromHeight(48),
-        shape: RoundedRectangleBorder(
-          borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+        cardTheme: CardTheme(
+          elevation: 7,
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          ),
+          clipBehavior: Clip.hardEdge,
         ),
-        padding: const EdgeInsets.all(12),
-      ),
-    ),
-    snackBarTheme: const SnackBarThemeData(behavior: SnackBarBehavior.floating),
-    appBarTheme: const AppBarTheme(
-      elevation: 6,
-      systemOverlayStyle: SystemUiOverlayStyle.light,
-      backgroundColor: Color(0xff1D1D1D),
-      titleTextStyle: TextStyle(
-        color: Colors.white,
-        fontSize: 20,
-      ),
-      iconTheme: IconThemeData(color: Colors.white),
-    ),
-    cupertinoOverrideTheme: const CupertinoThemeData(
-      textTheme: CupertinoTextThemeData(),
-    ),
-  );
+        pageTransitionsTheme: const PageTransitionsTheme(
+          builders: {
+            TargetPlatform.fuchsia: ZoomPageTransitionsBuilder(),
+            TargetPlatform.android: ZoomPageTransitionsBuilder(),
+            TargetPlatform.linux: CupertinoPageTransitionsBuilder(),
+            TargetPlatform.macOS: CupertinoPageTransitionsBuilder(),
+            TargetPlatform.windows: CupertinoPageTransitionsBuilder(),
+            TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
+          },
+        ),
+        floatingActionButtonTheme: FloatingActionButtonThemeData(
+          backgroundColor: AppConfig.chatColor,
+          foregroundColor: Colors.white,
+        ),
+        inputDecorationTheme: InputDecorationTheme(
+          border: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(AppConfig.borderRadius)),
+          filled: true,
+          fillColor: FluffyThemes.darken(AppConfig.primaryColorLight, .71),
+          enabledBorder: OutlineInputBorder(
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+            borderSide: BorderSide(
+              color: FluffyThemes.darken(AppConfig.chatColor, .31),
+            ),
+          ),
+        ),
+        elevatedButtonTheme: ElevatedButtonThemeData(
+          style: ElevatedButton.styleFrom(
+            primary: AppConfig.chatColor,
+            onPrimary: Colors.white,
+            minimumSize: const Size.fromHeight(48),
+            shape: RoundedRectangleBorder(
+              borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+            ),
+            padding: const EdgeInsets.all(12),
+          ),
+        ),
+        snackBarTheme:
+            const SnackBarThemeData(behavior: SnackBarBehavior.floating),
+        appBarTheme: const AppBarTheme(
+          elevation: 6,
+          systemOverlayStyle: SystemUiOverlayStyle.light,
+          backgroundColor: Color(0xff1D1D1D),
+          titleTextStyle: TextStyle(
+            color: Colors.white,
+            fontSize: 20,
+          ),
+          iconTheme: IconThemeData(color: Colors.white),
+        ),
+        cupertinoOverrideTheme: const CupertinoThemeData(
+          textTheme: CupertinoTextThemeData(),
+        ),
+      );
 
   static Color blackWhiteColor(BuildContext context) =>
       Theme.of(context).brightness == Brightness.light