diff --git a/app/lib/main/sharezone_material_app.dart b/app/lib/main/sharezone_material_app.dart index 5db74b6e5..72df11923 100644 --- a/app/lib/main/sharezone_material_app.dart +++ b/app/lib/main/sharezone_material_app.dart @@ -42,9 +42,9 @@ class SharezoneMaterialApp extends StatelessWidget { debugShowCheckedModeBanner: false, title: PlatformCheck.isWeb ? "Sharezone Web-App" : "Sharezone", color: primaryColor, - darkTheme: darkTheme.copyWith( + darkTheme: getDarkTheme().copyWith( visualDensity: themeSettings.visualDensitySetting.visualDensity), - theme: lightTheme.copyWith( + theme: getLightTheme().copyWith( visualDensity: themeSettings.visualDensitySetting.visualDensity), themeMode: _getThemeMode(themeSettings.themeBrightness), localizationsDelegates: const [ diff --git a/app/lib/navigation/drawer/sign_out_dialogs/src/sign_out_and_delete_anonymous_user.dart b/app/lib/navigation/drawer/sign_out_dialogs/src/sign_out_and_delete_anonymous_user.dart index 0f4da3672..46a6a6831 100644 --- a/app/lib/navigation/drawer/sign_out_dialogs/src/sign_out_and_delete_anonymous_user.dart +++ b/app/lib/navigation/drawer/sign_out_dialogs/src/sign_out_and_delete_anonymous_user.dart @@ -246,7 +246,7 @@ class DeleteConfirmationCheckbox extends StatelessWidget { Material( color: Colors.transparent, child: Theme( - data: darkTheme, + data: getDarkTheme(), child: Checkbox( value: confirm, onChanged: onChanged, diff --git a/app/test_goldens/blackboard/details/blackboard_item_read_by_users_list_page_test.dart b/app/test_goldens/blackboard/details/blackboard_item_read_by_users_list_page_test.dart index 52713559e..1e4c43949 100644 --- a/app/test_goldens/blackboard/details/blackboard_item_read_by_users_list_page_test.dart +++ b/app/test_goldens/blackboard/details/blackboard_item_read_by_users_list_page_test.dart @@ -80,7 +80,7 @@ void main() { }); testGoldens('(light mode)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden( tester, @@ -89,7 +89,7 @@ void main() { }); testGoldens('(dark mode)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden( tester, @@ -106,7 +106,7 @@ void main() { }); testGoldens('(light mode)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden( tester, @@ -115,7 +115,7 @@ void main() { }); testGoldens('(dark mode)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden( tester, diff --git a/app/test_goldens/calendrical_events/page/past_calendrical_events_page_test.dart b/app/test_goldens/calendrical_events/page/past_calendrical_events_page_test.dart index bf9e68741..bdfe013f8 100644 --- a/app/test_goldens/calendrical_events/page/past_calendrical_events_page_test.dart +++ b/app/test_goldens/calendrical_events/page/past_calendrical_events_page_test.dart @@ -84,7 +84,7 @@ void main() { }); testGoldens('renders correctly (light theme)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden( tester, @@ -93,7 +93,7 @@ void main() { }); testGoldens('renders correctly (dark theme)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden( tester, @@ -112,7 +112,7 @@ void main() { }); testGoldens('renders correctly (light theme)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden( tester, @@ -121,7 +121,7 @@ void main() { }); testGoldens('renders correctly (dark theme)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden( tester, diff --git a/app/test_goldens/dashboard/dashboard_page_test.dart b/app/test_goldens/dashboard/dashboard_page_test.dart index f5dd1dd35..87bb96918 100644 --- a/app/test_goldens/dashboard/dashboard_page_test.dart +++ b/app/test_goldens/dashboard/dashboard_page_test.dart @@ -69,7 +69,7 @@ void main() { BlocProvider( bloc: holidayBloc, child: MaterialApp( - theme: lightTheme, + theme: getLightTheme(), home: const Scaffold( body: Center( child: HolidayCountdownSection(), diff --git a/app/test_goldens/groups/src/pages/course/course_edit/design/src/dialog/select_design_dialog_test.dart b/app/test_goldens/groups/src/pages/course/course_edit/design/src/dialog/select_design_dialog_test.dart index 93d1665c5..628f0a64f 100644 --- a/app/test_goldens/groups/src/pages/course/course_edit/design/src/dialog/select_design_dialog_test.dart +++ b/app/test_goldens/groups/src/pages/course/course_edit/design/src/dialog/select_design_dialog_test.dart @@ -67,14 +67,14 @@ void main() { testGoldens('displays select base color dialog as expected (light mode)', (tester) async { - await pumpSelectDesignDialog(tester, theme: lightTheme); + await pumpSelectDesignDialog(tester, theme: getLightTheme()); await multiScreenGolden(tester, 'select_base_color_dialog_light'); }); testGoldens('displays select base color dialog as expected (dark mode)', (tester) async { - await pumpSelectDesignDialog(tester, theme: darkTheme); + await pumpSelectDesignDialog(tester, theme: getDarkTheme()); await multiScreenGolden(tester, 'select_base_color_dialog_dark'); }); @@ -82,7 +82,7 @@ void main() { testGoldens( 'displays select a color shade dialog as expected (light mode)', (tester) async { - await pumpSelectDesignDialog(tester, theme: lightTheme); + await pumpSelectDesignDialog(tester, theme: getLightTheme()); await tester .tap(find.byKey(Key('color-circle-${Colors.blue.value}')).last); @@ -94,7 +94,7 @@ void main() { testGoldens( 'displays select a color shade dialog as expected (dark mode)', (tester) async { - await pumpSelectDesignDialog(tester, theme: darkTheme); + await pumpSelectDesignDialog(tester, theme: getDarkTheme()); await tester .tap(find.byKey(Key('color-circle-${Colors.blue.value}')).last); @@ -113,14 +113,14 @@ void main() { testGoldens('displays select design dialog as expected (light mode)', (tester) async { - await pumpSelectDesignDialog(tester, theme: lightTheme); + await pumpSelectDesignDialog(tester, theme: getLightTheme()); await multiScreenGolden(tester, 'select_free_design_dialog_light'); }); testGoldens('displays select design dialog as expected (dark mode)', (tester) async { - await pumpSelectDesignDialog(tester, theme: darkTheme); + await pumpSelectDesignDialog(tester, theme: getDarkTheme()); await multiScreenGolden(tester, 'select_free_design_dialog_dark'); }); diff --git a/app/test_goldens/homework/homework_dialog/homework_dialog_test.dart b/app/test_goldens/homework/homework_dialog/homework_dialog_test.dart index 240117620..c6aaadad2 100644 --- a/app/test_goldens/homework/homework_dialog/homework_dialog_test.dart +++ b/app/test_goldens/homework/homework_dialog/homework_dialog_test.dart @@ -65,7 +65,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: lightTheme); + isEditing: false, theme: getLightTheme()); await multiScreenGolden( tester, @@ -73,7 +73,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: darkTheme); + isEditing: false, theme: getDarkTheme()); await multiScreenGolden( tester, @@ -131,7 +131,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: lightTheme); + isEditing: false, theme: getLightTheme()); await multiScreenGolden( tester, @@ -139,7 +139,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: darkTheme); + isEditing: false, theme: getDarkTheme()); await multiScreenGolden( tester, @@ -200,7 +200,7 @@ void main() { whenListenPresentation(homeworkDialogBloc, initialEvents: [const StartedUploadingAttachments()]); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: lightTheme); + isEditing: false, theme: getLightTheme()); // Wait for the SnackBar to appear. await tester.pump(const Duration(milliseconds: 500)); @@ -223,7 +223,7 @@ void main() { await pumpAndSettleHomeworkDialog( tester, isEditing: false, - theme: darkTheme, + theme: getDarkTheme(), ); // Otherwise the theme is not completly applied (some text is still black // instead of white). @@ -293,7 +293,7 @@ void main() { SavingFailed(Exception('Test Exception Message'), null) ]); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: lightTheme); + isEditing: false, theme: getLightTheme()); // Wait for the SnackBar to appear. await tester.pump(const Duration(milliseconds: 500)); @@ -318,7 +318,7 @@ void main() { await pumpAndSettleHomeworkDialog( tester, isEditing: false, - theme: darkTheme, + theme: getDarkTheme(), ); // Otherwise the theme is not completly applied (some text is still black // instead of white). @@ -357,7 +357,7 @@ void main() { initialEvents: [const RequiredFieldsNotFilledOut()]); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: lightTheme); + isEditing: false, theme: getLightTheme()); await multiScreenGolden( tester, @@ -365,7 +365,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: darkTheme); + isEditing: false, theme: getDarkTheme()); await multiScreenGolden( tester, @@ -415,7 +415,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: lightTheme); + isEditing: false, theme: getLightTheme()); await multiScreenGolden( tester, @@ -423,7 +423,7 @@ void main() { ); await pumpAndSettleHomeworkDialog(tester, - isEditing: false, theme: darkTheme); + isEditing: false, theme: getDarkTheme()); await multiScreenGolden( tester, diff --git a/app/test_goldens/homework/teacher/homework_done_by_users_list/homework_completion_user_list_page_test.dart b/app/test_goldens/homework/teacher/homework_done_by_users_list/homework_completion_user_list_page_test.dart index 651d6086a..cd7c72fe8 100644 --- a/app/test_goldens/homework/teacher/homework_done_by_users_list/homework_completion_user_list_page_test.dart +++ b/app/test_goldens/homework/teacher/homework_done_by_users_list/homework_completion_user_list_page_test.dart @@ -84,7 +84,7 @@ void main() { }); testGoldens('(light mode)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden( tester, @@ -93,7 +93,7 @@ void main() { }); testGoldens('(dark mode)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden( tester, @@ -110,7 +110,7 @@ void main() { }); testGoldens('(light mode)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden( tester, @@ -119,7 +119,7 @@ void main() { }); testGoldens('(dark mode)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden( tester, diff --git a/app/test_goldens/onboarding/mobile_welcome_page_test.dart b/app/test_goldens/onboarding/mobile_welcome_page_test.dart index 3b60c11f2..c87270875 100644 --- a/app/test_goldens/onboarding/mobile_welcome_page_test.dart +++ b/app/test_goldens/onboarding/mobile_welcome_page_test.dart @@ -22,7 +22,7 @@ void main() { } testGoldens('renders as expected (light theme)', (tester) async { - await pumpPage(tester, theme: lightTheme); + await pumpPage(tester, theme: getLightTheme()); await multiScreenGolden(tester, 'mobile_welcome_page_light'); }); @@ -32,7 +32,7 @@ void main() { // // Ticket: https://github.com/SharezoneApp/sharezone-app/issues/916 testGoldens('renders as expected (dark theme)', (tester) async { - await pumpPage(tester, theme: darkTheme); + await pumpPage(tester, theme: getDarkTheme()); await multiScreenGolden(tester, 'mobile_welcome_page_dark'); }); diff --git a/app/test_goldens/privacy_policy/privacy_policy_display_settings_test.dart b/app/test_goldens/privacy_policy/privacy_policy_display_settings_test.dart index 734d59f80..2bb422396 100644 --- a/app/test_goldens/privacy_policy/privacy_policy_display_settings_test.dart +++ b/app/test_goldens/privacy_policy/privacy_policy_display_settings_test.dart @@ -25,7 +25,7 @@ void main() { testGoldens('displays as expected', (tester) async { await tester.pumpWidget( MaterialApp( - theme: lightTheme, + theme: getLightTheme(), home: Scaffold( body: ChangeNotifierProvider( create: (context) { diff --git a/app/test_goldens/settings/notification_page_test.dart b/app/test_goldens/settings/notification_page_test.dart index 97c82180f..3afe005d4 100644 --- a/app/test_goldens/settings/notification_page_test.dart +++ b/app/test_goldens/settings/notification_page_test.dart @@ -66,13 +66,13 @@ void main() { } testGoldens('renders as expected (light mode)', (tester) async { - await pumpNotificationPage(tester, themeData: lightTheme); + await pumpNotificationPage(tester, themeData: getLightTheme()); await multiScreenGolden(tester, 'notification_page_light'); }); testGoldens('renders as expected (dark mode)', (tester) async { - await pumpNotificationPage(tester, themeData: darkTheme); + await pumpNotificationPage(tester, themeData: getDarkTheme()); await multiScreenGolden(tester, 'notification_page_dark'); }); @@ -82,7 +82,7 @@ void main() { SharezonePlusFeature.changeHomeworkReminderTime)) .thenReturn(false); - await pumpNotificationPage(tester, themeData: lightTheme); + await pumpNotificationPage(tester, themeData: getLightTheme()); await tester .tap(find.byKey(const Key('homework-notifications-time-tile'))); diff --git a/app/test_goldens/settings/support/support_page_test.dart b/app/test_goldens/settings/support/support_page_test.dart index 51241d1bb..78139eac4 100644 --- a/app/test_goldens/settings/support/support_page_test.dart +++ b/app/test_goldens/settings/support/support_page_test.dart @@ -60,13 +60,13 @@ void main() { }); testGoldens('renders as expected (light mode)', (tester) async { - await pumpSupportPage(tester, theme: lightTheme); + await pumpSupportPage(tester, theme: getLightTheme()); await multiScreenGolden(tester, 'support_page_with_plus_light'); }); testGoldens('renders as expected (dark mode)', (tester) async { - await pumpSupportPage(tester, theme: darkTheme); + await pumpSupportPage(tester, theme: getDarkTheme()); await multiScreenGolden(tester, 'support_page_with_plus_dark'); }); @@ -78,13 +78,13 @@ void main() { }); testGoldens('renders as expected (light mode)', (tester) async { - await pumpSupportPage(tester, theme: lightTheme); + await pumpSupportPage(tester, theme: getLightTheme()); await multiScreenGolden(tester, 'support_page_without_plus_light'); }); testGoldens('renders as expected (dark mode)', (tester) async { - await pumpSupportPage(tester, theme: darkTheme); + await pumpSupportPage(tester, theme: getDarkTheme()); await multiScreenGolden(tester, 'support_page_without_plus_dark'); }); diff --git a/app/test_goldens/sharezone_plus/sharezone_plus_page_test.dart b/app/test_goldens/sharezone_plus/sharezone_plus_page_test.dart index 5a525f19f..0db5937a5 100644 --- a/app/test_goldens/sharezone_plus/sharezone_plus_page_test.dart +++ b/app/test_goldens/sharezone_plus/sharezone_plus_page_test.dart @@ -125,13 +125,13 @@ void main() { } testGoldens('renders page as expected (light theme)', (tester) async { - await pumpPlusPage(tester, theme: lightTheme); + await pumpPlusPage(tester, theme: getLightTheme()); await multiScreenGolden(tester, 'sharezone_plus_page_light_theme'); }); testGoldens('renders page as expected (dark theme)', (tester) async { - await pumpPlusPage(tester, theme: darkTheme); + await pumpPlusPage(tester, theme: getDarkTheme()); await multiScreenGolden(tester, 'sharezone_plus_page_dark_theme'); }); @@ -140,7 +140,7 @@ void main() { (tester) async { when(controller.hasPlus).thenAnswer((_) => true); - await pumpPlusPage(tester, theme: lightTheme); + await pumpPlusPage(tester, theme: getLightTheme()); // Ensure visibility await tester.dragUntilVisible( @@ -187,7 +187,7 @@ void main() { (tester) async { await pumpPlusAdvantages( tester, - theme: darkTheme, + theme: getDarkTheme(), typeOfUser: typeOfUser, ); @@ -209,7 +209,7 @@ void main() { (tester) async { await pumpPlusAdvantages( tester, - theme: lightTheme, + theme: getLightTheme(), typeOfUser: typeOfUser, ); @@ -231,7 +231,7 @@ void main() { (tester) async { await tester.pumpWidgetBuilder( const SingleChildScrollView(child: PlusFaqSection()), - wrapper: materialAppWrapper(theme: darkTheme), + wrapper: materialAppWrapper(theme: getDarkTheme()), ); await tapEveryExpansionCard(tester); @@ -248,7 +248,7 @@ void main() { (tester) async { await tester.pumpWidgetBuilder( const SingleChildScrollView(child: PlusFaqSection()), - wrapper: materialAppWrapper(theme: lightTheme), + wrapper: materialAppWrapper(theme: getLightTheme()), ); await tapEveryExpansionCard(tester); diff --git a/app/test_goldens/timetable/timetable_page_test.dart b/app/test_goldens/timetable/timetable_page_test.dart index 954d6b996..6b28a6483 100644 --- a/app/test_goldens/timetable/timetable_page_test.dart +++ b/app/test_goldens/timetable/timetable_page_test.dart @@ -119,7 +119,7 @@ void main() { await testSchoolClassSelection( tester, variant: 'with_plus_light', - themeData: lightTheme, + themeData: getLightTheme(), ); }); @@ -127,7 +127,7 @@ void main() { await testSchoolClassSelection( tester, variant: 'with_plus_dark', - themeData: lightTheme, + themeData: getLightTheme(), ); }); }); @@ -143,7 +143,7 @@ void main() { await testSchoolClassSelection( tester, variant: 'with_without_plus_light', - themeData: lightTheme, + themeData: getLightTheme(), ); }); @@ -151,7 +151,7 @@ void main() { await testSchoolClassSelection( tester, variant: 'with_without_plus_dark', - themeData: darkTheme, + themeData: getDarkTheme(), ); }); }); diff --git a/lib/sharezone_widgets/lib/src/theme/brightness/dark_theme.dart b/lib/sharezone_widgets/lib/src/theme/brightness/dark_theme.dart index c2bebd863..c48cfb734 100644 --- a/lib/sharezone_widgets/lib/src/theme/brightness/dark_theme.dart +++ b/lib/sharezone_widgets/lib/src/theme/brightness/dark_theme.dart @@ -10,101 +10,109 @@ part of './general_theme.dart'; const _accentColor = Colors.lightBlue; -final darkTheme = ThemeData( - // Since 3.16 Material 3 became the standard. However, it requires a migration - // from Material 2 to 3 which is the reason why opt-out for now. - // - // Ticket: https://github.com/SharezoneApp/sharezone-app/issues/1159 - useMaterial3: false, +/// Returns the dark theme for the app. +/// +/// In golden tests outside of `/app`, it's recommended to override [fontFamily] +/// to `Roboto` to because `golden_toolkit` can't load fonts of other packages. +ThemeData getDarkTheme({ + String? fontFamily = rubik, +}) { + return ThemeData( + // Since 3.16 Material 3 became the standard. However, it requires a migration + // from Material 2 to 3 which is the reason why opt-out for now. + // + // Ticket: https://github.com/SharezoneApp/sharezone-app/issues/1159 + useMaterial3: false, - // Brightness - brightness: Brightness.dark, - scaffoldBackgroundColor: ElevationColors.dp0, + // Brightness + brightness: Brightness.dark, + scaffoldBackgroundColor: ElevationColors.dp0, - // Colors - primaryColor: primaryColor, - unselectedWidgetColor: _accentColor, - cardColor: ElevationColors.dp0, - indicatorColor: Colors.amberAccent, - dialogBackgroundColor: ElevationColors.dp12, - canvasColor: ElevationColors.dp2, - highlightColor: PlatformCheck.isIOS ? Colors.grey[800] : null, - splashColor: PlatformCheck.isIOS ? Colors.transparent : null, + // Colors + primaryColor: primaryColor, + unselectedWidgetColor: _accentColor, + cardColor: ElevationColors.dp0, + indicatorColor: Colors.amberAccent, + dialogBackgroundColor: ElevationColors.dp12, + canvasColor: ElevationColors.dp2, + highlightColor: PlatformCheck.isIOS ? Colors.grey[800] : null, + splashColor: PlatformCheck.isIOS ? Colors.transparent : null, - // Font: - fontFamily: rubik, + // Font: + fontFamily: fontFamily, - // Themes - appBarTheme: const AppBarTheme( - color: ElevationColors.dp8, - foregroundColor: Colors.white, - iconTheme: IconThemeData(color: Colors.white), - ), - floatingActionButtonTheme: const FloatingActionButtonThemeData( - backgroundColor: _accentColor, - foregroundColor: Colors.white, - ), - textTheme: const TextTheme() - .copyWith(headlineMedium: const TextStyle(color: Colors.white)), - pageTransitionsTheme: _pageTransitionsTheme, - snackBarTheme: _snackBarTheme.copyWith( - contentTextStyle: const TextStyle(color: Colors.white), - backgroundColor: Colors.black, - ), - bottomSheetTheme: _bottomSheetTheme, - dialogTheme: _dialogTheme, - colorScheme: ColorScheme.fromSeed( - seedColor: primaryColor, - brightness: Brightness.dark, - ), - tabBarTheme: const TabBarTheme(labelColor: Colors.white), - checkboxTheme: CheckboxThemeData( - fillColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + // Themes + appBarTheme: const AppBarTheme( + color: ElevationColors.dp8, + foregroundColor: Colors.white, + iconTheme: IconThemeData(color: Colors.white), + ), + floatingActionButtonTheme: const FloatingActionButtonThemeData( + backgroundColor: _accentColor, + foregroundColor: Colors.white, + ), + textTheme: const TextTheme() + .copyWith(headlineMedium: const TextStyle(color: Colors.white)), + pageTransitionsTheme: _pageTransitionsTheme, + snackBarTheme: _snackBarTheme.copyWith( + contentTextStyle: const TextStyle(color: Colors.white), + backgroundColor: Colors.black, + ), + bottomSheetTheme: _bottomSheetTheme, + dialogTheme: _dialogTheme, + colorScheme: ColorScheme.fromSeed( + seedColor: primaryColor, + brightness: Brightness.dark, + ), + tabBarTheme: const TabBarTheme(labelColor: Colors.white), + checkboxTheme: CheckboxThemeData( + fillColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return _accentColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return _accentColor; - } - return null; - }), - ), - radioTheme: RadioThemeData( - fillColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + }), + ), + radioTheme: RadioThemeData( + fillColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return _accentColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return _accentColor; - } - return null; - }), - ), - switchTheme: SwitchThemeData( - thumbColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + }), + ), + switchTheme: SwitchThemeData( + thumbColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return _accentColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return _accentColor; - } - return null; - }), - trackColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + }), + trackColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return _accentColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return _accentColor; - } - return null; - }), - ), -); + }), + ), + ); +} extension ThemeExtension on ThemeData { bool get isDarkTheme => brightness == Brightness.dark; diff --git a/lib/sharezone_widgets/lib/src/theme/brightness/light_theme.dart b/lib/sharezone_widgets/lib/src/theme/brightness/light_theme.dart index f96cb36fb..e429173d5 100644 --- a/lib/sharezone_widgets/lib/src/theme/brightness/light_theme.dart +++ b/lib/sharezone_widgets/lib/src/theme/brightness/light_theme.dart @@ -8,94 +8,103 @@ part of 'general_theme.dart'; -final lightTheme = ThemeData( - // Since 3.16 Material 3 became the standard. However, it requires a migration - // from Material 2 to 3 which is the reason why opt-out for now. - // - // Ticket: https://github.com/SharezoneApp/sharezone-app/issues/1159 - useMaterial3: false, +/// Returns the light theme for the app. +/// +/// In golden tests outside of `/app`, it's recommended to override [fontFamily] +/// to [roboto] to because `golden_toolkit` can't load fonts of other packages. +ThemeData getLightTheme({ + String? fontFamily = rubik, +}) { + return ThemeData( + // Since 3.16 Material 3 became the standard. However, it requires a migration + // from Material 2 to 3 which is the reason why opt-out for now. + // + // Ticket: https://github.com/SharezoneApp/sharezone-app/issues/1159 + useMaterial3: false, - // Brightness - brightness: Brightness.light, + // Brightness + brightness: Brightness.light, - // Colors - cardColor: Colors.white, - primaryColor: primaryColor, - scaffoldBackgroundColor: Colors.white, - highlightColor: PlatformCheck.isIOS ? const Color(0x66BCBCBC) : null, - splashColor: PlatformCheck.isIOS ? Colors.transparent : null, + // Colors + cardColor: Colors.white, + primaryColor: primaryColor, + scaffoldBackgroundColor: Colors.white, + highlightColor: PlatformCheck.isIOS ? const Color(0x66BCBCBC) : null, + splashColor: PlatformCheck.isIOS ? Colors.transparent : null, - // Font - fontFamily: rubik, + // Font + fontFamily: fontFamily, - // Theme - tabBarTheme: TabBarTheme( - labelColor: darkBlueColor, - unselectedLabelColor: darkBlueColor.withOpacity(0.45), - ), - appBarTheme: const AppBarTheme( - color: Colors.white, - elevation: 1, - iconTheme: IconThemeData(color: Color(0xFF8da2b6)), - titleTextStyle: TextStyle( + // Theme + tabBarTheme: TabBarTheme( + labelColor: darkBlueColor, + unselectedLabelColor: darkBlueColor.withOpacity(0.45), + ), + appBarTheme: AppBarTheme( + color: Colors.white, + elevation: 1, + iconTheme: const IconThemeData(color: Color(0xFF8da2b6)), + titleTextStyle: TextStyle( color: darkBlueColor, fontWeight: FontWeight.w600, fontSize: 20, - fontFamily: rubik), - ), - floatingActionButtonTheme: const FloatingActionButtonThemeData( - backgroundColor: Colors.redAccent, foregroundColor: Colors.white), - pageTransitionsTheme: _pageTransitionsTheme, - snackBarTheme: _snackBarTheme, - bottomSheetTheme: _bottomSheetTheme, - dialogTheme: _dialogTheme, - checkboxTheme: CheckboxThemeData( - fillColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + fontFamily: fontFamily, + ), + ), + floatingActionButtonTheme: const FloatingActionButtonThemeData( + backgroundColor: Colors.redAccent, foregroundColor: Colors.white), + pageTransitionsTheme: _pageTransitionsTheme, + snackBarTheme: _snackBarTheme, + bottomSheetTheme: _bottomSheetTheme, + dialogTheme: _dialogTheme, + checkboxTheme: CheckboxThemeData( + fillColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return primaryColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return primaryColor; - } - return null; - }), - ), - radioTheme: RadioThemeData( - fillColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + }), + ), + radioTheme: RadioThemeData( + fillColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return primaryColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return primaryColor; - } - return null; - }), - ), - switchTheme: SwitchThemeData( - thumbColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + }), + ), + switchTheme: SwitchThemeData( + thumbColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return primaryColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return primaryColor; - } - return null; - }), - trackColor: - MaterialStateProperty.resolveWith((Set states) { - if (states.contains(MaterialState.disabled)) { + }), + trackColor: MaterialStateProperty.resolveWith( + (Set states) { + if (states.contains(MaterialState.disabled)) { + return null; + } + if (states.contains(MaterialState.selected)) { + return primaryColor; + } return null; - } - if (states.contains(MaterialState.selected)) { - return primaryColor; - } - return null; - }), - ), - colorScheme: ColorScheme.fromSwatch() - .copyWith(secondary: Colors.grey[600], brightness: Brightness.light) - .copyWith(error: Colors.red), -); + }), + ), + colorScheme: ColorScheme.fromSwatch() + .copyWith(secondary: Colors.grey[600], brightness: Brightness.light) + .copyWith(error: Colors.red), + ); +} diff --git a/lib/sharezone_widgets/lib/src/theme/theme.dart b/lib/sharezone_widgets/lib/src/theme/theme.dart index d91eadb33..6a6c7d9ec 100644 --- a/lib/sharezone_widgets/lib/src/theme/theme.dart +++ b/lib/sharezone_widgets/lib/src/theme/theme.dart @@ -9,8 +9,15 @@ import 'package:flutter/material.dart'; import 'package:sharezone_widgets/sharezone_widgets.dart'; +/// The default font family used in the app. const rubik = 'Rubik'; +/// The font family that is used for golden tests outside of `/app`. +/// +/// We can't use [rubik] because `golden_toolkit` can't load fonts of other +/// packages, see https://github.com/eBay/flutter_glove_box/issues/158. +const roboto = 'Roboto'; + const Color accentColor = Colors.redAccent; const Color primaryColor = Color(0xFF68B3E9); const Color darkPrimaryColor = Color(0xFF254D71); diff --git a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_chip_dark.png b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_chip_dark.png index f8057ea1d..c3cbf75f0 100644 Binary files a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_chip_dark.png and b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_chip_dark.png differ diff --git a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_card_dark.png b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_card_dark.png index fcf9a6f24..ca163d4f3 100644 Binary files a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_card_dark.png and b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_card_dark.png differ diff --git a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_dark.png b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_dark.png index 3d39688e9..7f3a82e22 100644 Binary files a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_dark.png and b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_dark.png differ diff --git a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_light.png b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_light.png index 90a0d46cc..df7079cf0 100644 Binary files a/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_light.png and b/lib/sharezone_widgets/test_goldens/sharezone_plus/goldens/sharezone_plus_feature_info_dialog_light.png differ diff --git a/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_feature_info_dialog_test.dart b/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_feature_info_dialog_test.dart index 40acb6e33..f754658a6 100644 --- a/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_feature_info_dialog_test.dart +++ b/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_feature_info_dialog_test.dart @@ -46,8 +46,7 @@ void main() { testGoldens('renders as expected (light mode)', (tester) async { await pumpScaffoldWithButtonForDialog( tester, - theme: ThemeData.light(useMaterial3: false) - .copyWith(primaryColor: primaryColor), + theme: getLightTheme(fontFamily: roboto), ); await openDialog(tester); @@ -59,9 +58,7 @@ void main() { testGoldens('renders as expected (dark mode)', (tester) async { await pumpScaffoldWithButtonForDialog( tester, - theme: ThemeData.dark(useMaterial3: false).copyWith( - primaryColor: primaryColor, - ), + theme: getDarkTheme(fontFamily: roboto), ); await openDialog(tester); diff --git a/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_test.dart b/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_test.dart index 717ac729d..e361bab4d 100644 --- a/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_test.dart +++ b/lib/sharezone_widgets/test_goldens/sharezone_plus/sharezone_plus_test.dart @@ -27,9 +27,7 @@ void main() { testGoldens('renders as expected (light mode)', (tester) async { await pumpSharezonePlusChip( tester, - theme: ThemeData.light(useMaterial3: false).copyWith( - primaryColor: primaryColor, - ), + theme: getLightTheme(fontFamily: roboto), ); await screenMatchesGolden(tester, 'sharezone_plus_chip_light'); @@ -38,14 +36,7 @@ void main() { testGoldens('renders as expected (dark mode)', (tester) async { await pumpSharezonePlusChip( tester, - // We can't use our Sharezone `darkTheme` here because we a custom - // font that is not included in this package and the `golden_toolkit` - // package can't load the font. - // - // See: https://github.com/eBay/flutter_glove_box/issues/158 - theme: ThemeData.dark(useMaterial3: false).copyWith( - primaryColor: primaryColor, - ), + theme: getDarkTheme(fontFamily: roboto), ); await screenMatchesGolden(tester, 'sharezone_plus_chip_dark'); @@ -72,9 +63,7 @@ void main() { testGoldens('renders as expected (light mode)', (tester) async { await pumpSharezonePlusFeatureInfoCard( tester, - theme: ThemeData.light(useMaterial3: false).copyWith( - primaryColor: primaryColor, - ), + theme: getLightTheme(fontFamily: roboto), ); await screenMatchesGolden( @@ -82,13 +71,8 @@ void main() { }); testGoldens('renders as expected (dark mode)', (tester) async { - await pumpSharezonePlusFeatureInfoCard( - tester, - // We can't use our Sharezone `darkTheme` here. See comment above. - theme: ThemeData.dark(useMaterial3: false).copyWith( - primaryColor: primaryColor, - ), - ); + await pumpSharezonePlusFeatureInfoCard(tester, + theme: getDarkTheme(fontFamily: roboto)); await screenMatchesGolden( tester, 'sharezone_plus_feature_info_card_dark');