diff --git a/lib/ente_theme_data.dart b/lib/ente_theme_data.dart index 425f52517..f0d57eaff 100644 --- a/lib/ente_theme_data.dart +++ b/lib/ente_theme_data.dart @@ -1,14 +1,14 @@ -// @dart=2.9 - import 'package:flutter/material.dart'; import 'package:flutter_datetime_picker/flutter_datetime_picker.dart'; +import 'package:photos/theme/colors.dart'; +import 'package:photos/theme/effects.dart'; final lightThemeData = ThemeData( fontFamily: 'Inter', brightness: Brightness.light, - hintColor: Colors.grey, - primaryColor: Colors.deepOrangeAccent, - primaryColorLight: Colors.black54, + hintColor: const Color.fromRGBO(158, 158, 158, 1), + primaryColor: const Color.fromRGBO(255, 110, 64, 1), + primaryColorLight: const Color.fromRGBO(0, 0, 0, 0.541), iconTheme: const IconThemeData(color: Colors.black), primaryIconTheme: const IconThemeData(color: Colors.red, opacity: 1.0, size: 50.0), @@ -18,18 +18,18 @@ final lightThemeData = ThemeData( ), accentColor: const Color.fromRGBO(0, 0, 0, 0.6), outlinedButtonTheme: buildOutlinedButtonThemeData( - bgDisabled: Colors.grey.shade500, - bgEnabled: Colors.black, - fgDisabled: Colors.white, - fgEnabled: Colors.white, + bgDisabled: const Color.fromRGBO(158, 158, 158, 1), + bgEnabled: const Color.fromRGBO(0, 0, 0, 1), + fgDisabled: const Color.fromRGBO(255, 255, 255, 1), + fgEnabled: const Color.fromRGBO(255, 255, 255, 1), ), elevatedButtonTheme: buildElevatedButtonThemeData( - onPrimary: Colors.white, - primary: Colors.black, + onPrimary: const Color.fromRGBO(255, 255, 255, 1), + primary: const Color.fromRGBO(0, 0, 0, 1), ), - toggleableActiveColor: Colors.green[400], - scaffoldBackgroundColor: Colors.white, - backgroundColor: Colors.white, + toggleableActiveColor: const Color.fromRGBO(102, 187, 106, 1), + scaffoldBackgroundColor: const Color.fromRGBO(255, 255, 255, 1), + backgroundColor: const Color.fromRGBO(255, 255, 255, 1), appBarTheme: const AppBarTheme().copyWith( backgroundColor: Colors.white, foregroundColor: Colors.black, @@ -37,7 +37,7 @@ final lightThemeData = ThemeData( elevation: 0, ), //https://api.flutter.dev/flutter/material/TextTheme-class.html - textTheme: _buildTextTheme(Colors.black), + textTheme: _buildTextTheme(const Color.fromRGBO(0, 0, 0, 1)), primaryTextTheme: const TextTheme().copyWith( bodyText2: const TextStyle(color: Colors.yellow), bodyText1: const TextStyle(color: Colors.orange), @@ -72,13 +72,13 @@ final lightThemeData = ThemeData( ), fillColor: MaterialStateProperty.resolveWith((states) { return states.contains(MaterialState.selected) - ? Colors.black - : Colors.white; + ? const Color.fromRGBO(0, 0, 0, 1) + : const Color.fromRGBO(255, 255, 255, 1); }), checkColor: MaterialStateProperty.resolveWith((states) { return states.contains(MaterialState.selected) - ? Colors.white - : Colors.black; + ? const Color.fromRGBO(255, 255, 255, 1) + : const Color.fromRGBO(0, 0, 0, 1); }), ), ); @@ -86,30 +86,30 @@ final lightThemeData = ThemeData( final darkThemeData = ThemeData( fontFamily: 'Inter', brightness: Brightness.dark, - primaryColorLight: Colors.white70, + primaryColorLight: const Color.fromRGBO(255, 255, 255, 0.702), iconTheme: const IconThemeData(color: Colors.white), primaryIconTheme: const IconThemeData(color: Colors.red, opacity: 1.0, size: 50.0), - hintColor: Colors.grey, + hintColor: const Color.fromRGBO(158, 158, 158, 1), colorScheme: const ColorScheme.dark(primary: Colors.white), accentColor: const Color.fromRGBO(45, 194, 98, 0.2), buttonTheme: const ButtonThemeData().copyWith( buttonColor: const Color.fromRGBO(45, 194, 98, 1.0), ), - textTheme: _buildTextTheme(Colors.white), - toggleableActiveColor: Colors.green[400], + textTheme: _buildTextTheme(const Color.fromRGBO(255, 255, 255, 1)), + toggleableActiveColor: const Color.fromRGBO(102, 187, 106, 1), outlinedButtonTheme: buildOutlinedButtonThemeData( - bgDisabled: Colors.grey.shade500, - bgEnabled: Colors.white, - fgDisabled: Colors.white, - fgEnabled: Colors.black, + bgDisabled: const Color.fromRGBO(158, 158, 158, 1), + bgEnabled: const Color.fromRGBO(255, 255, 255, 1), + fgDisabled: const Color.fromRGBO(255, 255, 255, 1), + fgEnabled: const Color.fromRGBO(0, 0, 0, 1), ), elevatedButtonTheme: buildElevatedButtonThemeData( - onPrimary: Colors.black, - primary: Colors.white, + onPrimary: const Color.fromRGBO(0, 0, 0, 1), + primary: const Color.fromRGBO(255, 255, 255, 1), ), - scaffoldBackgroundColor: Colors.black, - backgroundColor: Colors.black, + scaffoldBackgroundColor: const Color.fromRGBO(0, 0, 0, 1), + backgroundColor: const Color.fromRGBO(0, 0, 0, 1), appBarTheme: const AppBarTheme().copyWith( color: Colors.black, elevation: 0, @@ -144,16 +144,16 @@ final darkThemeData = ThemeData( ), fillColor: MaterialStateProperty.resolveWith((states) { if (states.contains(MaterialState.selected)) { - return Colors.grey; + return const Color.fromRGBO(158, 158, 158, 1); } else { - return Colors.black; + return const Color.fromRGBO(0, 0, 0, 1); } }), checkColor: MaterialStateProperty.resolveWith((states) { if (states.contains(MaterialState.selected)) { - return Colors.black; + return const Color.fromRGBO(0, 0, 0, 1); } else { - return Colors.grey; + return const Color.fromRGBO(158, 158, 158, 1); } }), ), @@ -219,20 +219,25 @@ TextTheme _buildTextTheme(Color textColor) { } extension CustomColorScheme on ColorScheme { - Color get defaultBackgroundColor => - brightness == Brightness.light ? Colors.white : Colors.black; + Color get defaultBackgroundColor => brightness == Brightness.light + ? const Color.fromRGBO(255, 255, 255, 1) + : const Color.fromRGBO(0, 0, 0, 1); - Color get defaultTextColor => - brightness == Brightness.light ? Colors.black : Colors.white; + Color get defaultTextColor => brightness == Brightness.light + ? const Color.fromRGBO(0, 0, 0, 1) + : const Color.fromRGBO(255, 255, 255, 1); - Color get inverseTextColor => - brightness == Brightness.light ? Colors.white : Colors.black; + Color get inverseTextColor => brightness == Brightness.light + ? const Color.fromRGBO(255, 255, 255, 1) + : const Color.fromRGBO(0, 0, 0, 1); - Color get inverseIconColor => - brightness == Brightness.light ? Colors.white : Colors.black; + Color get inverseIconColor => brightness == Brightness.light + ? const Color.fromRGBO(255, 255, 255, 1) + : const Color.fromRGBO(0, 0, 0, 1); - Color get inverseBackgroundColor => - brightness == Brightness.light ? Colors.black : Colors.white; + Color get inverseBackgroundColor => brightness == Brightness.light + ? const Color.fromRGBO(0, 0, 0, 1) + : const Color.fromRGBO(255, 255, 255, 1); Color get boxSelectColor => brightness == Brightness.light ? const Color.fromRGBO(67, 186, 108, 1) @@ -244,13 +249,15 @@ extension CustomColorScheme on ColorScheme { Color get greenAlternative => const Color.fromRGBO(45, 194, 98, 1.0); - Color get dynamicFABBackgroundColor => - brightness == Brightness.light ? Colors.black : Colors.grey[850]; + Color get dynamicFABBackgroundColor => brightness == Brightness.light + ? const Color.fromRGBO(0, 0, 0, 1) + : const Color.fromRGBO(48, 48, 48, 1); - Color get dynamicFABTextColor => Colors.white; //same for both themes + Color get dynamicFABTextColor => + const Color.fromRGBO(255, 255, 255, 1); //same for both themes // todo: use brightness == Brightness.light for changing color for dark/light theme - ButtonStyle get optionalActionButtonStyle => buildElevatedButtonThemeData( + ButtonStyle? get optionalActionButtonStyle => buildElevatedButtonThemeData( onPrimary: const Color(0xFF777777), primary: const Color(0xFFF0F0F0), elevation: 0, @@ -265,18 +272,18 @@ extension CustomColorScheme on ColorScheme { : const Color.fromRGBO(48, 48, 48, 0.5); Color get iconColor => brightness == Brightness.light - ? Colors.black.withOpacity(0.75) - : Colors.white; + ? const Color.fromRGBO(0, 0, 0, 1).withOpacity(0.75) + : const Color.fromRGBO(255, 255, 255, 1); Color get bgColorForQuestions => brightness == Brightness.light - ? Colors.white + ? const Color.fromRGBO(255, 255, 255, 1) : const Color.fromRGBO(10, 15, 15, 1.0); Color get greenText => const Color.fromARGB(255, 40, 190, 113); Color get cupertinoPickerTopColor => brightness == Brightness.light ? const Color.fromARGB(255, 238, 238, 238) - : Colors.white.withOpacity(0.1); + : const Color.fromRGBO(255, 255, 255, 1).withOpacity(0.1); DatePickerTheme get dateTimePickertheme => brightness == Brightness.light ? const DatePickerTheme( @@ -315,23 +322,24 @@ extension CustomColorScheme on ColorScheme { : const Color.fromRGBO(20, 20, 20, 1); Color get galleryThumbDrawColor => brightness == Brightness.light - ? Colors.black.withOpacity(0.8) - : Colors.white.withOpacity(0.5); + ? const Color.fromRGBO(0, 0, 0, 1).withOpacity(0.8) + : const Color.fromRGBO(255, 255, 255, 1).withOpacity(0.5); Color get backupEnabledBgColor => brightness == Brightness.light ? const Color.fromRGBO(230, 230, 230, 0.95) : const Color.fromRGBO(10, 40, 40, 0.3); Color get dotsIndicatorActiveColor => brightness == Brightness.light - ? Colors.black.withOpacity(0.5) - : Colors.white.withOpacity(0.5); + ? const Color.fromRGBO(0, 0, 0, 1).withOpacity(0.5) + : const Color.fromRGBO(255, 255, 255, 1).withOpacity(0.5); Color get dotsIndicatorInactiveColor => brightness == Brightness.light - ? Colors.black.withOpacity(0.12) - : Colors.white.withOpacity(0.12); + ? const Color.fromRGBO(0, 0, 0, 1).withOpacity(0.12) + : const Color.fromRGBO(255, 255, 255, 1).withOpacity(0.12); - Color get toastTextColor => - brightness == Brightness.light ? Colors.white : Colors.black; + Color get toastTextColor => brightness == Brightness.light + ? const Color.fromRGBO(255, 255, 255, 1) + : const Color.fromRGBO(0, 0, 0, 1); Color get toastBackgroundColor => brightness == Brightness.light ? const Color.fromRGBO(24, 24, 24, 0.95) @@ -342,15 +350,16 @@ extension CustomColorScheme on ColorScheme { : const Color.fromRGBO(100, 100, 100, 1); Color get themeSwitchIndicatorColor => brightness == Brightness.light - ? Colors.black.withOpacity(0.75) - : Colors.white; + ? const Color.fromRGBO(0, 0, 0, 1).withOpacity(0.75) + : const Color.fromRGBO(255, 255, 255, 1); - Color get themeSwitchActiveIconColor => - brightness == Brightness.light ? Colors.white : Colors.black; + Color get themeSwitchActiveIconColor => brightness == Brightness.light + ? const Color.fromRGBO(255, 255, 255, 1) + : const Color.fromRGBO(0, 0, 0, 1); Color get themeSwitchInactiveIconColor => brightness == Brightness.light - ? Colors.black.withOpacity(0.5) - : Colors.white.withOpacity(0.5); + ? const Color.fromRGBO(0, 0, 0, 1).withOpacity(0.5) + : const Color.fromRGBO(255, 255, 255, 1).withOpacity(0.5); Color get searchResultsColor => brightness == Brightness.light ? const Color.fromRGBO(245, 245, 245, 1.0) @@ -364,35 +373,18 @@ extension CustomColorScheme on ColorScheme { ? Colors.black.withOpacity(0.32) : Colors.black.withOpacity(0.64); - Color get fillFaint => brightness == Brightness.light - ? Colors.white.withOpacity(0.04) - : Colors.black.withOpacity(0.12); - Color get warning500 => const Color.fromRGBO(255, 101, 101, 1); + Color get fillFaint => + brightness == Brightness.light ? fillFaintLight : fillFaintDark; - List get shadowMenu => brightness == Brightness.light - ? [ - BoxShadow(blurRadius: 6, color: Colors.white.withOpacity(0.16)), - BoxShadow( - blurRadius: 6, - color: Colors.white.withOpacity(0.12), - offset: const Offset(0, 3), - ), - ] - : [ - BoxShadow(blurRadius: 6, color: Colors.black.withOpacity(0.50)), - BoxShadow( - blurRadius: 6, - color: Colors.black.withOpacity(0.25), - offset: const Offset(0, 3), - ), - ]; + List get shadowMenu => + brightness == Brightness.light ? shadowMenuLight : shadowMenuDark; } OutlinedButtonThemeData buildOutlinedButtonThemeData({ - Color bgDisabled, - Color bgEnabled, - Color fgDisabled, - Color fgEnabled, + required Color bgDisabled, + required Color bgEnabled, + required Color fgDisabled, + required Color fgEnabled, }) { return OutlinedButtonThemeData( style: OutlinedButton.styleFrom( @@ -429,8 +421,8 @@ OutlinedButtonThemeData buildOutlinedButtonThemeData({ } ElevatedButtonThemeData buildElevatedButtonThemeData({ - @required Color onPrimary, // text button color - @required Color primary, + required Color onPrimary, // text button color + required Color primary, double elevation = 2, // background color of button }) { return ElevatedButtonThemeData( diff --git a/lib/services/notification_service.dart b/lib/services/notification_service.dart index 1ff160970..5ad7cd5bb 100644 --- a/lib/services/notification_service.dart +++ b/lib/services/notification_service.dart @@ -1,5 +1,3 @@ -// @dart=2.9 - import 'dart:io'; import 'package:flutter_local_notifications/flutter_local_notifications.dart'; @@ -28,7 +26,7 @@ class NotificationService { ); } - Future selectNotification(String payload) async {} + Future selectNotification(String? payload) async {} Future showNotification(String title, String message) async { if (!Platform.isAndroid) { diff --git a/lib/theme/colors.dart b/lib/theme/colors.dart new file mode 100644 index 000000000..b0d0d04ac --- /dev/null +++ b/lib/theme/colors.dart @@ -0,0 +1,59 @@ +import 'dart:ui'; + +import 'package:flutter/material.dart'; + +// Background Colors +const Color backgroundBaseLight = Color.fromRGBO(255, 255, 255, 1); +const Color backgroundElevatedLight = Color.fromRGBO(255, 255, 255, 1); +const Color backgroundElevated2Light = Color.fromRGBO(251, 251, 251, 1); + +const Color backgroundBaseDark = Color.fromRGBO(0, 0, 0, 1); +const Color backgroundElevatedDark = Color.fromRGBO(27, 27, 27, 1); +const Color backgroundElevated2Dark = Color.fromRGBO(37, 37, 37, 1); + +// Backdrop Colors +const Color backdropBaseLight = Color.fromRGBO(255, 255, 255, 0.75); +const Color backdropBaseMuteLight = Color.fromRGBO(255, 255, 255, 0.30); + +const Color backdropBaseDark = Color.fromRGBO(0, 0, 0, 0.65); +const Color backdropBaseMuteDark = Color.fromRGBO(0, 0, 0, 0.20); + +// Text Colors +const Color textBaseLight = Color.fromRGBO(0, 0, 0, 1); +const Color textMutedLight = Color.fromRGBO(0, 0, 0, 0.6); +const Color textFaintLight = Color.fromRGBO(0, 0, 0, 0.5); + +const Color textBaseDark = Color.fromRGBO(255, 255, 255, 1); +const Color textMutedDark = Color.fromRGBO(255, 255, 255, 0.7); +const Color textFaintDark = Color.fromRGBO(255, 255, 255, 0.5); + +// Fill Colors +const Color fillBaseLight = Color.fromRGBO(0, 0, 0, 1); +const Color fillMutedLight = Color.fromRGBO(0, 0, 0, 0.12); +const Color fillFaintLight = Color.fromRGBO(0, 0, 0, 0.04); + +const Color fillBaseDark = Color.fromRGBO(255, 255, 255, 1); +const Color fillMutedDark = Color.fromRGBO(255, 255, 255, 0.16); +const Color fillFaintDark = Color.fromRGBO(255, 255, 255, 0.12); + +// Stroke Colors +const Color strokeBaseLight = Color.fromRGBO(0, 0, 0, 1); +const Color strokeMutedLight = Color.fromRGBO(0, 0, 0, 0.24); +const Color strokeFaintLight = Color.fromRGBO(0, 0, 0, 0.04); + +const Color strokeBaseDark = Color.fromRGBO(255, 255, 255, 1); +const Color strokeMutedDark = Color.fromRGBO(255, 255, 255, 0.24); +const Color strokeFaintDark = Color.fromRGBO(255, 255, 255, 0.16); + +// Fixed Colors + +const Color primary700 = Color.fromRGBO(0, 179, 60, 1); +const Color primary500 = Color.fromRGBO(29, 185, 84, 1); +const Color primary400 = Color.fromRGBO(38, 203, 95, 1); +const Color primary300 = Color.fromRGBO(1, 222, 77, 1); + +const Color warning700 = Color.fromRGBO(234, 63, 63, 1); +const Color warning500 = Color.fromRGBO(255, 101, 101, 1); +const Color warning400 = Color.fromRGBO(255, 111, 111, 1); + +const Color caution500 = Color.fromRGBO(255, 194, 71, 1); diff --git a/lib/theme/effects.dart b/lib/theme/effects.dart new file mode 100644 index 000000000..15d5a5b96 --- /dev/null +++ b/lib/theme/effects.dart @@ -0,0 +1,51 @@ +import 'package:flutter/material.dart'; + +List shadowFloatLight = const [ + BoxShadow(blurRadius: 10, color: Color.fromRGBO(0, 0, 0, 0.25)), +]; + +List shadowMenuLight = const [ + BoxShadow(blurRadius: 6, color: Color.fromRGBO(0, 0, 0, 0.16)), + BoxShadow( + blurRadius: 6, + color: Color.fromRGBO(0, 0, 0, 0.12), + offset: Offset(0, 3), + ), +]; + +List shadowButtonLight = const [ + BoxShadow( + blurRadius: 4, + color: Color.fromRGBO(0, 0, 0, 0.25), + offset: Offset(0, 4), + ), +]; + +List shadowFloatDark = const [ + BoxShadow( + blurRadius: 12, + color: Color.fromRGBO(0, 0, 0, 0.75), + offset: Offset(0, 2), + ), +]; + +List shadowMenuDark = const [ + BoxShadow(blurRadius: 6, color: Color.fromRGBO(0, 0, 0, 0.50)), + BoxShadow( + blurRadius: 6, + color: Color.fromRGBO(0, 0, 0, 0.25), + offset: Offset(0, 3), + ), +]; + +List shadowButtonDark = const [ + BoxShadow( + blurRadius: 4, + color: Color.fromRGBO(0, 0, 0, 0.75), + offset: Offset(0, 4), + ), +]; + +const blurBase = 96; +const blurMuted = 48; +const blurFaint = 24; diff --git a/lib/ui/common/gradient_button.dart b/lib/ui/common/gradient_button.dart index 061b2ccae..b410c4e0a 100644 --- a/lib/ui/common/gradient_button.dart +++ b/lib/ui/common/gradient_button.dart @@ -21,7 +21,7 @@ class GradientButton extends StatelessWidget { Color(0xFF1DB954), ], this.onTap, - this.text, + this.text = '', this.iconData, this.paddingValue = 0.0, }) : super(key: key); diff --git a/lib/ui/common/loading_widget.dart b/lib/ui/common/loading_widget.dart index 80d940947..8c84dae5e 100644 --- a/lib/ui/common/loading_widget.dart +++ b/lib/ui/common/loading_widget.dart @@ -1,9 +1,7 @@ -// @dart=2.9 - import 'package:flutter/cupertino.dart'; class EnteLoadingWidget extends StatelessWidget { - const EnteLoadingWidget({Key key}) : super(key: key); + const EnteLoadingWidget({Key? key}) : super(key: key); @override Widget build(BuildContext context) { diff --git a/lib/ui/components/notification_warning_widget.dart b/lib/ui/components/notification_warning_widget.dart index 69e59db51..e7aaa44a0 100644 --- a/lib/ui/components/notification_warning_widget.dart +++ b/lib/ui/components/notification_warning_widget.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:photos/ente_theme_data.dart'; +import 'package:photos/theme/colors.dart'; class NotificationWarningWidget extends StatelessWidget { final IconData warningIcon; @@ -28,7 +29,7 @@ class NotificationWarningWidget extends StatelessWidget { Radius.circular(8), ), boxShadow: Theme.of(context).colorScheme.shadowMenu, - color: Theme.of(context).colorScheme.warning500, + color: warning500, ), child: Padding( padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 10), diff --git a/lib/utils/hex.dart b/lib/utils/hex.dart index 887dafa54..efe0b8c6a 100644 --- a/lib/utils/hex.dart +++ b/lib/utils/hex.dart @@ -1,5 +1,3 @@ -// @dart=2.9 - import "dart:convert"; import "dart:typed_data"; diff --git a/lib/utils/toast_util.dart b/lib/utils/toast_util.dart index 00bafb915..ec21ced86 100644 --- a/lib/utils/toast_util.dart +++ b/lib/utils/toast_util.dart @@ -1,5 +1,3 @@ -// @dart=2.9 - import 'dart:io'; import 'package:flutter/material.dart'; @@ -7,7 +5,7 @@ import 'package:flutter_easyloading/flutter_easyloading.dart'; import 'package:fluttertoast/fluttertoast.dart'; import 'package:photos/ente_theme_data.dart'; -Future showToast( +Future showToast( BuildContext context, String message, { toastLength = Toast.LENGTH_LONG, diff --git a/lib/utils/validator_util.dart b/lib/utils/validator_util.dart index 0e5b6952d..2ab3aeca7 100644 --- a/lib/utils/validator_util.dart +++ b/lib/utils/validator_util.dart @@ -1,5 +1,3 @@ -// @dart=2.9 - import 'dart:convert'; import 'dart:typed_data'; @@ -9,9 +7,9 @@ import 'package:photos/models/key_attributes.dart'; Logger _logger = Logger("Validator"); void validatePreVerificationStateCheck( - KeyAttributes keyAttr, - String password, - String encryptedToken, + KeyAttributes? keyAttr, + String? password, + String? encryptedToken, ) { nullOrEmptyArgCheck(encryptedToken, "encryptedToken"); nullOrEmptyArgCheck(password, "userPassword"); @@ -27,12 +25,12 @@ void validatePreVerificationStateCheck( "secretKeyDecryptionNonce", ); nullOrEmptyArgCheck(keyAttr.publicKey, "publicKey"); - if ((keyAttr.memLimit ?? 0) <= 0 || (keyAttr.opsLimit ?? 0) <= 0) { - throw ArgumentError("Key mem/OpsLimit can not be null or <0"); + if (keyAttr.memLimit <= 0 || keyAttr.opsLimit <= 0) { + throw ArgumentError("Key mem/OpsLimit can not be <0"); } // check password encoding issues try { - final Uint8List passwordL = utf8.encode(password); + final Uint8List passwordL = utf8.encode(password!) as Uint8List; try { utf8.decode(passwordL); } catch (e) { @@ -45,7 +43,7 @@ void validatePreVerificationStateCheck( } } -void nullOrEmptyArgCheck(String value, String name) { +void nullOrEmptyArgCheck(String? value, String name) { if (value == null || value.isEmpty) { throw ArgumentError("Critical: $name is nullOrEmpty"); }