From d448087122845f6d490f68e136b28e3cdf9ace40 Mon Sep 17 00:00:00 2001 From: Fabian Freund Date: Thu, 1 Jan 2026 09:07:53 +0100 Subject: [PATCH] properly organize custom colors --- app/lib/core/design/app_colors.dart | 21 +++++++++++++++++++ app/lib/core/providers/defaults.dart | 5 +++-- app/lib/core/providers/defaults.g.dart | 4 ++-- .../presentation/dialogs/tab_tree.dart | 3 ++- .../browser_modules/app_bar_title.dart | 3 ++- .../browser_modules/bottom_app_bar.dart | 5 +++-- .../widgets/tab_view/tab_preview.dart | 9 ++++---- .../search/presentation/screens/search.dart | 7 +++---- .../widgets/material_color_picker.dart | 4 ++-- .../features/tabs/utils/color_palette.dart | 2 +- .../screens/general_settings.dart | 5 +++-- .../tor/presentation/screens/tor_proxy.dart | 21 ++++++++++--------- .../tor/presentation/widgets/tor_dialog.dart | 3 ++- .../widgets/tor_notification.dart | 5 +++-- 14 files changed, 63 insertions(+), 34 deletions(-) create mode 100644 app/lib/core/design/app_colors.dart diff --git a/app/lib/core/design/app_colors.dart b/app/lib/core/design/app_colors.dart new file mode 100644 index 00000000..6bf8d2b0 --- /dev/null +++ b/app/lib/core/design/app_colors.dart @@ -0,0 +1,21 @@ +import 'package:flutter/material.dart'; + +class AppColors { + AppColors._(); + + static const Color seedColor = Color(0xFF167C80); + + static const Color privateTabPurple = Color(0xFF8000D7); + + static const Color privateTabBackground = Color(0xFF25003E); + + static const Color privateSelectionOverlay = Color(0x648000D7); + + static const Color torPurple = Color(0xFF7D4698); + + static const Color torActiveGreen = Color(0xFF68B030); + + static const Color torBackgroundGrey = Color(0xFF333A41); + + static const Color dialogOverlay = Color(0x44000000); +} diff --git a/app/lib/core/providers/defaults.dart b/app/lib/core/providers/defaults.dart index 92b38ba2..6020fac8 100644 --- a/app/lib/core/providers/defaults.dart +++ b/app/lib/core/providers/defaults.dart @@ -19,14 +19,15 @@ */ import 'package:flutter/material.dart'; import 'package:riverpod_annotation/riverpod_annotation.dart'; +import 'package:weblibre/core/design/app_colors.dart'; part 'defaults.g.dart'; @Riverpod(keepAlive: true) -Color lightSeedColorFallback(Ref ref) => const Color(0xFF167C80); +Color lightSeedColorFallback(Ref ref) => AppColors.seedColor; @Riverpod(keepAlive: true) -Color darkSeedColorFallback(Ref ref) => const Color(0xFF167C80); +Color darkSeedColorFallback(Ref ref) => AppColors.seedColor; @Riverpod(keepAlive: true) Uri docsUri(Ref ref) => Uri.parse('https://docs.weblibre.eu/'); diff --git a/app/lib/core/providers/defaults.g.dart b/app/lib/core/providers/defaults.g.dart index 649e76d2..9e11ee96 100644 --- a/app/lib/core/providers/defaults.g.dart +++ b/app/lib/core/providers/defaults.g.dart @@ -49,7 +49,7 @@ final class LightSeedColorFallbackProvider } String _$lightSeedColorFallbackHash() => - r'af151d3293d372f5df451aa8c3a75136377b6ce1'; + r'd5fb3ead5795c1cadd6c3a5f91ef84c3cbdaa3c1'; @ProviderFor(darkSeedColorFallback) const darkSeedColorFallbackProvider = DarkSeedColorFallbackProvider._(); @@ -91,7 +91,7 @@ final class DarkSeedColorFallbackProvider } String _$darkSeedColorFallbackHash() => - r'9418cf71e3d80c8a2142e0d3a8820989b29bff86'; + r'a383dbf6edf4fee54a8215bc52a98f26354e4645'; @ProviderFor(docsUri) const docsUriProvider = DocsUriProvider._(); diff --git a/app/lib/features/geckoview/features/browser/presentation/dialogs/tab_tree.dart b/app/lib/features/geckoview/features/browser/presentation/dialogs/tab_tree.dart index a2af91e5..78ed5cd4 100644 --- a/app/lib/features/geckoview/features/browser/presentation/dialogs/tab_tree.dart +++ b/app/lib/features/geckoview/features/browser/presentation/dialogs/tab_tree.dart @@ -27,6 +27,7 @@ import 'package:graphview/GraphView.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:nullability/nullability.dart'; import 'package:skeletonizer/skeletonizer.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/core/routing/routes.dart'; import 'package:weblibre/features/geckoview/domain/controllers/bottom_sheet.dart'; import 'package:weblibre/features/geckoview/domain/providers/selected_tab.dart'; @@ -82,7 +83,7 @@ class TabTreeDialog extends HookConsumerWidget { return Dialog.fullscreen( child: Scaffold( appBar: AppBar( - backgroundColor: const Color(0x44000000), + backgroundColor: AppColors.dialogOverlay, elevation: 0, leading: const CloseButton(), ), diff --git a/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/app_bar_title.dart b/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/app_bar_title.dart index c7705512..c2388c7a 100644 --- a/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/app_bar_title.dart +++ b/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/app_bar_title.dart @@ -23,6 +23,7 @@ import 'package:flutter_material_design_icons/flutter_material_design_icons.dart import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:skeletonizer/skeletonizer.dart'; import 'package:text_scroll/text_scroll.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/features/geckoview/domain/providers/tab_state.dart'; import 'package:weblibre/features/geckoview/features/browser/presentation/widgets/tab_icon.dart'; import 'package:weblibre/presentation/widgets/uri_breadcrumb.dart'; @@ -109,7 +110,7 @@ class AppBarTitle extends HookConsumerWidget { if (tabState.isPrivate) ...[ const Icon( MdiIcons.dominoMask, - color: Color(0xFF8000D7), + color: AppColors.privateTabPurple, size: 14, ), const SizedBox(width: 4), diff --git a/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/bottom_app_bar.dart b/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/bottom_app_bar.dart index eee5e4e5..f3a0e9e8 100644 --- a/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/bottom_app_bar.dart +++ b/app/lib/features/geckoview/features/browser/presentation/widgets/browser_modules/bottom_app_bar.dart @@ -25,6 +25,7 @@ import 'package:flutter_material_design_icons/flutter_material_design_icons.dart import 'package:flutter_mozilla_components/flutter_mozilla_components.dart'; import 'package:go_router/go_router.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/core/routing/routes.dart'; import 'package:weblibre/features/geckoview/domain/controllers/bottom_sheet.dart'; import 'package:weblibre/features/geckoview/domain/entities/states/readerable.dart'; @@ -475,7 +476,7 @@ class QuickTabSwitcher extends HookConsumerWidget { padding: EdgeInsets.only(left: 8.0), child: Icon( MdiIcons.dominoMask, - color: Color(0xFF8000D7), + color: AppColors.privateTabPurple, size: 20, ), ), @@ -777,7 +778,7 @@ class NavigationMenuButton extends HookConsumerWidget { return Badge( isLabelVisible: torConnected, - backgroundColor: const Color(0xFF68B030), + backgroundColor: AppColors.torActiveGreen, child: child, ); }, diff --git a/app/lib/features/geckoview/features/browser/presentation/widgets/tab_view/tab_preview.dart b/app/lib/features/geckoview/features/browser/presentation/widgets/tab_view/tab_preview.dart index 61de1ad1..c259852c 100644 --- a/app/lib/features/geckoview/features/browser/presentation/widgets/tab_view/tab_preview.dart +++ b/app/lib/features/geckoview/features/browser/presentation/widgets/tab_view/tab_preview.dart @@ -24,6 +24,7 @@ import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_material_design_icons/flutter_material_design_icons.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:nullability/nullability.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/features/geckoview/domain/entities/states/tab.dart'; import 'package:weblibre/features/geckoview/domain/providers/tab_state.dart'; import 'package:weblibre/features/geckoview/domain/repositories/tab.dart'; @@ -61,7 +62,7 @@ class GridTabItemContainer extends StatelessWidget { ), child: Material( color: isPrivate - ? const Color(0xFF25003E) + ? AppColors.privateTabBackground : colorScheme.surfaceContainerHighest, borderRadius: const BorderRadius.all(Radius.circular(14.0)), child: child, @@ -193,7 +194,7 @@ class GridTabPreview extends HookConsumerWidget { top: -4, child: Icon( MdiIcons.dominoMask, - color: Color(0xFF8000D7), + color: AppColors.privateTabPurple, ), ), ], @@ -271,7 +272,7 @@ class ListTabPreview extends HookConsumerWidget { return Container( decoration: BoxDecoration( - color: tabState.isPrivate ? const Color(0xFF25003E) : null, + color: tabState.isPrivate ? AppColors.privateTabBackground : null, border: isActive ? Border.all(color: colorScheme.primary) : null, borderRadius: const BorderRadius.all(Radius.circular(4.0)), ), @@ -304,7 +305,7 @@ class ListTabPreview extends HookConsumerWidget { if (tabState.isPrivate) ...[ const Icon( MdiIcons.dominoMask, - color: Color(0xFF8000D7), + color: AppColors.privateTabPurple, size: 14, ), const SizedBox(width: 4), diff --git a/app/lib/features/geckoview/features/search/presentation/screens/search.dart b/app/lib/features/geckoview/features/search/presentation/screens/search.dart index 96a400ea..2bf0ac2e 100644 --- a/app/lib/features/geckoview/features/search/presentation/screens/search.dart +++ b/app/lib/features/geckoview/features/search/presentation/screens/search.dart @@ -22,6 +22,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_material_design_icons/flutter_material_design_icons.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/core/routing/routes.dart'; import 'package:weblibre/features/bangs/data/models/bang_data.dart'; import 'package:weblibre/features/bangs/domain/providers/bangs.dart'; @@ -172,14 +173,12 @@ class SearchScreen extends HookConsumerWidget { style: switch (selectedTabType.value) { TabType.regular => null, TabType.private => SegmentedButton.styleFrom( - selectedBackgroundColor: const Color(0x648000D7), + selectedBackgroundColor: AppColors.privateSelectionOverlay, ), TabType.child => (currentTabTabType == TabType.private) ? SegmentedButton.styleFrom( - selectedBackgroundColor: const Color( - 0x648000D7, - ), + selectedBackgroundColor: AppColors.privateSelectionOverlay, ) : null, }, diff --git a/app/lib/features/geckoview/features/tabs/presentation/widgets/material_color_picker.dart b/app/lib/features/geckoview/features/tabs/presentation/widgets/material_color_picker.dart index 69abe962..cf51ac81 100644 --- a/app/lib/features/geckoview/features/tabs/presentation/widgets/material_color_picker.dart +++ b/app/lib/features/geckoview/features/tabs/presentation/widgets/material_color_picker.dart @@ -132,7 +132,7 @@ class _MaterialPickerState extends State { setState(() => _currentColorType = colors); }, child: Container( - color: const Color(0x00000000), + color: Colors.transparent, padding: isPortrait ? const EdgeInsets.fromLTRB(0, 7, 0, 7) : const EdgeInsets.fromLTRB(7, 0, 7, 0), @@ -217,7 +217,7 @@ class _MaterialPickerState extends State { widget.onColorChanged(color); }, child: Container( - color: const Color(0x00000000), + color: Colors.transparent, margin: isPortrait ? const EdgeInsets.only(right: 10) : const EdgeInsets.only(bottom: 10), diff --git a/app/lib/features/geckoview/features/tabs/utils/color_palette.dart b/app/lib/features/geckoview/features/tabs/utils/color_palette.dart index f79a4313..e5837abe 100644 --- a/app/lib/features/geckoview/features/tabs/utils/color_palette.dart +++ b/app/lib/features/geckoview/features/tabs/utils/color_palette.dart @@ -118,7 +118,7 @@ List> shadingTypes(List colors) { ].map((int shade) => {colorType[shade]!: shade.toString()}).toList(), ); } else { - result.add({const Color(0x00000000): ''}); + result.add({Colors.transparent: ''}); } } diff --git a/app/lib/features/settings/presentation/screens/general_settings.dart b/app/lib/features/settings/presentation/screens/general_settings.dart index 92916ebc..74d30f13 100644 --- a/app/lib/features/settings/presentation/screens/general_settings.dart +++ b/app/lib/features/settings/presentation/screens/general_settings.dart @@ -23,6 +23,7 @@ import 'package:flutter_material_design_icons/flutter_material_design_icons.dart import 'package:google_fonts/google_fonts.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:nullability/nullability.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/core/routing/routes.dart'; import 'package:weblibre/features/search/domain/entities/abstract/i_search_suggestion_provider.dart'; import 'package:weblibre/features/settings/presentation/controllers/save_settings.dart'; @@ -144,7 +145,7 @@ class GeneralSettingsScreen extends HookConsumerWidget { style: switch (generalSettings.defaultCreateTabType) { TabType.regular => null, TabType.private => SegmentedButton.styleFrom( - selectedBackgroundColor: const Color(0x648000D7), + selectedBackgroundColor: AppColors.privateSelectionOverlay, ), TabType.child => null, }, @@ -205,7 +206,7 @@ class GeneralSettingsScreen extends HookConsumerWidget { TabIntentOpenSetting.regular => null, TabIntentOpenSetting.private => SegmentedButton.styleFrom( - selectedBackgroundColor: const Color(0x648000D7), + selectedBackgroundColor: AppColors.privateSelectionOverlay, ), TabIntentOpenSetting.ask => null, }, diff --git a/app/lib/features/tor/presentation/screens/tor_proxy.dart b/app/lib/features/tor/presentation/screens/tor_proxy.dart index a901f669..959f9abc 100644 --- a/app/lib/features/tor/presentation/screens/tor_proxy.dart +++ b/app/lib/features/tor/presentation/screens/tor_proxy.dart @@ -21,6 +21,7 @@ import 'package:fading_scroll/fading_scroll.dart'; import 'package:flutter/material.dart'; import 'package:flutter_material_design_icons/flutter_material_design_icons.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/features/settings/presentation/controllers/save_settings.dart'; import 'package:weblibre/features/tor/domain/services/tor_proxy.dart'; import 'package:weblibre/features/user/data/models/tor_settings.dart'; @@ -60,7 +61,7 @@ class TorProxyScreen extends HookConsumerWidget { Set states, ) { if (states.isEmpty) { - return const Color(0xFF333A41); + return AppColors.torBackgroundGrey; } return null; // Use the default color. }), @@ -86,7 +87,7 @@ class TorProxyScreen extends HookConsumerWidget { ), child: SafeArea( child: ColoredBox( - color: const Color(0xFF7D4698), + color: AppColors.torPurple, child: Column( children: [ const SizedBox(height: 16), @@ -100,7 +101,7 @@ class TorProxyScreen extends HookConsumerWidget { ), child: SwitchListTile.adaptive( inactiveThumbColor: Colors.white, - activeThumbColor: const Color(0xFF68B030), + activeThumbColor: AppColors.torActiveGreen, thumbIcon: WidgetStateProperty.resolveWith(( Set states, ) { @@ -189,7 +190,7 @@ class TorProxyScreen extends HookConsumerWidget { SwitchListTile.adaptive( inactiveThumbColor: Colors.white, - activeThumbColor: const Color(0xFF68B030), + activeThumbColor: AppColors.torActiveGreen, thumbIcon: WidgetStateProperty.resolveWith(( Set states, @@ -234,7 +235,7 @@ class TorProxyScreen extends HookConsumerWidget { ), SwitchListTile.adaptive( inactiveThumbColor: Colors.white, - activeThumbColor: const Color(0xFF68B030), + activeThumbColor: AppColors.torActiveGreen, thumbIcon: WidgetStateProperty.resolveWith(( Set states, @@ -284,7 +285,7 @@ class TorProxyScreen extends HookConsumerWidget { TorConnectionConfig.auto) ...[ SwitchListTile.adaptive( inactiveThumbColor: Colors.white, - activeThumbColor: const Color(0xFF68B030), + activeThumbColor: AppColors.torActiveGreen, value: torSettings.requireBridge, contentPadding: const EdgeInsets.only( left: 56, @@ -418,8 +419,8 @@ class TorProxyScreen extends HookConsumerWidget { children: [ SizedBox(height: 8), LinearProgressIndicator( - backgroundColor: Color(0xFF333A41), - color: Color(0xFF68B030), + backgroundColor: AppColors.torBackgroundGrey, + color: AppColors.torActiveGreen, ), SizedBox(height: 8), Text( @@ -436,14 +437,14 @@ class TorProxyScreen extends HookConsumerWidget { children: [ const Icon( MdiIcons.shieldLockOutline, - color: Color(0xFF68B030), + color: AppColors.torActiveGreen, size: 32, ), const SizedBox(width: 12), Text( 'Connected to the Tor Network', style: Theme.of(context).textTheme.titleMedium - ?.copyWith(color: const Color(0xFF68B030)), + ?.copyWith(color: AppColors.torActiveGreen), ), ], ), diff --git a/app/lib/features/tor/presentation/widgets/tor_dialog.dart b/app/lib/features/tor/presentation/widgets/tor_dialog.dart index 266df318..995fdeee 100644 --- a/app/lib/features/tor/presentation/widgets/tor_dialog.dart +++ b/app/lib/features/tor/presentation/widgets/tor_dialog.dart @@ -19,13 +19,14 @@ */ import 'package:flutter/material.dart'; import 'package:go_router/go_router.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/presentation/icons/tor_icons.dart'; class TorDialog extends StatelessWidget { @override Widget build(BuildContext context) { return AlertDialog( - icon: const Icon(TorIcons.onionAlt, color: Color(0xFF7D4698)), + icon: const Icon(TorIcons.onionAlt, color: AppColors.torPurple), title: const Text('Tor™ Proxy'), content: const Text( 'This container requires a Tor proxy for secure connections, which is not currently running.', diff --git a/app/lib/features/tor/presentation/widgets/tor_notification.dart b/app/lib/features/tor/presentation/widgets/tor_notification.dart index ec1d221e..32a51118 100644 --- a/app/lib/features/tor/presentation/widgets/tor_notification.dart +++ b/app/lib/features/tor/presentation/widgets/tor_notification.dart @@ -19,6 +19,7 @@ */ import 'package:flutter/material.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; +import 'package:weblibre/core/design/app_colors.dart'; import 'package:weblibre/features/geckoview/domain/controllers/overlay.dart'; import 'package:weblibre/features/tor/domain/services/tor_proxy.dart'; import 'package:weblibre/presentation/icons/tor_icons.dart'; @@ -35,7 +36,7 @@ class TorNotification extends HookConsumerWidget { return SafeArea( child: ColoredBox( - color: const Color(0xFF7D4698), + color: AppColors.torPurple, child: SizedBox( height: 56, width: MediaQuery.of(context).size.width, @@ -47,7 +48,7 @@ class TorNotification extends HookConsumerWidget { duration: const Duration(milliseconds: 500), primaryEnd: Alignment.bottomLeft, secondaryEnd: Alignment.topRight, - primaryColors: const [Color(0xFF68B030), Color(0xFF68B030)], + primaryColors: const [AppColors.torActiveGreen, AppColors.torActiveGreen], secondaryColors: const [Colors.white, Colors.white], child: const Padding( padding: EdgeInsets.symmetric(horizontal: 12),