From 5eb23b01deb7ef43bb073e1c2bdde392363e0a6c Mon Sep 17 00:00:00 2001 From: cogwheel0 <172976095+cogwheel0@users.noreply.github.com> Date: Thu, 2 Oct 2025 01:08:50 +0530 Subject: [PATCH] refactor: update brand colors for improved accessibility - Adjusted brand primary colors in the AppTheme to enhance contrast in light and dark modes, ensuring compliance with WCAG standards. - Updated various theme elements, including chat bubbles and input borders, to utilize the new brand colors for better visual consistency and accessibility. - This refactor improves the overall user experience by providing a more vibrant and accessible color palette. --- lib/shared/theme/app_theme.dart | 22 +++++++++++----------- lib/shared/theme/theme_extensions.dart | 10 +++++----- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/lib/shared/theme/app_theme.dart b/lib/shared/theme/app_theme.dart index ad3dcc4..6ea2e7d 100644 --- a/lib/shared/theme/app_theme.dart +++ b/lib/shared/theme/app_theme.dart @@ -4,10 +4,10 @@ import 'package:flutter_animate/flutter_animate.dart'; import 'theme_extensions.dart'; class AppTheme { - // Brand accents (ChatGPT aesthetic) - static const Color brandPrimary = Color(0xFF4F46E5); // Indigo - static const Color brandPrimaryLight = Color(0xFF818CF8); - static const Color brandPrimaryDark = Color(0xFF4338CA); + // Brand accents tuned for WCAG contrast in light/dark modes + static const Color brandPrimary = Color(0xFFA420FF); // Light mode primary + static const Color brandPrimaryLight = Color(0xFFC773FF); // Light accents + static const Color brandPrimaryDark = Color(0xFF9500FF); // Dark mode primary // Enhanced neutral palette for better contrast (WCAG AA compliant) static const Color neutral900 = Color(0xFF000000); // Pure black @@ -141,8 +141,8 @@ class AppTheme { brightness: Brightness.dark, scaffoldBackgroundColor: Color(0xFF0A0D0C), colorScheme: const ColorScheme.dark( - primary: brandPrimary, - secondary: brandPrimaryDark, + primary: brandPrimaryDark, + secondary: brandPrimary, surface: Color(0xFF0A0D0C), surfaceContainerHighest: neutral700, onSurface: neutral50, @@ -217,7 +217,7 @@ class AppTheme { ), focusedBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(AppBorderRadius.md), - borderSide: const BorderSide(color: brandPrimary, width: 2), + borderSide: const BorderSide(color: brandPrimaryDark, width: 2), ), errorBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(AppBorderRadius.md), @@ -276,8 +276,8 @@ class AppTheme { static ThemeData conduitDarkTheme = darkTheme.copyWith( scaffoldBackgroundColor: const Color(0xFF0A0D0C), colorScheme: darkTheme.colorScheme.copyWith( - primary: brandPrimary, - secondary: brandPrimaryDark, + primary: brandPrimaryDark, + secondary: brandPrimary, surface: const Color(0xFF0A0D0C), surfaceContainerHighest: neutral700, ), @@ -301,7 +301,7 @@ class AppTheme { ), focusedBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(AppBorderRadius.md), - borderSide: const BorderSide(color: brandPrimary, width: 2), + borderSide: const BorderSide(color: brandPrimaryDark, width: 2), ), errorBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(AppBorderRadius.md), @@ -322,7 +322,7 @@ class AppTheme { final isDark = Theme.of(context).brightness == Brightness.dark; return CupertinoThemeData( brightness: isDark ? Brightness.dark : Brightness.light, - primaryColor: brandPrimary, + primaryColor: isDark ? brandPrimaryDark : brandPrimary, scaffoldBackgroundColor: isDark ? neutral900 : neutral50, barBackgroundColor: isDark ? neutral900 : neutral50, ); diff --git a/lib/shared/theme/theme_extensions.dart b/lib/shared/theme/theme_extensions.dart index ba57212..d053f98 100644 --- a/lib/shared/theme/theme_extensions.dart +++ b/lib/shared/theme/theme_extensions.dart @@ -504,7 +504,7 @@ class ConduitThemeExtension extends ThemeExtension { /// Dark theme extension static const ConduitThemeExtension dark = ConduitThemeExtension( // Chat-specific colors - Enhanced for production-grade look - chatBubbleUser: AppTheme.brandPrimary, + chatBubbleUser: AppTheme.brandPrimaryDark, chatBubbleAssistant: Color(0xFF0E1010), chatBubbleUserText: AppTheme.neutral50, chatBubbleAssistantText: AppTheme.neutral50, @@ -513,7 +513,7 @@ class ConduitThemeExtension extends ThemeExtension { // Input and form colors inputBackground: Color(0xFF141615), inputBorder: AppTheme.neutral600, - inputBorderFocused: AppTheme.brandPrimary, + inputBorderFocused: AppTheme.brandPrimaryDark, inputText: AppTheme.neutral50, inputPlaceholder: AppTheme.neutral300, inputError: AppTheme.error, @@ -527,7 +527,7 @@ class ConduitThemeExtension extends ThemeExtension { surfaceContainerHighest: Color(0xFF121514), // Interactive element colors - More vibrant and accessible - buttonPrimary: AppTheme.brandPrimary, + buttonPrimary: AppTheme.brandPrimaryDark, buttonPrimaryText: AppTheme.neutral50, buttonSecondary: Color(0xFF151918), buttonSecondaryText: AppTheme.neutral50, @@ -547,14 +547,14 @@ class ConduitThemeExtension extends ThemeExtension { // Navigation and UI element colors - Enhanced contrast dividerColor: AppTheme.neutral600, navigationBackground: Color(0xFF0A0D0C), - navigationSelected: AppTheme.brandPrimary, + navigationSelected: AppTheme.brandPrimaryDark, navigationUnselected: AppTheme.neutral300, navigationSelectedBackground: Color(0xFF312E81), // Loading and animation colors - Enhanced visibility shimmerBase: Color(0xFF121514), shimmerHighlight: Color(0xFF1A1D1C), - loadingIndicator: AppTheme.brandPrimary, + loadingIndicator: AppTheme.brandPrimaryDark, // Text colors - Enhanced hierarchy textPrimary: AppTheme.neutral50, textSecondary: Color(0xFFBAC2C0),