diff --git a/lib/ui/cards/scoreboard_card.dart b/lib/ui/cards/scoreboard_card.dart index 3d8adc1d..73c3102d 100644 --- a/lib/ui/cards/scoreboard_card.dart +++ b/lib/ui/cards/scoreboard_card.dart @@ -53,16 +53,35 @@ class ScoreboardPersistentHeaderDelegate double offsetForShrink = 50; + List childrenDays = [ + Text(model.daysInStudy.toString(), + style: scoreNumberStyle.copyWith( + fontSize: calculateScrollAwareSizing(shrinkOffset, + scoreNumberStyleSmall.fontSize!, scoreNumberStyle.fontSize!), + color: Theme.of(context).extension()!.grey900)), + if (shrinkOffset < offsetForShrink) + Text(locale.translate('cards.scoreboard.days'), + style: scoreTextStyle.copyWith( + color: Theme.of(context).extension()!.grey900)), + if (shrinkOffset > offsetForShrink) + Padding( + padding: const EdgeInsets.only(left: 8.0), + child: Text(locale.translate('cards.scoreboard.days-short'), + style: scoreTextStyle.copyWith( + color: Theme.of(context).extension()!.grey900)), + ) + ]; + List childrenTasks = [ Text(model.taskCompleted.toString(), style: scoreNumberStyle.copyWith( fontSize: calculateScrollAwareSizing(shrinkOffset, scoreNumberStyleSmall.fontSize!, scoreNumberStyle.fontSize!), - color: Theme.of(context).primaryColor)), + color: Theme.of(context).extension()!.grey900)), if (shrinkOffset < offsetForShrink) Text(locale.translate('cards.scoreboard.tasks'), - style: - scoreTextStyle.copyWith(color: Theme.of(context).primaryColor)), + style: scoreTextStyle.copyWith( + color: Theme.of(context).extension()!.grey900)), if (shrinkOffset > offsetForShrink) Expanded( flex: 0, @@ -70,33 +89,15 @@ class ScoreboardPersistentHeaderDelegate padding: const EdgeInsets.only(left: 8.0), child: Text(locale.translate('cards.scoreboard.tasks-short'), style: scoreTextStyle.copyWith( - color: Theme.of(context).primaryColor)), + color: Theme.of(context).extension()!.grey900)), ), ) ]; - List childrenDays = [ - Text(model.daysInStudy.toString(), - style: scoreNumberStyle.copyWith( - fontSize: calculateScrollAwareSizing(shrinkOffset, - scoreNumberStyleSmall.fontSize!, scoreNumberStyle.fontSize!), - color: Theme.of(context).primaryColor)), - if (shrinkOffset < offsetForShrink) - Text(locale.translate('cards.scoreboard.days'), - style: - scoreTextStyle.copyWith(color: Theme.of(context).primaryColor)), - if (shrinkOffset > offsetForShrink) - Padding( - padding: const EdgeInsets.only(left: 8.0), - child: Text(locale.translate('cards.scoreboard.days-short'), - style: scoreTextStyle.copyWith( - color: Theme.of(context).primaryColor)), - ) - ]; return Container( height: height, decoration: BoxDecoration( - color: Theme.of(context).colorScheme.secondary, + color: Theme.of(context).extension()!.white, borderRadius: BorderRadius.circular(8), // Rounded corners ), child: StreamBuilder( diff --git a/lib/ui/carp_study_style.dart b/lib/ui/carp_study_style.dart index 77c9a160..7324810b 100644 --- a/lib/ui/carp_study_style.dart +++ b/lib/ui/carp_study_style.dart @@ -6,6 +6,7 @@ class CarpColors extends ThemeExtension { required this.warningColor, required this.backgroundGray, required this.tabBarBackground, + required this.white, required this.grey50, required this.grey100, required this.grey200, @@ -25,6 +26,8 @@ class CarpColors extends ThemeExtension { final Color? tabBarBackground; + final Color? white; + final Color? grey50; final Color? grey100; final Color? grey200; @@ -37,13 +40,28 @@ class CarpColors extends ThemeExtension { final Color? grey900; final Color? grey950; - @override - CarpColors copyWith({Color? warningColor, Color? backgroundGray}) { + CarpColors copyWith( + {Color? warningColor, + Color? backgroundGray, + Color? tabBarBackground, + Color? white, + Color? grey50, + Color? grey100, + Color? grey200, + Color? grey300, + Color? grey400, + Color? grey500, + Color? grey600, + Color? grey700, + Color? grey800, + Color? grey900, + Color? grey950}) { return CarpColors( warningColor: warningColor ?? this.warningColor, backgroundGray: backgroundGray ?? this.backgroundGray, tabBarBackground: tabBarBackground ?? this.tabBarBackground, + white: white ?? this.white, grey50: grey50 ?? this.grey50, grey100: grey100 ?? this.grey100, grey200: grey200 ?? this.grey200, @@ -67,6 +85,7 @@ class CarpColors extends ThemeExtension { warningColor: Color.lerp(warningColor, other.warningColor, t), backgroundGray: Color.lerp(backgroundGray, other.backgroundGray, t), tabBarBackground: Color.lerp(tabBarBackground, other.tabBarBackground, t), + white: Color.lerp(white, other.white, t), grey50: Color.lerp(grey50, other.grey50, t), grey100: Color.lerp(grey100, other.grey100, t), grey200: Color.lerp(grey200, other.grey200, t), @@ -86,22 +105,23 @@ ThemeData carpStudyTheme = ThemeData.light().copyWith( extensions: >[ CarpColors( warningColor: Colors.orange[500], - backgroundGray: const Color.fromARGB(255, 242, 242, 247), + backgroundGray: const Color(0xfff2f2f7), tabBarBackground: const Color.fromARGB(255, 227, 227, 228), - grey50: const Color(0xFCFCFF), - grey100: const Color(0xF2F2F7), - grey200: const Color(0xE5E5EA), - grey300: const Color(0xD1D1D6), - grey400: const Color(0xBABABA), - grey500: const Color(0x9B9B9B), - grey600: const Color(0x848484), - grey700: const Color(0x3A3A3C), - grey800: const Color(0x2C2C2E), - grey900: const Color(0x1C1C1E), - grey950: const Color(0x0E0E0E), + white: const Color(0xffFFFFFF), + grey50: const Color(0xffFCFCFF), + grey100: const Color(0xffF2F2F7), + grey200: const Color(0xffE5E5EA), + grey300: const Color(0xffD1D1D6), + grey400: const Color(0xffBABABA), + grey500: const Color(0xff9B9B9B), + grey600: const Color(0xff848484), + grey700: const Color(0xff3A3A3C), + grey800: const Color(0xff2C2C2E), + grey900: const Color(0xff1C1C1E), + grey950: const Color(0xff0E0E0E), ) ], - primaryColor: const Color(0xFF206FA2), + primaryColor: const Color(0xff006398), colorScheme: const ColorScheme.light().copyWith( secondary: const Color(0xFFFAFAFA), primary: const Color(0xFF206FA2), @@ -155,22 +175,23 @@ ThemeData carpStudyDarkTheme = ThemeData.dark().copyWith( extensions: >[ CarpColors( warningColor: Colors.orange[700], - backgroundGray: const Color(0xf2f2f7), - tabBarBackground: const Color(0xe3e3e4), - grey50: const Color(0x3A3A3C), - grey100: const Color(0x0E0E0E), - grey200: const Color(0x2C2C2E), - grey300: const Color(0x3A3A3C), - grey400: const Color(0x9B9B9B), - grey500: const Color(0xBABABA), - grey600: const Color(0xBABABA), - grey700: const Color(0xD1D1D6), - grey800: const Color(0xF2F2F7), - grey900: const Color(0xF2F2F7), - grey950: const Color(0x0E0E0E), + backgroundGray: const Color(0xff0e0e0e), + tabBarBackground: const Color(0xffe3e3e4), + white: const Color(0xff1C1C1E), + grey50: const Color(0xff3A3A3C), + grey100: const Color(0xff0E0E0E), + grey200: const Color(0xff2C2C2E), + grey300: const Color(0xff3A3A3C), + grey400: const Color(0xff9B9B9B), + grey500: const Color(0xffBABABA), + grey600: const Color(0xffBABABA), + grey700: const Color(0xffD1D1D6), + grey800: const Color(0xffF2F2F7), + grey900: const Color(0xffF2F2F7), + grey950: const Color(0xff0E0E0E), ) ], - primaryColor: const Color(0xff81C7F3), + primaryColor: const Color(0xff0379ff), colorScheme: const ColorScheme.dark().copyWith( secondary: const Color(0xff4C4C4C), primary: const Color(0xff81C7F3), @@ -242,7 +263,7 @@ TextStyle scoreNumberStyleSmall = const TextStyle( color: Color.fromRGBO(32, 111, 162, 1)); TextStyle scoreTextStyle = const TextStyle( - fontSize: 12, fontWeight: FontWeight.w700, color: Color(0xff77A8C8)); + fontSize: 12, fontWeight: FontWeight.w700); TextStyle aboutCardTitleStyle = const TextStyle(fontSize: 20, fontWeight: FontWeight.w700); diff --git a/lib/ui/colors.dart b/lib/ui/colors.dart index 4033a7e1..19a5784f 100644 --- a/lib/ui/colors.dart +++ b/lib/ui/colors.dart @@ -7,7 +7,7 @@ class CACHET { static const Color TASK_BLUE = Color.fromRGBO(58, 130, 247, 1.0); static const Color TASK_COMPLETED_BLUE = Color.fromRGBO(0, 99, 152, 1.0); static const Color TASK_TO_EXPIRE_BACKGROUND = - Color.fromRGBO(255, 246, 231, 1.0); + Color(0x1aFFA600); static const Color RED = Color.fromRGBO(213, 11, 51, 1.0); static const Color WHITE = Color.fromRGBO(255, 255, 255, 1.0); diff --git a/lib/ui/pages/task_list_page.dart b/lib/ui/pages/task_list_page.dart index 26c2f06b..272f53ae 100644 --- a/lib/ui/pages/task_list_page.dart +++ b/lib/ui/pages/task_list_page.dart @@ -29,7 +29,7 @@ class _SliverAppBarDelegate extends SliverPersistentHeaderDelegate { padding: const EdgeInsets.symmetric(vertical: 4), decoration: BoxDecoration( borderRadius: BorderRadius.circular(8), - color: Theme.of(context).extension()!.tabBarBackground, + color: Theme.of(context).extension()!.grey200, ), child: _tabBar, ); @@ -111,15 +111,15 @@ class TaskListPageState extends State controller: _tabController, labelPadding: const EdgeInsets.only( top: 4, bottom: 4, left: 4, right: 4), - labelColor: Colors.black, - unselectedLabelColor: Colors.black, + labelColor: Theme.of(context).extension()!.grey900, + unselectedLabelColor: Theme.of(context).extension()!.grey900, dividerColor: Colors.transparent, indicator: ShapeDecoration( shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(8), ), color: - Theme.of(context).colorScheme.secondary, + Theme.of(context).extension()!.white, ), tabs: [ Container( @@ -187,7 +187,7 @@ class TaskListPageState extends State backgroundColor: userTask.expiresIn != null && userTask.expiresIn!.inHours < 24 ? CACHET.TASK_TO_EXPIRE_BACKGROUND - : Colors.white, + : Theme.of(context).extension()!.grey50!, elevation: 0, child: Padding( padding: const EdgeInsets.all(16.0), @@ -303,7 +303,7 @@ class TaskListPageState extends State userTask.state == UserTaskState.done) { return Icon(originalIcon.icon, color: CACHET.TASK_COMPLETED_BLUE); } else { - return Icon(originalIcon.icon, color: CACHET.GREY_6); + return Icon(originalIcon.icon, color: Theme.of(context).extension()!.grey600); } } @@ -341,12 +341,12 @@ class TaskListPageState extends State return Center( child: GestureDetector( child: StudiesMaterial( + backgroundColor: Theme.of(context).extension()!.grey50!, hasBorder: true, + elevation: 0, borderColor: (userTask.state == UserTaskState.done) ? CACHET.TASK_COMPLETED_BLUE : CACHET.GREY_6, - backgroundColor: Colors.white, - elevation: 0, child: Padding( padding: const EdgeInsets.all(16.0), child: IntrinsicHeight(