From 3053c0f3fb81b0ec1148355dda19df6097a7e638 Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Thu, 10 Dec 2020 19:53:40 +0200 Subject: [PATCH 01/10] CAKE-207 | changed Themes class; removed isDarkTheme from settings store and screens; added currentTheme to settings store; changed SwitcherListItem to PickerListItem for themes in the settings_view_model.dart; created item_from_theme.dart; changed currentDarkTheme property on currentTheme in the preferences_key.dart; applied themes to keyboard bar color in the exchange_page.dart, receive_page.dart, send_page.dart and send_template_page.dart; applied itemFromTheme() to new_wallet_page.dart, new_wallet_type_page.dart, pre_seed_page.dart, wallet_seed_page.dart, seed_language_page.dart, welcome_page.dart, base_page.dart and main.dart --- lib/entities/item_from_theme.dart | 17 + lib/entities/preferences_key.dart | 2 +- lib/main.dart | 18 +- lib/palette.dart | 2 + lib/src/screens/base_page.dart | 46 +- lib/src/screens/exchange/exchange_page.dart | 5 +- .../screens/new_wallet/new_wallet_page.dart | 29 +- .../new_wallet/new_wallet_type_page.dart | 29 +- lib/src/screens/receive/receive_page.dart | 5 +- lib/src/screens/seed/pre_seed_page.dart | 13 +- lib/src/screens/seed/wallet_seed_page.dart | 12 +- .../seed_language/seed_language_page.dart | 34 +- lib/src/screens/send/send_page.dart | 5 +- lib/src/screens/send/send_template_page.dart | 5 +- lib/src/screens/welcome/welcome_page.dart | 21 +- lib/store/settings_store.dart | 20 +- lib/themes.dart | 729 ++++++++++-------- .../settings/settings_view_model.dart | 15 +- 18 files changed, 575 insertions(+), 432 deletions(-) create mode 100644 lib/entities/item_from_theme.dart diff --git a/lib/entities/item_from_theme.dart b/lib/entities/item_from_theme.dart new file mode 100644 index 000000000..94f4db1f7 --- /dev/null +++ b/lib/entities/item_from_theme.dart @@ -0,0 +1,17 @@ +import 'package:cake_wallet/themes.dart'; +import 'package:flutter/material.dart'; + +dynamic itemFromTheme({ + @required Themes currentTheme, + @required Map items}) { + switch (currentTheme) { + case Themes.light: + return items[Themes.light]; + case Themes.bright: + return items[Themes.bright]; + case Themes.dark: + return items[Themes.dark]; + default: + return items[Themes.light]; + } +} \ No newline at end of file diff --git a/lib/entities/preferences_key.dart b/lib/entities/preferences_key.dart index 53d59460a..f9bf224f8 100644 --- a/lib/entities/preferences_key.dart +++ b/lib/entities/preferences_key.dart @@ -9,7 +9,7 @@ class PreferencesKey { static const shouldSaveRecipientAddressKey = 'save_recipient_address'; static const allowBiometricalAuthenticationKey = 'allow_biometrical_authentication'; - static const currentDarkTheme = 'dark_theme'; + static const currentTheme = 'current_theme'; static const displayActionListModeKey = 'display_list_mode'; static const currentPinLength = 'current_pin_length'; static const currentLanguageCode = 'language_code'; diff --git a/lib/main.dart b/lib/main.dart index 9cd55e054..3f72adcba 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,3 +1,5 @@ +import 'package:cake_wallet/entities/item_from_theme.dart'; +import 'package:cake_wallet/themes.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:hive/hive.dart'; @@ -123,16 +125,20 @@ class App extends StatelessWidget { @override Widget build(BuildContext context) { final settingsStore = getIt.get().settingsStore; - - if (settingsStore.theme == null) { - settingsStore.isDarkTheme = false; - } + final currentTheme = settingsStore.currentTheme ?? Themes.light; + final Map items = { + Themes.light: Brightness.dark, + Themes.bright: Brightness.dark, + Themes.dark: Brightness.light + }; final statusBarColor = Colors.transparent; final statusBarBrightness = - settingsStore.isDarkTheme ? Brightness.light : Brightness.dark; + itemFromTheme(currentTheme: currentTheme, items: items) as Brightness + ?? Brightness.dark; final statusBarIconBrightness = - settingsStore.isDarkTheme ? Brightness.light : Brightness.dark; + itemFromTheme(currentTheme: currentTheme, items: items) as Brightness + ?? Brightness.dark; final authenticationStore = getIt.get(); final initialRoute = authenticationStore.state == AuthenticationState.denied ? Routes.disclaimer diff --git a/lib/palette.dart b/lib/palette.dart index f9d0a1e3c..5558df381 100644 --- a/lib/palette.dart +++ b/lib/palette.dart @@ -43,6 +43,7 @@ class Palette { static const Color alizarinRed = Color.fromRGBO(233, 45, 45, 1.0); static const Color moderateSlateBlue = Color.fromRGBO(129, 93, 251, 1.0); static const Color brightOrange = Color.fromRGBO(255, 102, 0, 1.0); + static const Color dullGray = Color.fromRGBO(98, 98, 98, 1.0); // FIXME: Rename. static const Color eee = Color.fromRGBO(236, 239, 245, 1.0); @@ -94,6 +95,7 @@ class PaletteDark { static const Color deepVioletBlue = Color.fromRGBO(52, 66, 104, 1.0); static const Color lightPurpleBlue = Color.fromRGBO(120, 133, 170, 1.0); static const Color indicatorVioletBlue = Color.fromRGBO(59, 72, 119, 1.0); + static const Color granite = Color.fromRGBO(48, 51, 60, 1.0); // FIXME: Rename. static const Color eee = Color.fromRGBO(236, 239, 245, 1.0); diff --git a/lib/src/screens/base_page.dart b/lib/src/screens/base_page.dart index b34cb7310..d7e567da8 100644 --- a/lib/src/screens/base_page.dart +++ b/lib/src/screens/base_page.dart @@ -1,3 +1,5 @@ +import 'package:cake_wallet/entities/item_from_theme.dart'; +import 'package:cake_wallet/themes.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; @@ -9,13 +11,19 @@ enum AppBarStyle { regular, withShadow, transparent } abstract class BasePage extends StatelessWidget { BasePage() - : _scaffoldKey = GlobalKey(), - _closeButtonImage = Image.asset('assets/images/close_button.png'), - _closeButtonImageDarkTheme = - Image.asset('assets/images/close_button_dark_theme.png'); + : _scaffoldKey = GlobalKey(); final GlobalKey _scaffoldKey; - final Image _closeButtonImage; - final Image _closeButtonImageDarkTheme; + + static final Image closeButtonImage = + Image.asset('assets/images/close_button.png'); + static final Image closeButtonImageDarkTheme = + Image.asset('assets/images/close_button_dark_theme.png'); + + final Map buttonItems = { + Themes.light: closeButtonImage, + Themes.bright: closeButtonImage, + Themes.dark: closeButtonImageDarkTheme + }; String get title => null; @@ -37,7 +45,7 @@ abstract class BasePage extends StatelessWidget { Widget Function(BuildContext, Widget) get rootWrapper => null; - bool get isDarkTheme => getIt.get().isDarkTheme; + Themes get currentTheme => getIt.get().currentTheme; void onOpenEndDrawer() => _scaffoldKey.currentState.openEndDrawer(); @@ -52,7 +60,8 @@ abstract class BasePage extends StatelessWidget { color: titleColor ?? Theme.of(context).primaryTextTheme.title.color, size: 16,); final _closeButton = - isDarkTheme ? _closeButtonImageDarkTheme : _closeButtonImage; + itemFromTheme(currentTheme: currentTheme, items: buttonItems) as Image + ?? closeButtonImage; return SizedBox( height: 37, @@ -88,8 +97,7 @@ abstract class BasePage extends StatelessWidget { Widget floatingActionButton(BuildContext context) => null; ObstructingPreferredSizeWidget appBar(BuildContext context) { - final appBarColor = - isDarkTheme ? backgroundDarkColor : backgroundLightColor; + final appBarColor = _setBackgroundColor(); switch (appBarStyle) { case AppBarStyle.regular: @@ -131,10 +139,11 @@ abstract class BasePage extends StatelessWidget { @override Widget build(BuildContext context) { + final _backgroundColor = _setBackgroundColor(); + final root = Scaffold( key: _scaffoldKey, - backgroundColor: - isDarkTheme ? backgroundDarkColor : backgroundLightColor, + backgroundColor: _backgroundColor, resizeToAvoidBottomPadding: resizeToAvoidBottomPadding, extendBodyBehindAppBar: extendBodyBehindAppBar, endDrawer: endDrawer, @@ -144,4 +153,17 @@ abstract class BasePage extends StatelessWidget { return rootWrapper?.call(context, root) ?? root; } + + Color _setBackgroundColor() { + switch (currentTheme) { + case Themes.light: + return backgroundLightColor; + case Themes.bright: + return backgroundLightColor; + case Themes.dark: + return backgroundDarkColor; + default: + return backgroundLightColor; + } + } } diff --git a/lib/src/screens/exchange/exchange_page.dart b/lib/src/screens/exchange/exchange_page.dart index e3260c91a..e085d7880 100644 --- a/lib/src/screens/exchange/exchange_page.dart +++ b/lib/src/screens/exchange/exchange_page.dart @@ -95,9 +95,8 @@ class ExchangePage extends BasePage { return KeyboardActions( config: KeyboardActionsConfig( keyboardActionsPlatform: KeyboardActionsPlatform.IOS, - keyboardBarColor: isDarkTheme - ? Color.fromRGBO(48, 51, 60, 1.0) - : Color.fromRGBO(98, 98, 98, 1.0), + keyboardBarColor: Theme.of(context).accentTextTheme.body2 + .backgroundColor, nextFocus: false, actions: [ KeyboardActionsItem( diff --git a/lib/src/screens/new_wallet/new_wallet_page.dart b/lib/src/screens/new_wallet/new_wallet_page.dart index 33a20793e..1f3eb8a3e 100644 --- a/lib/src/screens/new_wallet/new_wallet_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_page.dart @@ -1,6 +1,4 @@ -import 'package:cake_wallet/di.dart'; import 'package:cake_wallet/routes.dart'; -import 'package:cake_wallet/store/settings_store.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:mobx/mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; @@ -16,23 +14,37 @@ import 'package:cake_wallet/src/screens/seed_language/widgets/seed_language_pick import 'package:cake_wallet/src/widgets/alert_with_one_action.dart'; import 'package:cake_wallet/core/execution_state.dart'; import 'package:cake_wallet/view_model/wallet_new_vm.dart'; +import 'package:cake_wallet/themes.dart'; +import 'package:cake_wallet/entities/item_from_theme.dart'; class NewWalletPage extends BasePage { NewWalletPage(this._walletNewVM); final WalletNewVM _walletNewVM; + static final walletNameImage = Image.asset('assets/images/wallet_name.png'); + static final walletNameLightImage = + Image.asset('assets/images/wallet_name_light.png'); + final Map items = { + Themes.light: walletNameLightImage, + Themes.bright: walletNameLightImage, + Themes.dark: walletNameImage + }; + @override String get title => S.current.new_wallet; @override - Widget body(BuildContext context) => WalletNameForm(_walletNewVM); + Widget body(BuildContext context) => WalletNameForm(_walletNewVM, + itemFromTheme(currentTheme: currentTheme, items: items) as Image + ?? walletNameLightImage); } class WalletNameForm extends StatefulWidget { - WalletNameForm(this._walletNewVM); + WalletNameForm(this._walletNewVM, this.walletImage); final WalletNewVM _walletNewVM; + final Image walletImage; @override _WalletNameFormState createState() => _WalletNameFormState(_walletNewVM); @@ -43,9 +55,6 @@ class _WalletNameFormState extends State { static const aspectRatioImage = 1.22; - final walletNameImage = Image.asset('assets/images/wallet_name.png'); - final walletNameLightImage = - Image.asset('assets/images/wallet_name_light.png'); final _formKey = GlobalKey(); final _languageSelectorKey = GlobalKey(); ReactionDisposer _stateReaction; @@ -78,10 +87,6 @@ class _WalletNameFormState extends State { @override Widget build(BuildContext context) { - final walletImage = getIt.get().isDarkTheme - ? walletNameImage - : walletNameLightImage; - return Container( padding: EdgeInsets.only(top: 24), child: ScrollableWithBottomSection( @@ -92,7 +97,7 @@ class _WalletNameFormState extends State { padding: EdgeInsets.only(left: 12, right: 12), child: AspectRatio( aspectRatio: aspectRatioImage, - child: FittedBox(child: walletImage, fit: BoxFit.fill)), + child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)), ), Padding( padding: EdgeInsets.only(top: 24), diff --git a/lib/src/screens/new_wallet/new_wallet_type_page.dart b/lib/src/screens/new_wallet/new_wallet_type_page.dart index cf3b3b896..e984f7ad5 100644 --- a/lib/src/screens/new_wallet/new_wallet_type_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_type_page.dart @@ -1,6 +1,5 @@ -import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/entities/wallet_type.dart'; -import 'package:cake_wallet/store/settings_store.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:cake_wallet/generated/i18n.dart'; @@ -8,6 +7,7 @@ import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; import 'package:cake_wallet/src/screens/new_wallet/widgets/select_button.dart'; +import 'package:cake_wallet/themes.dart'; class NewWalletTypePage extends BasePage { NewWalletTypePage({this.onTypeSelected, this.isNewWallet = true}); @@ -15,6 +15,15 @@ class NewWalletTypePage extends BasePage { final void Function(BuildContext, WalletType) onTypeSelected; final bool isNewWallet; + static final walletTypeImage = Image.asset('assets/images/wallet_type.png'); + static final walletTypeLightImage = + Image.asset('assets/images/wallet_type_light.png'); + final Map items = { + Themes.light: walletTypeLightImage, + Themes.bright: walletTypeLightImage, + Themes.dark: walletTypeImage + }; + @override String get title => isNewWallet ? S.current.new_wallet @@ -22,13 +31,18 @@ class NewWalletTypePage extends BasePage { @override Widget body(BuildContext context) => - WalletTypeForm(onTypeSelected: onTypeSelected); + WalletTypeForm( + onTypeSelected: onTypeSelected, + walletImage: + itemFromTheme(currentTheme: currentTheme, items: items) as Image + ?? walletTypeLightImage); } class WalletTypeForm extends StatefulWidget { - WalletTypeForm({this.onTypeSelected}); + WalletTypeForm({this.onTypeSelected, this.walletImage}); final void Function(BuildContext, WalletType) onTypeSelected; + final Image walletImage; @override WalletTypeFormState createState() => WalletTypeFormState(); @@ -41,8 +55,6 @@ class WalletTypeFormState extends State { Image.asset('assets/images/monero_logo.png', height: 24, width: 24); final bitcoinIcon = Image.asset('assets/images/bitcoin.png', height: 24, width: 24); - final walletTypeImage = Image.asset('assets/images/wallet_type.png'); - final walletTypeLightImage = Image.asset('assets/images/wallet_type_light.png'); WalletType selected; List types; @@ -55,9 +67,6 @@ class WalletTypeFormState extends State { @override Widget build(BuildContext context) { - final walletImage = getIt.get().isDarkTheme - ? walletTypeImage : walletTypeLightImage; - return Container( padding: EdgeInsets.only(top: 24), child: ScrollableWithBottomSection( @@ -69,7 +78,7 @@ class WalletTypeFormState extends State { padding: EdgeInsets.only(left: 12, right: 12), child: AspectRatio( aspectRatio: aspectRatioImage, - child: FittedBox(child: walletImage, fit: BoxFit.fill)), + child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)), ), Padding( padding: EdgeInsets.only(top: 48), diff --git a/lib/src/screens/receive/receive_page.dart b/lib/src/screens/receive/receive_page.dart index 5126a1527..c03bf36c7 100644 --- a/lib/src/screens/receive/receive_page.dart +++ b/lib/src/screens/receive/receive_page.dart @@ -74,9 +74,8 @@ class ReceivePage extends BasePage { return KeyboardActions( config: KeyboardActionsConfig( keyboardActionsPlatform: KeyboardActionsPlatform.IOS, - keyboardBarColor: isDarkTheme - ? Color.fromRGBO(48, 51, 60, 1.0) - : Color.fromRGBO(98, 98, 98, 1.0), + keyboardBarColor: Theme.of(context).accentTextTheme.body2 + .backgroundColor, nextFocus: false, actions: [ KeyboardActionsItem( diff --git a/lib/src/screens/seed/pre_seed_page.dart b/lib/src/screens/seed/pre_seed_page.dart index b9ea48eae..4f63c5a79 100644 --- a/lib/src/screens/seed/pre_seed_page.dart +++ b/lib/src/screens/seed/pre_seed_page.dart @@ -1,16 +1,22 @@ -import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/routes.dart'; -import 'package:cake_wallet/store/settings_store.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; +import 'package:cake_wallet/themes.dart'; class PreSeedPage extends BasePage { static final imageLight = Image.asset('assets/images/pre_seed_light.png'); static final imageDark = Image.asset('assets/images/pre_seed_dark.png'); + final Map items = { + Themes.light: imageLight, + Themes.bright: imageLight, + Themes.dark: imageDark + }; + @override Widget leading(BuildContext context) => null; @@ -20,7 +26,8 @@ class PreSeedPage extends BasePage { @override Widget body(BuildContext context) { final image = - getIt.get().isDarkTheme ? imageDark : imageLight; + itemFromTheme(currentTheme: currentTheme, items: items) as Image + ?? imageLight; return WillPopScope( onWillPop: () async => false, diff --git a/lib/src/screens/seed/wallet_seed_page.dart b/lib/src/screens/seed/wallet_seed_page.dart index 0e47ee676..135ca9c46 100644 --- a/lib/src/screens/seed/wallet_seed_page.dart +++ b/lib/src/screens/seed/wallet_seed_page.dart @@ -1,7 +1,6 @@ -import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/palette.dart'; import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart'; -import 'package:cake_wallet/store/settings_store.dart'; import 'package:cake_wallet/utils/show_bar.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:flutter/cupertino.dart'; @@ -13,12 +12,18 @@ import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/view_model/wallet_seed_view_model.dart'; +import 'package:cake_wallet/themes.dart'; class WalletSeedPage extends BasePage { WalletSeedPage(this.walletSeedViewModel, {@required this.isNewWalletCreated}); static final imageLight = Image.asset('assets/images/crypto_lock_light.png'); static final imageDark = Image.asset('assets/images/crypto_lock.png'); + final Map items = { + Themes.light: imageLight, + Themes.bright: imageLight, + Themes.dark: imageDark + }; @override String get title => S.current.seed_title; @@ -84,7 +89,8 @@ class WalletSeedPage extends BasePage { @override Widget body(BuildContext context) { final image = - getIt.get().isDarkTheme ? imageDark : imageLight; + itemFromTheme(currentTheme: currentTheme, items: items) as Image + ?? imageLight; return WillPopScope(onWillPop: () async => false, child: Container( padding: EdgeInsets.all(24), diff --git a/lib/src/screens/seed_language/seed_language_page.dart b/lib/src/screens/seed_language/seed_language_page.dart index 701b5dccc..d6d5580ee 100644 --- a/lib/src/screens/seed_language/seed_language_page.dart +++ b/lib/src/screens/seed_language/seed_language_page.dart @@ -1,6 +1,5 @@ -import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/src/widgets/seed_language_selector.dart'; -import 'package:cake_wallet/store/settings_store.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; @@ -9,23 +8,39 @@ import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; import 'package:cake_wallet/src/screens/seed_language/widgets/seed_language_picker.dart'; +import 'package:cake_wallet/themes.dart'; class SeedLanguage extends BasePage { SeedLanguage({this.onConfirm}); final Function(BuildContext, String) onConfirm; + static final walletNameImage = Image.asset('assets/images/wallet_name.png'); + static final walletNameLightImage = + Image.asset('assets/images/wallet_name_light.png'); + final Map items = { + Themes.light: walletNameLightImage, + Themes.bright: walletNameLightImage, + Themes.dark: walletNameImage + }; + @override String get title => S.current.wallet_list_restore_wallet; @override - Widget body(BuildContext context) => SeedLanguageForm(onConfirm: onConfirm); + Widget body(BuildContext context) => + SeedLanguageForm( + onConfirm: onConfirm, + walletImage: + itemFromTheme(currentTheme: currentTheme, items: items) as Image + ?? walletNameLightImage); } class SeedLanguageForm extends StatefulWidget { - SeedLanguageForm({this.onConfirm}); + SeedLanguageForm({this.onConfirm, this.walletImage}); final Function(BuildContext, String) onConfirm; + final Image walletImage; @override SeedLanguageFormState createState() => SeedLanguageFormState(); @@ -33,18 +48,10 @@ class SeedLanguageForm extends StatefulWidget { class SeedLanguageFormState extends State { static const aspectRatioImage = 1.22; - - final walletNameImage = Image.asset('assets/images/wallet_name.png'); - final walletNameLightImage = - Image.asset('assets/images/wallet_name_light.png'); final _languageSelectorKey = GlobalKey(); @override Widget build(BuildContext context) { - final walletImage = getIt.get().isDarkTheme - ? walletNameImage - : walletNameLightImage; - return Container( padding: EdgeInsets.only(top: 24), child: ScrollableWithBottomSection( @@ -55,7 +62,8 @@ class SeedLanguageFormState extends State { padding: EdgeInsets.only(left: 12, right: 12), child: AspectRatio( aspectRatio: aspectRatioImage, - child: FittedBox(child: walletImage, fit: BoxFit.fill)), + child: FittedBox(child: widget.walletImage, + fit: BoxFit.fill)), ), Padding( padding: EdgeInsets.only(top: 40), diff --git a/lib/src/screens/send/send_page.dart b/lib/src/screens/send/send_page.dart index cd4c5b06d..50fb14d04 100644 --- a/lib/src/screens/send/send_page.dart +++ b/lib/src/screens/send/send_page.dart @@ -83,9 +83,8 @@ class SendPage extends BasePage { return KeyboardActions( config: KeyboardActionsConfig( keyboardActionsPlatform: KeyboardActionsPlatform.IOS, - keyboardBarColor: isDarkTheme - ? Color.fromRGBO(48, 51, 60, 1.0) - : Color.fromRGBO(98, 98, 98, 1.0), + keyboardBarColor: Theme.of(context).accentTextTheme.body2 + .backgroundColor, nextFocus: false, actions: [ KeyboardActionsItem( diff --git a/lib/src/screens/send/send_template_page.dart b/lib/src/screens/send/send_template_page.dart index b53117309..bb2b1ec6a 100644 --- a/lib/src/screens/send/send_template_page.dart +++ b/lib/src/screens/send/send_template_page.dart @@ -49,9 +49,8 @@ class SendTemplatePage extends BasePage { return KeyboardActions( config: KeyboardActionsConfig( keyboardActionsPlatform: KeyboardActionsPlatform.IOS, - keyboardBarColor: isDarkTheme - ? Color.fromRGBO(48, 51, 60, 1.0) - : Color.fromRGBO(98, 98, 98, 1.0), + keyboardBarColor: Theme.of(context).accentTextTheme.body2 + .backgroundColor, nextFocus: false, actions: [ KeyboardActionsItem( diff --git a/lib/src/screens/welcome/welcome_page.dart b/lib/src/screens/welcome/welcome_page.dart index 7a5b65516..4d73e0fcd 100644 --- a/lib/src/screens/welcome/welcome_page.dart +++ b/lib/src/screens/welcome/welcome_page.dart @@ -1,15 +1,21 @@ -import 'package:cake_wallet/di.dart'; -import 'package:cake_wallet/store/settings_store.dart'; +import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/themes.dart'; class WelcomePage extends BasePage { static const aspectRatioImage = 1.25; - final welcomeImageLight = Image.asset('assets/images/welcome_light.png'); - final welcomeImageDark = Image.asset('assets/images/welcome.png'); + static final welcomeImageLight = Image.asset('assets/images/welcome_light.png'); + static final welcomeImageDark = Image.asset('assets/images/welcome.png'); + + final Map items = { + Themes.light: welcomeImageLight, + Themes.bright: welcomeImageLight, + Themes.dark: welcomeImageDark + }; @override Widget build(BuildContext context) { @@ -23,10 +29,9 @@ class WelcomePage extends BasePage { @override Widget body(BuildContext context) { - final welcomeImage = getIt - .get() - .isDarkTheme - ? welcomeImageDark : welcomeImageLight; + final welcomeImage = + itemFromTheme(currentTheme: currentTheme, items: items) as Image + ?? welcomeImageLight; final newWalletImage = Image.asset('assets/images/new_wallet.png', height: 12, diff --git a/lib/store/settings_store.dart b/lib/store/settings_store.dart index b4b76bb8d..785763066 100644 --- a/lib/store/settings_store.dart +++ b/lib/store/settings_store.dart @@ -28,7 +28,7 @@ abstract class SettingsStoreBase with Store { @required BalanceDisplayMode initialBalanceDisplayMode, @required bool initialSaveRecipientAddress, @required bool initialAllowBiometricalAuthentication, - @required bool initialDarkTheme, + @required Themes initialTheme, @required int initialPinLength, @required String initialLanguageCode, // @required String initialCurrentLocale, @@ -40,7 +40,7 @@ abstract class SettingsStoreBase with Store { balanceDisplayMode = initialBalanceDisplayMode; shouldSaveRecipientAddress = initialSaveRecipientAddress; allowBiometricalAuthentication = initialAllowBiometricalAuthentication; - isDarkTheme = initialDarkTheme; + currentTheme = initialTheme; pinCodeLength = initialPinLength; languageCode = initialLanguageCode; currentNode = nodes[WalletType.monero]; @@ -65,9 +65,9 @@ abstract class SettingsStoreBase with Store { shouldSaveRecipientAddress)); reaction( - (_) => isDarkTheme, - (bool isDarkTheme) => sharedPreferences.setBool( - PreferencesKey.currentDarkTheme, isDarkTheme)); + (_) => currentTheme, + (Themes theme) => sharedPreferences.setInt( + PreferencesKey.currentTheme, theme.serialize())); reaction( (_) => allowBiometricalAuthentication, @@ -111,7 +111,7 @@ abstract class SettingsStoreBase with Store { bool allowBiometricalAuthentication; @observable - bool isDarkTheme; + Themes currentTheme; @observable int pinCodeLength; @@ -120,7 +120,7 @@ abstract class SettingsStoreBase with Store { Node currentNode; @computed - ThemeData get theme => isDarkTheme ? Themes.darkTheme : Themes.lightTheme; + ThemeData get theme => currentTheme.themeData; @observable String languageCode; @@ -154,8 +154,8 @@ abstract class SettingsStoreBase with Store { final allowBiometricalAuthentication = sharedPreferences .getBool(PreferencesKey.allowBiometricalAuthenticationKey) ?? false; - final savedDarkTheme = - sharedPreferences.getBool(PreferencesKey.currentDarkTheme) ?? false; + final savedTheme = Themes.deserialize( + raw: sharedPreferences.getInt(PreferencesKey.currentTheme) ?? 0); final actionListDisplayMode = ObservableList(); actionListDisplayMode.addAll(deserializeActionlistDisplayModes( sharedPreferences.getInt(PreferencesKey.displayActionListModeKey) ?? @@ -188,7 +188,7 @@ abstract class SettingsStoreBase with Store { initialBalanceDisplayMode: currentBalanceDisplayMode, initialSaveRecipientAddress: shouldSaveRecipientAddress, initialAllowBiometricalAuthentication: allowBiometricalAuthentication, - initialDarkTheme: savedDarkTheme, + initialTheme: savedTheme, actionlistDisplayMode: actionListDisplayMode, initialPinLength: pinLength, initialLanguageCode: savedLanguageCode); diff --git a/lib/themes.dart b/lib/themes.dart index aa7af6cf2..4158a8d91 100644 --- a/lib/themes.dart +++ b/lib/themes.dart @@ -1,353 +1,408 @@ import 'package:flutter/material.dart'; import 'palette.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/entities/enumerable_item.dart'; -class Themes { +class Themes extends EnumerableItem with Serializable { + const Themes({String title, int raw}) + : super(title: title, raw: raw); + + static const all = [ + Themes.light, + Themes.bright, + Themes.dark, + ]; + + static const light = Themes(title: 'Light', raw: 0); + static const bright = Themes(title: 'Bright', raw: 1); + static const dark = Themes(title: 'Dark', raw: 2); + + static Themes deserialize({int raw}) { + switch (raw) { + case 0: + return light; + case 1: + return bright; + case 2: + return dark; + default: + return null; + } + } + + ThemeData get themeData { + switch (this) { + case Themes.light: + return lightTheme; + case Themes.bright: + return lightTheme; + case Themes.dark: + return darkTheme; + default: + return null; + } + } + + @override + String toString() { + switch (this) { + case Themes.light: + return 'Light'; + case Themes.bright: + return 'Bright'; + case Themes.dark: + return 'Dark'; + default: + return ''; + } + } static final ThemeData lightTheme = ThemeData( - fontFamily: 'Lato', - brightness: Brightness.light, - backgroundColor: Colors.white, - accentColor: Palette.blueCraiola, // first gradient color - scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color - primaryColor: Palette.redHat, // third gradient color - buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page - indicatorColor: Colors.white.withOpacity(0.5), // page indicator - hoverColor: Colors.white, // amount hint text (receive page) - dividerColor: Palette.paleBlue, - hintColor: Palette.gray, - textTheme: TextTheme( - title: TextStyle( - color: Colors.white, // sync_indicator text - backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator - decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator + fontFamily: 'Lato', + brightness: Brightness.light, + backgroundColor: Colors.white, + accentColor: Palette.blueCraiola, // first gradient color + scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color + primaryColor: Palette.redHat, // third gradient color + buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page + indicatorColor: Colors.white.withOpacity(0.5), // page indicator + hoverColor: Colors.white, // amount hint text (receive page) + dividerColor: Palette.paleBlue, + hintColor: Palette.gray, + textTheme: TextTheme( + title: TextStyle( + color: Colors.white, // sync_indicator text + backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator + decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator + ), + caption: TextStyle( + color: Palette.shineOrange, // not synced light + decorationColor: Colors.white, // filter icon + ), + overline: TextStyle( + color: Colors.white.withOpacity(0.2), // filter button + backgroundColor: Colors.white.withOpacity(0.5), // date section row + decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows) + ), + subhead: TextStyle( + color: Colors.white.withOpacity(0.2), // address button border + decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget) + ), + headline: TextStyle( + color: Colors.white, // qr code + decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page) + ), + display1: TextStyle( + color: PaletteDark.lightBlueGrey, // icons color (receive page) + decorationColor: Palette.lavender, // icons background (receive page) + ), + display2: TextStyle( + color: Palette.darkBlueCraiola, // text color of tiles (receive page) + decorationColor: Colors.white // background of tiles (receive page) + ), + display3: TextStyle( + color: Colors.white, // text color of current tile (receive page), + //decorationColor: Palette.blueCraiola // background of current tile (receive page) + decorationColor: Palette.moderateSlateBlue // background of current tile (receive page) + ), + display4: TextStyle( + color: Palette.violetBlue, // text color of tiles (account list) + decorationColor: Colors.white // background of tiles (account list) + ), + subtitle: TextStyle( + color: Palette.moderateSlateBlue, // text color of current tile (account list) + decorationColor: Colors.white // background of current tile (account list) + ), + body1: TextStyle( + color: Palette.moderatePurpleBlue, // scrollbar thumb + decorationColor: Palette.periwinkleCraiola // scrollbar background + ), + body2: TextStyle( + color: Palette.moderateLavender, // menu header + decorationColor: Colors.white, // menu background + ) ), - caption: TextStyle( - color: Palette.shineOrange, // not synced light - decorationColor: Colors.white, // filter icon + primaryTextTheme: TextTheme( + title: TextStyle( + color: Palette.darkBlueCraiola, // title color + backgroundColor: Palette.wildPeriwinkle // textfield underline + ), + caption: TextStyle( + color: PaletteDark.pigeonBlue, // secondary text + decorationColor: Palette.wildLavender // menu divider + ), + overline: TextStyle( + color: Palette.darkGray, // transaction/trade details titles + decorationColor: Colors.white.withOpacity(0.5), // placeholder + ), + subhead: TextStyle( + color: Palette.blueCraiola, // first gradient color (send page) + decorationColor: Palette.pinkFlamingo // second gradient color (send page) + ), + headline: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border color (send page) + decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) + ), + display1: TextStyle( + color: Colors.white.withOpacity(0.2), // text field button color (send page) + decorationColor: Colors.white // text field button icon color (send page) + ), + display2: TextStyle( + color: Colors.white.withOpacity(0.5), // estimated fee (send page) + decorationColor: Palette.shadowWhite // template dotted border (send page) + ), + display3: TextStyle( + color: Palette.darkBlueCraiola, // template new text (send page) + decorationColor: Palette.shadowWhite // template background color (send page) + ), + display4: TextStyle( + color: Palette.darkBlueCraiola, // template title (send page) + decorationColor: Palette.niagara // receive amount text (exchange page) + ), + subtitle: TextStyle( + color: Palette.blueCraiola, // first gradient color top panel (exchange page) + decorationColor: Palette.pinkFlamingo // second gradient color top panel (exchange page) + ), + body1: TextStyle( + color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) + decorationColor: Palette.pinkFlamingo.withOpacity(0.7) // second gradient color bottom panel (exchange page) + ), + body2: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) + decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) + ) ), - overline: TextStyle( - color: Colors.white.withOpacity(0.2), // filter button - backgroundColor: Colors.white.withOpacity(0.5), // date section row - decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows) + focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) + accentTextTheme: TextTheme( + title: TextStyle( + color: Colors.white, // picker background + backgroundColor: Palette.periwinkleCraiola, // picker divider + decorationColor: Colors.white // dialog background + ), + caption: TextStyle( + color: Palette.moderateLavender, // container (confirm exchange) + backgroundColor: Palette.moderateLavender, // button background (confirm exchange) + decorationColor: Palette.darkBlueCraiola, // text color (information page) + ), + subtitle: TextStyle( + color: Palette.darkBlueCraiola, // QR code (exchange trade page) + backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) + //decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page) + decorationColor: Palette.moderateSlateBlue // crete new wallet button background (wallet list page) + ), + headline: TextStyle( + color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) + backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) + decorationColor: Colors.white // restore wallet button text color (wallet list page) + ), + subhead: TextStyle( + color: Palette.darkGray, // titles color (filter widget) + backgroundColor: Palette.periwinkle, // divider color (filter widget) + decorationColor: Colors.white // checkbox background (filter widget) + ), + overline: TextStyle( + color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) + decorationColor: Colors.white, // menu subname + ), + display1: TextStyle( + color: Palette.blueCraiola, // first gradient color (menu header) + decorationColor: Palette.pinkFlamingo // second gradient color(menu header) + ), + display2: TextStyle( + color: Palette.shadowWhite, // action button color (address text field) + decorationColor: Palette.darkGray // hint text (seed widget) + ), + display3: TextStyle( + color: Palette.darkGray, // hint text (new wallet page) + decorationColor: Palette.periwinkleCraiola // underline (new wallet page) + ), + display4: TextStyle( + color: Palette.darkGray, // switch background (settings page) + ), + body1: TextStyle( + color: Palette.darkGray, // indicators (PIN code) + decorationColor: Palette.darkGray // switch (PIN code) + ), + body2: TextStyle( + color: Palette.moderateSlateBlue, // primary buttons, alert right buttons + decorationColor: Palette.brightOrange, // alert left button, + backgroundColor: Palette.dullGray // keyboard bar color + ), ), - subhead: TextStyle( - color: Colors.white.withOpacity(0.2), // address button border - decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget) - ), - headline: TextStyle( - color: Colors.white, // qr code - decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page) - ), - display1: TextStyle( - color: PaletteDark.lightBlueGrey, // icons color (receive page) - decorationColor: Palette.lavender, // icons background (receive page) - ), - display2: TextStyle( - color: Palette.darkBlueCraiola, // text color of tiles (receive page) - decorationColor: Colors.white // background of tiles (receive page) - ), - display3: TextStyle( - color: Colors.white, // text color of current tile (receive page), - //decorationColor: Palette.blueCraiola // background of current tile (receive page) - decorationColor: Palette.moderateSlateBlue // background of current tile (receive page) - ), - display4: TextStyle( - color: Palette.violetBlue, // text color of tiles (account list) - decorationColor: Colors.white // background of tiles (account list) - ), - subtitle: TextStyle( - color: Palette.moderateSlateBlue, // text color of current tile (account list) - decorationColor: Colors.white // background of current tile (account list) - ), - body1: TextStyle( - color: Palette.moderatePurpleBlue, // scrollbar thumb - decorationColor: Palette.periwinkleCraiola // scrollbar background - ), - body2: TextStyle( - color: Palette.moderateLavender, // menu header - decorationColor: Colors.white, // menu background - ) - ), - primaryTextTheme: TextTheme( - title: TextStyle( - color: Palette.darkBlueCraiola, // title color - backgroundColor: Palette.wildPeriwinkle // textfield underline - ), - caption: TextStyle( - color: PaletteDark.pigeonBlue, // secondary text - decorationColor: Palette.wildLavender // menu divider - ), - overline: TextStyle( - color: Palette.darkGray, // transaction/trade details titles - decorationColor: Colors.white.withOpacity(0.5), // placeholder - ), - subhead: TextStyle( - color: Palette.blueCraiola, // first gradient color (send page) - decorationColor: Palette.pinkFlamingo // second gradient color (send page) - ), - headline: TextStyle( - color: Colors.white.withOpacity(0.5), // text field border color (send page) - decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) - ), - display1: TextStyle( - color: Colors.white.withOpacity(0.2), // text field button color (send page) - decorationColor: Colors.white // text field button icon color (send page) - ), - display2: TextStyle( - color: Colors.white.withOpacity(0.5), // estimated fee (send page) - decorationColor: Palette.shadowWhite // template dotted border (send page) - ), - display3: TextStyle( - color: Palette.darkBlueCraiola, // template new text (send page) - decorationColor: Palette.shadowWhite // template background color (send page) - ), - display4: TextStyle( - color: Palette.darkBlueCraiola, // template title (send page) - decorationColor: Palette.niagara // receive amount text (exchange page) - ), - subtitle: TextStyle( - color: Palette.blueCraiola, // first gradient color top panel (exchange page) - decorationColor: Palette.pinkFlamingo // second gradient color top panel (exchange page) - ), - body1: TextStyle( - color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) - decorationColor: Palette.pinkFlamingo.withOpacity(0.7) // second gradient color bottom panel (exchange page) - ), - body2: TextStyle( - color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) - decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) - ) - ), - focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) - accentTextTheme: TextTheme( - title: TextStyle( - color: Colors.white, // picker background - backgroundColor: Palette.periwinkleCraiola, // picker divider - decorationColor: Colors.white // dialog background - ), - caption: TextStyle( - color: Palette.moderateLavender, // container (confirm exchange) - backgroundColor: Palette.moderateLavender, // button background (confirm exchange) - decorationColor: Palette.darkBlueCraiola, // text color (information page) - ), - subtitle: TextStyle( - color: Palette.darkBlueCraiola, // QR code (exchange trade page) - backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) - //decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page) - decorationColor: Palette.moderateSlateBlue // crete new wallet button background (wallet list page) - ), - headline: TextStyle( - color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) - backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) - decorationColor: Colors.white // restore wallet button text color (wallet list page) - ), - subhead: TextStyle( - color: Palette.darkGray, // titles color (filter widget) - backgroundColor: Palette.periwinkle, // divider color (filter widget) - decorationColor: Colors.white // checkbox background (filter widget) - ), - overline: TextStyle( - color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) - decorationColor: Colors.white, // menu subname - ), - display1: TextStyle( - color: Palette.blueCraiola, // first gradient color (menu header) - decorationColor: Palette.pinkFlamingo // second gradient color(menu header) - ), - display2: TextStyle( - color: Palette.shadowWhite, // action button color (address text field) - decorationColor: Palette.darkGray // hint text (seed widget) - ), - display3: TextStyle( - color: Palette.darkGray, // hint text (new wallet page) - decorationColor: Palette.periwinkleCraiola // underline (new wallet page) - ), - display4: TextStyle( - color: Palette.darkGray, // switch background (settings page) - ), - body1: TextStyle( - color: Palette.darkGray, // indicators (PIN code) - decorationColor: Palette.darkGray // switch (PIN code) - ), - body2: TextStyle( - color: Palette.moderateSlateBlue, // primary buttons, alert right buttons - decorationColor: Palette.brightOrange // alert left button - ), - ), - cardColor: Palette.moderateSlateBlue // bottom button (action list) + cardColor: Palette.moderateSlateBlue // bottom button (action list) ); - static final ThemeData darkTheme = ThemeData( - fontFamily: 'Lato', - brightness: Brightness.dark, - backgroundColor: PaletteDark.backgroundColor, - accentColor: PaletteDark.backgroundColor, // first gradient color - scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color - primaryColor: PaletteDark.backgroundColor, // third gradient color - buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page - indicatorColor: PaletteDark.cyanBlue, // page indicator - hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page) - dividerColor: PaletteDark.dividerColor, - hintColor: PaletteDark.pigeonBlue, // menu - textTheme: TextTheme( - title: TextStyle( - color: PaletteDark.wildBlue, // sync_indicator text - backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator - decorationColor: PaletteDark.oceanBlue // not synced sync_indicator + fontFamily: 'Lato', + brightness: Brightness.dark, + backgroundColor: PaletteDark.backgroundColor, + accentColor: PaletteDark.backgroundColor, // first gradient color + scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color + primaryColor: PaletteDark.backgroundColor, // third gradient color + buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page + indicatorColor: PaletteDark.cyanBlue, // page indicator + hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page) + dividerColor: PaletteDark.dividerColor, + hintColor: PaletteDark.pigeonBlue, // menu + textTheme: TextTheme( + title: TextStyle( + color: PaletteDark.wildBlue, // sync_indicator text + backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator + decorationColor: PaletteDark.oceanBlue // not synced sync_indicator + ), + caption: TextStyle( + color: PaletteDark.orangeYellow, // not synced light + decorationColor: PaletteDark.wildBlue, // filter icon + ), + overline: TextStyle( + color: PaletteDark.oceanBlue, // filter button + backgroundColor: PaletteDark.darkCyanBlue, // date section row + decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows) + ), + subhead: TextStyle( + color: PaletteDark.nightBlue, // address button border + decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) + ), + headline: TextStyle( + color: PaletteDark.lightBlueGrey, // qr code + decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page) + ), + display1: TextStyle( + color: Colors.white, // icons color (receive page) + decorationColor: PaletteDark.distantNightBlue, // icons background (receive page) + ), + display2: TextStyle( + color: Colors.white, // text color of tiles (receive page) + decorationColor: PaletteDark.nightBlue // background of tiles (receive page) + ), + display3: TextStyle( + color: Palette.blueCraiola, // text color of current tile (receive page) + decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page) + ), + display4: TextStyle( + color: Colors.white, // text color of tiles (account list) + decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list) + ), + subtitle: TextStyle( + color: Palette.blueCraiola, // text color of current tile (account list) + decorationColor: PaletteDark.darkNightBlue // background of current tile (account list) + ), + body1: TextStyle( + color: PaletteDark.wildBlueGrey, // scrollbar thumb + decorationColor: PaletteDark.violetBlue // scrollbar background + ), + body2: TextStyle( + color: PaletteDark.deepPurpleBlue, // menu header + decorationColor: PaletteDark.deepPurpleBlue, // menu background + ) ), - caption: TextStyle( - color: PaletteDark.orangeYellow, // not synced light - decorationColor: PaletteDark.wildBlue, // filter icon + primaryTextTheme: TextTheme( + title: TextStyle( + color: Colors.white, // title color + backgroundColor: PaletteDark.darkOceanBlue // textfield underline + ), + caption: TextStyle( + color: PaletteDark.darkCyanBlue, // secondary text + decorationColor: PaletteDark.darkOceanBlue // menu divider + ), + overline: TextStyle( + color: PaletteDark.lightBlueGrey, // transaction/trade details titles + decorationColor: Colors.grey, // placeholder + ), + subhead: TextStyle( + color: PaletteDark.darkNightBlue, // first gradient color (send page) + decorationColor: PaletteDark.darkNightBlue // second gradient color (send page) + ), + headline: TextStyle( + color: PaletteDark.lightVioletBlue, // text field border color (send page) + decorationColor: PaletteDark.darkCyanBlue, // text field hint color (send page) + ), + display1: TextStyle( + color: PaletteDark.buttonNightBlue, // text field button color (send page) + decorationColor: PaletteDark.gray // text field button icon color (send page) + ), + display2: TextStyle( + color: Colors.white, // estimated fee (send page) + decorationColor: PaletteDark.darkCyanBlue // template dotted border (send page) + ), + display3: TextStyle( + color: PaletteDark.darkCyanBlue, // template new text (send page) + decorationColor: PaletteDark.darkVioletBlue // template background color (send page) + ), + display4: TextStyle( + color: PaletteDark.cyanBlue, // template title (send page) + decorationColor: PaletteDark.darkCyanBlue // receive amount text (exchange page) + ), + subtitle: TextStyle( + color: PaletteDark.wildVioletBlue, // first gradient color top panel (exchange page) + decorationColor: PaletteDark.wildVioletBlue // second gradient color top panel (exchange page) + ), + body1: TextStyle( + color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page) + decorationColor: PaletteDark.darkNightBlue // second gradient color bottom panel (exchange page) + ), + body2: TextStyle( + color: PaletteDark.blueGrey, // text field border on top panel (exchange page) + decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page) + ) ), - overline: TextStyle( - color: PaletteDark.oceanBlue, // filter button - backgroundColor: PaletteDark.darkCyanBlue, // date section row - decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows) + focusColor: PaletteDark.moderateBlue, // text field button (exchange page) + accentTextTheme: TextTheme( + title: TextStyle( + color: PaletteDark.nightBlue, // picker background + backgroundColor: PaletteDark.dividerColor, // picker divider + decorationColor: PaletteDark.darkNightBlue // dialog background + ), + caption: TextStyle( + color: PaletteDark.nightBlue, // container (confirm exchange) + backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange) + decorationColor: Palette.darkLavender, // text color (information page) + ), + subtitle: TextStyle( + //color: PaletteDark.lightBlueGrey, // QR code (exchange trade page) + color: Colors.white, // QR code (exchange trade page) + backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page) + decorationColor: Colors.white // crete new wallet button background (wallet list page) + ), + headline: TextStyle( + color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page) + backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page) + decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page) + ), + subhead: TextStyle( + color: Colors.white, // titles color (filter widget) + backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget) + decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget) + ), + overline: TextStyle( + color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget) + decorationColor: PaletteDark.darkCyanBlue, // menu subname + ), + display1: TextStyle( + color: PaletteDark.deepPurpleBlue, // first gradient color (menu header) + decorationColor: PaletteDark.deepPurpleBlue // second gradient color(menu header) + ), + display2: TextStyle( + color: PaletteDark.nightBlue, // action button color (address text field) + decorationColor: PaletteDark.darkCyanBlue // hint text (seed widget) + ), + display3: TextStyle( + color: PaletteDark.cyanBlue, // hint text (new wallet page) + decorationColor: PaletteDark.darkGrey // underline (new wallet page) + ), + display4: TextStyle( + color: PaletteDark.deepVioletBlue, // switch background (settings page) + ), + body1: TextStyle( + color: PaletteDark.indicatorVioletBlue, // indicators (PIN code) + decorationColor: PaletteDark.lightPurpleBlue // switch (PIN code) + ), + body2: TextStyle( + color: Palette.blueCraiola, // primary buttons, alert right buttons + decorationColor: Palette.alizarinRed, // alert left button + backgroundColor: PaletteDark.granite // keyboard bar color + ), ), - subhead: TextStyle( - color: PaletteDark.nightBlue, // address button border - decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) - ), - headline: TextStyle( - color: PaletteDark.lightBlueGrey, // qr code - decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page) - ), - display1: TextStyle( - color: Colors.white, // icons color (receive page) - decorationColor: PaletteDark.distantNightBlue, // icons background (receive page) - ), - display2: TextStyle( - color: Colors.white, // text color of tiles (receive page) - decorationColor: PaletteDark.nightBlue // background of tiles (receive page) - ), - display3: TextStyle( - color: Palette.blueCraiola, // text color of current tile (receive page) - decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page) - ), - display4: TextStyle( - color: Colors.white, // text color of tiles (account list) - decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list) - ), - subtitle: TextStyle( - color: Palette.blueCraiola, // text color of current tile (account list) - decorationColor: PaletteDark.darkNightBlue // background of current tile (account list) - ), - body1: TextStyle( - color: PaletteDark.wildBlueGrey, // scrollbar thumb - decorationColor: PaletteDark.violetBlue // scrollbar background - ), - body2: TextStyle( - color: PaletteDark.deepPurpleBlue, // menu header - decorationColor: PaletteDark.deepPurpleBlue, // menu background - ) - ), - primaryTextTheme: TextTheme( - title: TextStyle( - color: Colors.white, // title color - backgroundColor: PaletteDark.darkOceanBlue // textfield underline - ), - caption: TextStyle( - color: PaletteDark.darkCyanBlue, // secondary text - decorationColor: PaletteDark.darkOceanBlue // menu divider - ), - overline: TextStyle( - color: PaletteDark.lightBlueGrey, // transaction/trade details titles - decorationColor: Colors.grey, // placeholder - ), - subhead: TextStyle( - color: PaletteDark.darkNightBlue, // first gradient color (send page) - decorationColor: PaletteDark.darkNightBlue // second gradient color (send page) - ), - headline: TextStyle( - color: PaletteDark.lightVioletBlue, // text field border color (send page) - decorationColor: PaletteDark.darkCyanBlue, // text field hint color (send page) - ), - display1: TextStyle( - color: PaletteDark.buttonNightBlue, // text field button color (send page) - decorationColor: PaletteDark.gray // text field button icon color (send page) - ), - display2: TextStyle( - color: Colors.white, // estimated fee (send page) - decorationColor: PaletteDark.darkCyanBlue // template dotted border (send page) - ), - display3: TextStyle( - color: PaletteDark.darkCyanBlue, // template new text (send page) - decorationColor: PaletteDark.darkVioletBlue // template background color (send page) - ), - display4: TextStyle( - color: PaletteDark.cyanBlue, // template title (send page) - decorationColor: PaletteDark.darkCyanBlue // receive amount text (exchange page) - ), - subtitle: TextStyle( - color: PaletteDark.wildVioletBlue, // first gradient color top panel (exchange page) - decorationColor: PaletteDark.wildVioletBlue // second gradient color top panel (exchange page) - ), - body1: TextStyle( - color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page) - decorationColor: PaletteDark.darkNightBlue // second gradient color bottom panel (exchange page) - ), - body2: TextStyle( - color: PaletteDark.blueGrey, // text field border on top panel (exchange page) - decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page) - ) - ), - focusColor: PaletteDark.moderateBlue, // text field button (exchange page) - accentTextTheme: TextTheme( - title: TextStyle( - color: PaletteDark.nightBlue, // picker background - backgroundColor: PaletteDark.dividerColor, // picker divider - decorationColor: PaletteDark.darkNightBlue // dialog background - ), - caption: TextStyle( - color: PaletteDark.nightBlue, // container (confirm exchange) - backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange) - decorationColor: Palette.darkLavender, // text color (information page) - ), - subtitle: TextStyle( - //color: PaletteDark.lightBlueGrey, // QR code (exchange trade page) - color: Colors.white, // QR code (exchange trade page) - backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page) - decorationColor: Colors.white // crete new wallet button background (wallet list page) - ), - headline: TextStyle( - color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page) - backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page) - decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page) - ), - subhead: TextStyle( - color: Colors.white, // titles color (filter widget) - backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget) - decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget) - ), - overline: TextStyle( - color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget) - decorationColor: PaletteDark.darkCyanBlue, // menu subname - ), - display1: TextStyle( - color: PaletteDark.deepPurpleBlue, // first gradient color (menu header) - decorationColor: PaletteDark.deepPurpleBlue // second gradient color(menu header) - ), - display2: TextStyle( - color: PaletteDark.nightBlue, // action button color (address text field) - decorationColor: PaletteDark.darkCyanBlue // hint text (seed widget) - ), - display3: TextStyle( - color: PaletteDark.cyanBlue, // hint text (new wallet page) - decorationColor: PaletteDark.darkGrey // underline (new wallet page) - ), - display4: TextStyle( - color: PaletteDark.deepVioletBlue, // switch background (settings page) - ), - body1: TextStyle( - color: PaletteDark.indicatorVioletBlue, // indicators (PIN code) - decorationColor: PaletteDark.lightPurpleBlue // switch (PIN code) - ), - body2: TextStyle( - color: Palette.blueCraiola, // primary buttons, alert right buttons - decorationColor: Palette.alizarinRed // alert left button - ), - ), - cardColor: PaletteDark.darkNightBlue // bottom button (action list) + cardColor: PaletteDark.darkNightBlue // bottom button (action list) ); } \ No newline at end of file diff --git a/lib/view_model/settings/settings_view_model.dart b/lib/view_model/settings/settings_view_model.dart index a3ae7a0aa..10f152c73 100644 --- a/lib/view_model/settings/settings_view_model.dart +++ b/lib/view_model/settings/settings_view_model.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/src/screens/pin_code/pin_code_widget.dart'; +import 'package:cake_wallet/themes.dart'; import 'package:flutter/cupertino.dart'; import 'package:mobx/mobx.dart'; import 'package:package_info/package_info.dart'; @@ -106,11 +107,12 @@ abstract class SettingsViewModelBase with Store { setAllowBiometricalAuthentication(value); } }), - SwitcherListItem( - title: S.current.settings_dark_mode, - value: () => _settingsStore.isDarkTheme, - onValueChange: (_, bool value) => - _settingsStore.isDarkTheme = value) + PickerListItem( + title: 'Color theme', + items: Themes.all, + selectedItem: () => theme, + onItemSelected: (Themes theme) => + _settingsStore.currentTheme = theme) ], [ LinkListItem( @@ -186,6 +188,9 @@ abstract class SettingsViewModelBase with Store { bool get allowBiometricalAuthentication => _settingsStore.allowBiometricalAuthentication; + @computed + Themes get theme => _settingsStore.currentTheme; + final Map itemHeaders; List> sections; final SettingsStore _settingsStore; From 8b349435dfb687ae01aa3c860d230ddde933e7bd Mon Sep 17 00:00:00 2001 From: Oleksandr Sobol Date: Thu, 10 Dec 2020 20:35:11 +0200 Subject: [PATCH 02/10] CAKE-207 | fixed string resources --- lib/generated/i18n.dart | 92 +++++++++++++++++++ lib/themes.dart | 6 +- .../settings/settings_view_model.dart | 2 +- res/values/strings_de.arb | 7 +- res/values/strings_en.arb | 7 +- res/values/strings_es.arb | 7 +- res/values/strings_hi.arb | 7 +- res/values/strings_ja.arb | 7 +- res/values/strings_ko.arb | 7 +- res/values/strings_nl.arb | 7 +- res/values/strings_pl.arb | 7 +- res/values/strings_pt.arb | 7 +- res/values/strings_ru.arb | 7 +- res/values/strings_uk.arb | 7 +- res/values/strings_zh.arb | 7 +- 15 files changed, 168 insertions(+), 16 deletions(-) diff --git a/lib/generated/i18n.dart b/lib/generated/i18n.dart index fd0c0f70e..0619124be 100644 --- a/lib/generated/i18n.dart +++ b/lib/generated/i18n.dart @@ -44,6 +44,7 @@ class S implements WidgetsLocalizations { String get authentication => "Authentication"; String get available_balance => "Available Balance"; String get biometric_auth_reason => "Scan your fingerprint to authenticate"; + String get bright_theme => "Bright"; String get buy => "Buy"; String get cake_wallet => "Cake Wallet"; String get cancel => "Cancel"; @@ -57,6 +58,7 @@ class S implements WidgetsLocalizations { String get choose_account => "Choose account"; String get choose_wallet_currency => "Please choose wallet currency:"; String get clear => "Clear"; + String get color_theme => "Color theme"; String get confirm => "Confirm"; String get confirm_delete_template => "This action will delete this template. Do you wish to continue?"; String get confirm_delete_wallet => "This action will delete this wallet. Do you wish to continue?"; @@ -71,6 +73,7 @@ class S implements WidgetsLocalizations { String get create_new => "Create New Wallet"; String get create_new_account => "Create new account"; String get creating_new_wallet => "Creating new wallet"; + String get dark_theme => "Dark"; String get delete => "Delete"; String get digit_pin => "-digit PIN"; String get edit => "Edit"; @@ -107,6 +110,7 @@ class S implements WidgetsLocalizations { String get id => "ID: "; String get incoming => "Incoming"; String get incorrect_seed => "The text entered is not valid."; + String get light_theme => "Light"; String get loading_your_wallet => "Loading your wallet"; String get login => "Login"; String get new_node_testing => "New node testing"; @@ -394,6 +398,8 @@ class $de extends S { @override String get biometric_auth_reason => "Scannen Sie Ihren Fingerabdruck zur Authentifizierung"; @override + String get dark_theme => "Dunkel"; + @override String get transaction_sent => "Transaktion gesendet!"; @override String get send_fee => "Gebühr:"; @@ -646,6 +652,8 @@ class $de extends S { @override String get filters => "Filter"; @override + String get color_theme => "Farbthema"; + @override String get settings_current_node => "Aktueller Knoten"; @override String get copy_id => "ID kopieren"; @@ -886,12 +894,16 @@ class $de extends S { @override String get trade_state_confirming => "Bestätigung"; @override + String get bright_theme => "Hell"; + @override String get send => "Senden"; @override String get send_title => "Senden Sie"; @override String get error_text_keys => "Walletschlüssel können nur 64 hexadezimale Zeichen enthalten"; @override + String get light_theme => "Licht"; + @override String get settings_save_recipient_address => "Empfängeradresse speichern"; @override String get change_exchange_provider => "Wechseln Sie den Exchange-Anbieter"; @@ -1086,6 +1098,8 @@ class $hi extends S { @override String get biometric_auth_reason => "प्रमाणित करने के लिए अपने फ़िंगरप्रिंट को स्कैन करें"; @override + String get dark_theme => "अंधेरा"; + @override String get transaction_sent => "भेजा गया लेन-देन"; @override String get send_fee => "शुल्क:"; @@ -1338,6 +1352,8 @@ class $hi extends S { @override String get filters => "फ़िल्टर"; @override + String get color_theme => "रंग विषय"; + @override String get settings_current_node => "वर्तमान नोड"; @override String get copy_id => "प्रतिलिपि ID"; @@ -1578,12 +1594,16 @@ class $hi extends S { @override String get trade_state_confirming => "पुष्टि"; @override + String get bright_theme => "उज्ज्वल"; + @override String get send => "संदेश"; @override String get send_title => "संदेश"; @override String get error_text_keys => "वॉलेट कीज़ में हेक्स में केवल 64 वर्ण हो सकते हैं"; @override + String get light_theme => "रोशनी"; + @override String get settings_save_recipient_address => "प्राप्तकर्ता का पता सहेजें"; @override String get change_exchange_provider => "एक्सचेंज प्रदाता बदलें"; @@ -1778,6 +1798,8 @@ class $ru extends S { @override String get biometric_auth_reason => "Отсканируйте свой отпечаток пальца для аутентификации"; @override + String get dark_theme => "Темная"; + @override String get transaction_sent => "Tранзакция отправлена!"; @override String get send_fee => "Комиссия:"; @@ -2030,6 +2052,8 @@ class $ru extends S { @override String get filters => "Фильтр"; @override + String get color_theme => "Цветовая тема"; + @override String get settings_current_node => "Текущая нода"; @override String get copy_id => "Скопировать ID"; @@ -2270,12 +2294,16 @@ class $ru extends S { @override String get trade_state_confirming => "Подтверждение"; @override + String get bright_theme => "Яркая"; + @override String get send => "Отправить"; @override String get send_title => "Отправить"; @override String get error_text_keys => "Ключи кошелька могут содержать только 64 символа в hex"; @override + String get light_theme => "Светлая"; + @override String get settings_save_recipient_address => "Сохранять адрес получателя"; @override String get change_exchange_provider => "Изменить провайдера обмена"; @@ -2470,6 +2498,8 @@ class $ko extends S { @override String get biometric_auth_reason => "지문을 스캔하여 인증"; @override + String get dark_theme => "어두운"; + @override String get transaction_sent => "거래가 전송되었습니다!"; @override String get send_fee => "회비:"; @@ -2722,6 +2752,8 @@ class $ko extends S { @override String get filters => "필터"; @override + String get color_theme => "색상 테마"; + @override String get settings_current_node => "현재 노드"; @override String get copy_id => "부 ID"; @@ -2962,12 +2994,16 @@ class $ko extends S { @override String get trade_state_confirming => "확인 중"; @override + String get bright_theme => "선명한"; + @override String get send => "보내다"; @override String get send_title => "보내다"; @override String get error_text_keys => "지갑 키는 16 진수로 64 자만 포함 할 수 있습니다"; @override + String get light_theme => "빛"; + @override String get settings_save_recipient_address => "수신자 주소 저장"; @override String get change_exchange_provider => "교환 공급자 변경"; @@ -3162,6 +3198,8 @@ class $pt extends S { @override String get biometric_auth_reason => "Digitalize sua impressão digital para autenticar"; @override + String get dark_theme => "Sombria"; + @override String get transaction_sent => "Transação enviada!"; @override String get send_fee => "Taxa:"; @@ -3414,6 +3452,8 @@ class $pt extends S { @override String get filters => "Filtro"; @override + String get color_theme => "Tema de cor"; + @override String get settings_current_node => "Nó atual"; @override String get copy_id => "Copiar ID"; @@ -3654,12 +3694,16 @@ class $pt extends S { @override String get trade_state_confirming => "Confirmando"; @override + String get bright_theme => "Brilhante"; + @override String get send => "Enviar"; @override String get send_title => "Enviar"; @override String get error_text_keys => "As chaves da carteira podem conter apenas 64 caracteres em hexadecimal"; @override + String get light_theme => "Luz"; + @override String get settings_save_recipient_address => "Salvar endereço do destinatário"; @override String get change_exchange_provider => "Alterar o provedor de troca"; @@ -3854,6 +3898,8 @@ class $uk extends S { @override String get biometric_auth_reason => "Відскануйте свій відбиток пальця для аутентифікації"; @override + String get dark_theme => "Темна"; + @override String get transaction_sent => "Tранзакцію відправлено!"; @override String get send_fee => "Комісія:"; @@ -4106,6 +4152,8 @@ class $uk extends S { @override String get filters => "Фільтр"; @override + String get color_theme => "Кольорова тема"; + @override String get settings_current_node => "Поточний вузол"; @override String get copy_id => "Скопіювати ID"; @@ -4346,12 +4394,16 @@ class $uk extends S { @override String get trade_state_confirming => "Підтвердження"; @override + String get bright_theme => "Яскрава"; + @override String get send => "Відправити"; @override String get send_title => "Відправити"; @override String get error_text_keys => "Ключі гаманця можуть містити тільки 64 символів в hex"; @override + String get light_theme => "Світла"; + @override String get settings_save_recipient_address => "Зберігати адресу отримувача"; @override String get change_exchange_provider => "Змінити провайдера обміну"; @@ -4546,6 +4598,8 @@ class $ja extends S { @override String get biometric_auth_reason => "प指紋をスキャンして認証する"; @override + String get dark_theme => "闇"; + @override String get transaction_sent => "トランザクションが送信されました!"; @override String get send_fee => "費用:"; @@ -4798,6 +4852,8 @@ class $ja extends S { @override String get filters => "フィルタ"; @override + String get color_theme => "カラーテーマ"; + @override String get settings_current_node => "現在のノード"; @override String get copy_id => "IDをコピー"; @@ -5038,12 +5094,16 @@ class $ja extends S { @override String get trade_state_confirming => "確認中"; @override + String get bright_theme => "明るい"; + @override String get send => "送る"; @override String get send_title => "を送信"; @override String get error_text_keys => "ウォレットキーには、16進数で64文字しか含めることができません"; @override + String get light_theme => "光"; + @override String get settings_save_recipient_address => "受信者のアドレスを保存"; @override String get change_exchange_provider => "Exchangeプロバイダーの変更"; @@ -5242,6 +5302,8 @@ class $pl extends S { @override String get biometric_auth_reason => "Zeskanuj swój odcisk palca, aby go uwierzytelnić"; @override + String get dark_theme => "Ciemny"; + @override String get transaction_sent => "Transakcja wysłana!"; @override String get send_fee => "Opłata:"; @@ -5494,6 +5556,8 @@ class $pl extends S { @override String get filters => "Filtr"; @override + String get color_theme => "Motyw kolorystyczny"; + @override String get settings_current_node => "Bieżący węzeł"; @override String get copy_id => "ID kopii"; @@ -5734,12 +5798,16 @@ class $pl extends S { @override String get trade_state_confirming => "Potwierdzam"; @override + String get bright_theme => "Jasny"; + @override String get send => "Wysłać"; @override String get send_title => "Wyślij"; @override String get error_text_keys => "Klucze portfela mogą zawierać tylko 64 znaki w systemie szesnastkowym"; @override + String get light_theme => "Lekki"; + @override String get settings_save_recipient_address => "Zapisz adres odbiorcy"; @override String get change_exchange_provider => "Zmień dostawcę programu Exchange"; @@ -5934,6 +6002,8 @@ class $es extends S { @override String get biometric_auth_reason => "Escanee su huella digital para autenticar"; @override + String get dark_theme => "Oscura"; + @override String get transaction_sent => "Transacción enviada!"; @override String get send_fee => "Cuota:"; @@ -6186,6 +6256,8 @@ class $es extends S { @override String get filters => "Filtrar"; @override + String get color_theme => "Tema de color"; + @override String get settings_current_node => "Nodo actual"; @override String get copy_id => "Copiar ID"; @@ -6426,12 +6498,16 @@ class $es extends S { @override String get trade_state_confirming => "Confirmando"; @override + String get bright_theme => "Brillante"; + @override String get send => "Enviar"; @override String get send_title => "Enviar"; @override String get error_text_keys => "Las llaves de billetera solo pueden contener 64 caracteres en hexadecimal"; @override + String get light_theme => "Ligera"; + @override String get settings_save_recipient_address => "Guardar dirección del destinatario"; @override String get change_exchange_provider => "Cambiar proveedor de intercambio"; @@ -6626,6 +6702,8 @@ class $nl extends S { @override String get biometric_auth_reason => "Scan uw vingerafdruk om te verifiëren"; @override + String get dark_theme => "Donker"; + @override String get transaction_sent => "Transactie verzonden!"; @override String get send_fee => "Vergoeding:"; @@ -6878,6 +6956,8 @@ class $nl extends S { @override String get filters => "Filter"; @override + String get color_theme => "Kleur thema"; + @override String get settings_current_node => "Huidige knooppunt"; @override String get copy_id => "ID kopiëren"; @@ -7118,12 +7198,16 @@ class $nl extends S { @override String get trade_state_confirming => "Bevestiging"; @override + String get bright_theme => "Helder"; + @override String get send => "Sturen"; @override String get send_title => "Stuur"; @override String get error_text_keys => "Portefeuillesleutels kunnen maximaal 64 tekens bevatten in hexadecimale volgorde"; @override + String get light_theme => "Licht"; + @override String get settings_save_recipient_address => "Adres ontvanger opslaan"; @override String get change_exchange_provider => "Wijzig Exchange Provider"; @@ -7318,6 +7402,8 @@ class $zh extends S { @override String get biometric_auth_reason => "掃描指紋以進行身份驗證"; @override + String get dark_theme => "黑暗"; + @override String get transaction_sent => "交易已发送"; @override String get send_fee => "費用:"; @@ -7570,6 +7656,8 @@ class $zh extends S { @override String get filters => "過濾"; @override + String get color_theme => "顏色主題"; + @override String get settings_current_node => "当前节点"; @override String get copy_id => "复印ID"; @@ -7810,12 +7898,16 @@ class $zh extends S { @override String get trade_state_confirming => "确认中"; @override + String get bright_theme => "亮"; + @override String get send => "发送"; @override String get send_title => "發送"; @override String get error_text_keys => "钱包密钥只能包含16个字符的十六进制字符"; @override + String get light_theme => "光"; + @override String get settings_save_recipient_address => "保存收件人地址"; @override String get change_exchange_provider => "更改交易所提供商"; diff --git a/lib/themes.dart b/lib/themes.dart index 4158a8d91..310acc3df 100644 --- a/lib/themes.dart +++ b/lib/themes.dart @@ -47,11 +47,11 @@ class Themes extends EnumerableItem with Serializable { String toString() { switch (this) { case Themes.light: - return 'Light'; + return S.current.light_theme; case Themes.bright: - return 'Bright'; + return S.current.bright_theme; case Themes.dark: - return 'Dark'; + return S.current.dark_theme; default: return ''; } diff --git a/lib/view_model/settings/settings_view_model.dart b/lib/view_model/settings/settings_view_model.dart index 10f152c73..08ccb40b4 100644 --- a/lib/view_model/settings/settings_view_model.dart +++ b/lib/view_model/settings/settings_view_model.dart @@ -108,7 +108,7 @@ abstract class SettingsViewModelBase with Store { } }), PickerListItem( - title: 'Color theme', + title: S.current.color_theme, items: Themes.all, selectedItem: () => theme, onItemSelected: (Themes theme) => diff --git a/res/values/strings_de.arb b/res/values/strings_de.arb index eb0a6080b..9d519a6da 100644 --- a/res/values/strings_de.arb +++ b/res/values/strings_de.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} Error", - "use_ssl" : "Verwenden Sie SSL" + "use_ssl" : "Verwenden Sie SSL", + + "color_theme" : "Farbthema", + "light_theme" : "Licht", + "bright_theme" : "Hell", + "dark_theme" : "Dunkel" } \ No newline at end of file diff --git a/res/values/strings_en.arb b/res/values/strings_en.arb index 8a1267236..d249fb024 100644 --- a/res/values/strings_en.arb +++ b/res/values/strings_en.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} error", - "use_ssl" : "Use SSL" + "use_ssl" : "Use SSL", + + "color_theme" : "Color theme", + "light_theme" : "Light", + "bright_theme" : "Bright", + "dark_theme" : "Dark" } \ No newline at end of file diff --git a/res/values/strings_es.arb b/res/values/strings_es.arb index 00acdcb0c..f5ca1310e 100644 --- a/res/values/strings_es.arb +++ b/res/values/strings_es.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} error", - "use_ssl" : "Utilice SSL" + "use_ssl" : "Utilice SSL", + + "color_theme" : "Tema de color", + "light_theme" : "Ligera", + "bright_theme" : "Brillante", + "dark_theme" : "Oscura" } \ No newline at end of file diff --git a/res/values/strings_hi.arb b/res/values/strings_hi.arb index 9a9545c5d..315c21b79 100644 --- a/res/values/strings_hi.arb +++ b/res/values/strings_hi.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} त्रुटि", - "use_ssl" : "उपयोग SSL" + "use_ssl" : "उपयोग SSL", + + "color_theme" : "रंग विषय", + "light_theme" : "रोशनी", + "bright_theme" : "उज्ज्वल", + "dark_theme" : "अंधेरा" } \ No newline at end of file diff --git a/res/values/strings_ja.arb b/res/values/strings_ja.arb index cb4b63414..8b091406f 100644 --- a/res/values/strings_ja.arb +++ b/res/values/strings_ja.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} エラー", - "use_ssl" : "SSLを使用する" + "use_ssl" : "SSLを使用する", + + "color_theme" : "カラーテーマ", + "light_theme" : "光", + "bright_theme" : "明るい", + "dark_theme" : "闇" } \ No newline at end of file diff --git a/res/values/strings_ko.arb b/res/values/strings_ko.arb index c14898fd9..0362c6e5a 100644 --- a/res/values/strings_ko.arb +++ b/res/values/strings_ko.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} 오류", - "use_ssl" : "SSL 사용" + "use_ssl" : "SSL 사용", + + "color_theme" : "색상 테마", + "light_theme" : "빛", + "bright_theme" : "선명한", + "dark_theme" : "어두운" } \ No newline at end of file diff --git a/res/values/strings_nl.arb b/res/values/strings_nl.arb index e5093a406..265d4c452 100644 --- a/res/values/strings_nl.arb +++ b/res/values/strings_nl.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} fout", - "use_ssl" : "Gebruik SSL" + "use_ssl" : "Gebruik SSL", + + "color_theme" : "Kleur thema", + "light_theme" : "Licht", + "bright_theme" : "Helder", + "dark_theme" : "Donker" } \ No newline at end of file diff --git a/res/values/strings_pl.arb b/res/values/strings_pl.arb index e6b098360..dd38e9e02 100644 --- a/res/values/strings_pl.arb +++ b/res/values/strings_pl.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} pomyłka", - "use_ssl" : "Użyj SSL" + "use_ssl" : "Użyj SSL", + + "color_theme" : "Motyw kolorystyczny", + "light_theme" : "Lekki", + "bright_theme" : "Jasny", + "dark_theme" : "Ciemny" } \ No newline at end of file diff --git a/res/values/strings_pt.arb b/res/values/strings_pt.arb index e82032d7b..73b53cd16 100644 --- a/res/values/strings_pt.arb +++ b/res/values/strings_pt.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} erro", - "use_ssl" : "Use SSL" + "use_ssl" : "Use SSL", + + "color_theme" : "Tema de cor", + "light_theme" : "Luz", + "bright_theme" : "Brilhante", + "dark_theme" : "Sombria" } diff --git a/res/values/strings_ru.arb b/res/values/strings_ru.arb index b78b86ff1..d578c851c 100644 --- a/res/values/strings_ru.arb +++ b/res/values/strings_ru.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} ошибка", - "use_ssl" : "Использовать SSL" + "use_ssl" : "Использовать SSL", + + "color_theme" : "Цветовая тема", + "light_theme" : "Светлая", + "bright_theme" : "Яркая", + "dark_theme" : "Темная" } \ No newline at end of file diff --git a/res/values/strings_uk.arb b/res/values/strings_uk.arb index be77cd293..81f69352d 100644 --- a/res/values/strings_uk.arb +++ b/res/values/strings_uk.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} помилка", - "use_ssl" : "Використати SSL" + "use_ssl" : "Використати SSL", + + "color_theme" : "Кольорова тема", + "light_theme" : "Світла", + "bright_theme" : "Яскрава", + "dark_theme" : "Темна" } \ No newline at end of file diff --git a/res/values/strings_zh.arb b/res/values/strings_zh.arb index ee633aae8..4a6d2a6b2 100644 --- a/res/values/strings_zh.arb +++ b/res/values/strings_zh.arb @@ -423,5 +423,10 @@ "provider_error" : "${provider} 錯誤", - "use_ssl" : "使用SSL" + "use_ssl" : "使用SSL", + + "color_theme" : "顏色主題", + "light_theme" : "光", + "bright_theme" : "亮", + "dark_theme" : "黑暗" } \ No newline at end of file From 941e7c4dd8ca83957c024a696e8f8867129bd063 Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Fri, 11 Dec 2020 20:46:20 +0200 Subject: [PATCH 03/10] CAKE-182 | applied light theme to the app --- lib/palette.dart | 34 +-- lib/src/screens/dashboard/dashboard_page.dart | 21 +- .../dashboard/widgets/action_button.dart | 5 +- .../dashboard/widgets/address_page.dart | 6 +- .../dashboard/widgets/balance_page.dart | 12 +- .../screens/dashboard/widgets/header_row.dart | 5 +- .../screens/dashboard/widgets/trade_row.dart | 6 +- .../dashboard/widgets/transaction_raw.dart | 6 +- .../exchange/widgets/exchange_card.dart | 22 +- lib/src/screens/receive/receive_page.dart | 39 +++- .../screens/receive/widgets/qr_widget.dart | 10 +- lib/src/screens/send/send_template_page.dart | 2 +- lib/src/widgets/trail_button.dart | 5 +- lib/themes.dart | 200 +++++++++++++++++- 14 files changed, 302 insertions(+), 71 deletions(-) diff --git a/lib/palette.dart b/lib/palette.dart index 5558df381..5f18ac62f 100644 --- a/lib/palette.dart +++ b/lib/palette.dart @@ -4,7 +4,7 @@ class Palette { static const Color green = Color.fromRGBO(39, 206, 80, 1.0); static const Color red = Color.fromRGBO(255, 51, 51, 1.0); static const Color darkRed = Color.fromRGBO(204, 38, 38, 1.0); - static const Color blueAlice = Color.fromRGBO(231, 240, 253, 1.0); + static const Color blueAlice = Color.fromRGBO(229, 247, 255, 1.0); static const Color lightBlue = Color.fromRGBO(172, 203, 238, 1.0); static const Color lavender = Color.fromRGBO(237, 245, 252, 1.0); static const Color oceanBlue = Color.fromRGBO(30, 52, 78, 1.0); @@ -13,7 +13,6 @@ class Palette { static const Color blue = Color.fromRGBO(88, 143, 252, 1.0); static const Color darkLavender = Color.fromRGBO(229, 238, 250, 1.0); static const Color nightBlue = Color.fromRGBO(46, 57, 96, 1.0); - static const Color moderateOrangeYellow = Color.fromRGBO(245, 134, 82, 1.0); static const Color moderateOrange = Color.fromRGBO(235, 117, 63, 1.0); static const Color shineGreen = Color.fromRGBO(76, 189, 87, 1.0); @@ -22,9 +21,8 @@ class Palette { static const Color royalBlue = Color.fromRGBO(43, 114, 221, 1.0); static const Color lightRed = Color.fromRGBO(227, 87, 87, 1.0); static const Color persianRed = Color.fromRGBO(206, 55, 55, 1.0); - - // NEW DESIGN static const Color blueCraiola = Color.fromRGBO(69, 110, 255, 1.0); + static const Color blueGreyCraiola = Color.fromRGBO(106, 177, 207, 1.0); static const Color darkBlueCraiola = Color.fromRGBO(53, 86, 136, 1.0); static const Color pinkFlamingo = Color.fromRGBO(240, 60, 243, 1.0); static const Color redHat = Color.fromRGBO(209, 68, 37, 1.0); @@ -44,26 +42,16 @@ class Palette { static const Color moderateSlateBlue = Color.fromRGBO(129, 93, 251, 1.0); static const Color brightOrange = Color.fromRGBO(255, 102, 0, 1.0); static const Color dullGray = Color.fromRGBO(98, 98, 98, 1.0); - - // FIXME: Rename. - static const Color eee = Color.fromRGBO(236, 239, 245, 1.0); - static const Color xxx = Color.fromRGBO(72, 89, 109, 1); + static const Color protectiveBlue = Color.fromRGBO(33, 148, 255, 1.0); } class PaletteDark { - //static const Color distantBlue = Color.fromRGBO(70, 85, 133, 1.0); // mainBackgroundColor - static const Color lightDistantBlue = Color.fromRGBO(81, 96, 147, 1.0); // borderCardColor - static const Color gray = Color.fromRGBO(140, 153, 201, 1.0); // walletCardText - //static const Color violetBlue = Color.fromRGBO(51, 63, 104, 1.0); // walletCardAddressField - //static const Color moderateBlue = Color.fromRGBO(63, 77, 122, 1.0); // walletCardSubAddressField - //static const Color darkNightBlue = Color.fromRGBO(33, 43, 73, 1.0); // historyPanel - static const Color pigeonBlue = Color.fromRGBO(91, 112, 146, 1.0); // historyPanelText - static const Color moderateNightBlue = Color.fromRGBO(39, 53, 96, 1.0); // historyPanelButton - static const Color headerNightBlue = Color.fromRGBO(41, 52, 84, 1.0); // menuHeader - //static const Color lightNightBlue = Color.fromRGBO(48, 59, 95, 1.0); // menuList - static const Color moderatePurpleBlue = Color.fromRGBO(57, 74, 95, 1.0); // selectButtonText - - // NEW DESIGN + static const Color lightDistantBlue = Color.fromRGBO(81, 96, 147, 1.0); + static const Color gray = Color.fromRGBO(140, 153, 201, 1.0); + static const Color pigeonBlue = Color.fromRGBO(91, 112, 146, 1.0); + static const Color moderateNightBlue = Color.fromRGBO(39, 53, 96, 1.0); + static const Color headerNightBlue = Color.fromRGBO(41, 52, 84, 1.0); + static const Color moderatePurpleBlue = Color.fromRGBO(57, 74, 95, 1.0); static const Color backgroundColor = Color.fromRGBO(25, 35, 60, 1.0); static const Color nightBlue = Color.fromRGBO(35, 47, 79, 1.0); static const Color wildNightBlue = Color.fromRGBO(39, 53, 96, 1.0); @@ -96,8 +84,4 @@ class PaletteDark { static const Color lightPurpleBlue = Color.fromRGBO(120, 133, 170, 1.0); static const Color indicatorVioletBlue = Color.fromRGBO(59, 72, 119, 1.0); static const Color granite = Color.fromRGBO(48, 51, 60, 1.0); - - // FIXME: Rename. - static const Color eee = Color.fromRGBO(236, 239, 245, 1.0); - static const Color xxx = Color.fromRGBO(72, 89, 109, 1); } \ No newline at end of file diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index 0d7347d24..d94759404 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -50,7 +50,8 @@ class DashboardPage extends BasePage { @override Widget trailing(BuildContext context) { final menuButton = - Image.asset('assets/images/menu.png', color: Colors.white); + Image.asset('assets/images/menu.png', + color: Theme.of(context).accentTextTheme.display3.backgroundColor); return Container( alignment: Alignment.centerRight, @@ -65,12 +66,6 @@ class DashboardPage extends BasePage { final DashboardViewModel walletViewModel; final WalletAddressListViewModel addressListViewModel; - final sendImage = Image.asset('assets/images/upload.png', - height: 22.24, width: 24, color: Colors.white); - final exchangeImage = Image.asset('assets/images/transfer.png', - height: 24.27, width: 22.25, color: Colors.white); - final receiveImage = Image.asset('assets/images/download.png', - height: 22.24, width: 24, color: Colors.white); final controller = PageController(initialPage: 1); var pages = []; @@ -78,6 +73,15 @@ class DashboardPage extends BasePage { @override Widget body(BuildContext context) { + final sendImage = Image.asset('assets/images/upload.png', + height: 22.24, width: 24, + color: Theme.of(context).accentTextTheme.display3.backgroundColor); + final exchangeImage = Image.asset('assets/images/transfer.png', + height: 24.27, width: 22.25, + color: Theme.of(context).accentTextTheme.display3.backgroundColor); + final receiveImage = Image.asset('assets/images/download.png', + height: 22.24, width: 24, + color: Theme.of(context).accentTextTheme.display3.backgroundColor); _setEffects(); return SafeArea( @@ -100,7 +104,8 @@ class DashboardPage extends BasePage { dotWidth: 6.0, dotHeight: 6.0, dotColor: Theme.of(context).indicatorColor, - activeDotColor: Colors.white), + activeDotColor: Theme.of(context).accentTextTheme.display1 + .backgroundColor), )), Container( padding: EdgeInsets.only(left: 45, right: 45, bottom: 24), diff --git a/lib/src/screens/dashboard/widgets/action_button.dart b/lib/src/screens/dashboard/widgets/action_button.dart index 9f9fbc418..96635cbbb 100644 --- a/lib/src/screens/dashboard/widgets/action_button.dart +++ b/lib/src/screens/dashboard/widgets/action_button.dart @@ -39,7 +39,10 @@ class ActionButton extends StatelessWidget { SizedBox(height: 15), Text( title, - style: TextStyle(fontSize: 14, color: Colors.white), + style: TextStyle( + fontSize: 14, + color: Theme.of(context).accentTextTheme.display3 + .backgroundColor), ) ], ), diff --git a/lib/src/screens/dashboard/widgets/address_page.dart b/lib/src/screens/dashboard/widgets/address_page.dart index a31269a2b..6fc9985e1 100644 --- a/lib/src/screens/dashboard/widgets/address_page.dart +++ b/lib/src/screens/dashboard/widgets/address_page.dart @@ -43,13 +43,15 @@ class AddressPage extends StatelessWidget { style: TextStyle( fontSize: 14, fontWeight: FontWeight.w500, - color: Colors.white + color: Theme.of(context).accentTextTheme.display3 + .backgroundColor ), ), Icon( Icons.arrow_forward_ios, size: 14, - color: Colors.white, + color: Theme.of(context).accentTextTheme.display3 + .backgroundColor, ) ], ), diff --git a/lib/src/screens/dashboard/widgets/balance_page.dart b/lib/src/screens/dashboard/widgets/balance_page.dart index 5470c859d..6a9402c4b 100644 --- a/lib/src/screens/dashboard/widgets/balance_page.dart +++ b/lib/src/screens/dashboard/widgets/balance_page.dart @@ -25,7 +25,8 @@ class BalancePage extends StatelessWidget { style: TextStyle( fontSize: 40, fontWeight: FontWeight.bold, - color: Theme.of(context).indicatorColor, + color: Theme.of(context).accentTextTheme.display2 + .backgroundColor, height: 1), ); }), @@ -35,7 +36,8 @@ class BalancePage extends StatelessWidget { style: TextStyle( fontSize: 12, fontWeight: FontWeight.w600, - color: Theme.of(context).indicatorColor, + color: Theme.of(context).accentTextTheme.display2 + .backgroundColor, height: 1), ); }), @@ -45,7 +47,8 @@ class BalancePage extends StatelessWidget { style: TextStyle( fontSize: 54, fontWeight: FontWeight.bold, - color: Colors.white, + color: Theme.of(context).accentTextTheme.display3 + .backgroundColor, height: 1), maxLines: 1, textAlign: TextAlign.center); @@ -56,7 +59,8 @@ class BalancePage extends StatelessWidget { style: TextStyle( fontSize: 18, fontWeight: FontWeight.w500, - color: Theme.of(context).indicatorColor, + color: Theme.of(context).accentTextTheme.display2 + .backgroundColor, height: 1), textAlign: TextAlign.center); }), diff --git a/lib/src/screens/dashboard/widgets/header_row.dart b/lib/src/screens/dashboard/widgets/header_row.dart index 5b63f7a0e..2ba4cd8c9 100644 --- a/lib/src/screens/dashboard/widgets/header_row.dart +++ b/lib/src/screens/dashboard/widgets/header_row.dart @@ -27,14 +27,15 @@ class HeaderRow extends StatelessWidget { style: TextStyle( fontSize: 20, fontWeight: FontWeight.w500, - color: Colors.white + color: Theme.of(context).accentTextTheme.display3.backgroundColor ), ), GestureDetector( onTap: () { showPopUp( context: context, - builder: (context) => FilterWidget(dashboardViewModel: dashboardViewModel) + builder: (context) => + FilterWidget(dashboardViewModel: dashboardViewModel) ); }, child: Container( diff --git a/lib/src/screens/dashboard/widgets/trade_row.dart b/lib/src/screens/dashboard/widgets/trade_row.dart index 82bf2fc3e..4a4979699 100644 --- a/lib/src/screens/dashboard/widgets/trade_row.dart +++ b/lib/src/screens/dashboard/widgets/trade_row.dart @@ -48,14 +48,16 @@ class TradeRow extends StatelessWidget { style: TextStyle( fontSize: 16, fontWeight: FontWeight.w500, - color: Colors.white + color: Theme.of(context).accentTextTheme. + display3.backgroundColor )), formattedAmount != null ? Text(formattedAmount + ' ' + amountCrypto, style: TextStyle( fontSize: 16, fontWeight: FontWeight.w500, - color: Colors.white + color: Theme.of(context).accentTextTheme. + display3.backgroundColor )) : Container() ]), diff --git a/lib/src/screens/dashboard/widgets/transaction_raw.dart b/lib/src/screens/dashboard/widgets/transaction_raw.dart index 67e13ce43..799a02ec6 100644 --- a/lib/src/screens/dashboard/widgets/transaction_raw.dart +++ b/lib/src/screens/dashboard/widgets/transaction_raw.dart @@ -60,12 +60,14 @@ class TransactionRow extends StatelessWidget { style: TextStyle( fontSize: 16, fontWeight: FontWeight.w500, - color: Colors.white)), + color: Theme.of(context).accentTextTheme. + display3.backgroundColor)), Text(formattedAmount, style: TextStyle( fontSize: 16, fontWeight: FontWeight.w500, - color: Colors.white)) + color: Theme.of(context).accentTextTheme. + display3.backgroundColor)) ]), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, diff --git a/lib/src/screens/exchange/widgets/exchange_card.dart b/lib/src/screens/exchange/widgets/exchange_card.dart index d74f7bcca..45f6f475c 100644 --- a/lib/src/screens/exchange/widgets/exchange_card.dart +++ b/lib/src/screens/exchange/widgets/exchange_card.dart @@ -166,8 +166,8 @@ class ExchangeCardState extends State { fontSize: 16, fontWeight: FontWeight.w600, color: Theme.of(context) - .textTheme - .subhead + .accentTextTheme + .display4 .decorationColor), validator: _isAmountEditable ? widget.currencyValueValidator @@ -211,8 +211,8 @@ class ExchangeCardState extends State { fontSize: 10, height: 1.2, color: Theme.of(context) - .textTheme - .subhead + .accentTextTheme + .display4 .decorationColor), ) : Offstage(), @@ -224,8 +224,8 @@ class ExchangeCardState extends State { fontSize: 10, height: 1.2, color: Theme.of(context) - .textTheme - .subhead + .accentTextTheme + .display4 .decorationColor)) : Offstage(), ]), @@ -239,7 +239,10 @@ class ExchangeCardState extends State { fontSize: 14, fontWeight: FontWeight.w500, color: - Theme.of(context).textTheme.subhead.decorationColor), + Theme.of(context) + .accentTextTheme + .display4 + .decorationColor), )) : Offstage(), _isAddressEditable @@ -263,7 +266,10 @@ class ExchangeCardState extends State { fontSize: 16, fontWeight: FontWeight.w600, color: - Theme.of(context).textTheme.subhead.decorationColor), + Theme.of(context) + .accentTextTheme + .display4 + .decorationColor), buttonColor: widget.addressButtonsColor, validator: widget.addressTextFieldValidator, ), diff --git a/lib/src/screens/receive/receive_page.dart b/lib/src/screens/receive/receive_page.dart index c03bf36c7..6a84408e6 100644 --- a/lib/src/screens/receive/receive_page.dart +++ b/lib/src/screens/receive/receive_page.dart @@ -32,11 +32,41 @@ class ReceivePage extends BasePage { @override Color get backgroundDarkColor => Colors.transparent; - @override - Color get titleColor => Colors.white; - final FocusNode _cryptoAmountFocus; + @override + Widget leading(BuildContext context) { + final _backButton = Icon(Icons.arrow_back_ios, + color: Theme.of(context).accentTextTheme.display3.backgroundColor, + size: 16,); + + return SizedBox( + height: 37, + width: 37, + child: ButtonTheme( + minWidth: double.minPositive, + child: FlatButton( + highlightColor: Colors.transparent, + splashColor: Colors.transparent, + padding: EdgeInsets.all(0), + onPressed: () => onClose(context), + child: _backButton), + ), + ); + } + + @override + Widget middle(BuildContext context) { + return Text( + title, + style: TextStyle( + fontSize: 18.0, + fontWeight: FontWeight.bold, + fontFamily: 'Lato', + color: Theme.of(context).accentTextTheme.display3.backgroundColor), + ); + } + @override Widget Function(BuildContext, Widget) get rootWrapper => (BuildContext context, Widget scaffold) => Container( @@ -51,7 +81,8 @@ class ReceivePage extends BasePage { @override Widget trailing(BuildContext context) { final shareImage = - Image.asset('assets/images/share.png', color: Colors.white); + Image.asset('assets/images/share.png', + color: Theme.of(context).accentTextTheme.display3.backgroundColor); return SizedBox( height: 20.0, diff --git a/lib/src/screens/receive/widgets/qr_widget.dart b/lib/src/screens/receive/widgets/qr_widget.dart index e94351266..a04a52890 100644 --- a/lib/src/screens/receive/widgets/qr_widget.dart +++ b/lib/src/screens/receive/widgets/qr_widget.dart @@ -47,8 +47,8 @@ class QRWidget extends StatelessWidget { child: QrImage( data: addressListViewModel.uri.toString(), backgroundColor: Colors.transparent, - foregroundColor: Colors.white, - //Theme.of(context).textTheme.headline.color, + foregroundColor: Theme.of(context).accentTextTheme. + display3.backgroundColor, ))))), Spacer(flex: 3) ]), @@ -71,7 +71,8 @@ class QRWidget extends StatelessWidget { ], textAlign: TextAlign.center, hintText: S.of(context).receive_amount, - textColor: Colors.white, + textColor: Theme.of(context).accentTextTheme. + display3.backgroundColor, borderColor: Theme.of(context) .textTheme .headline @@ -110,7 +111,8 @@ class QRWidget extends StatelessWidget { style: TextStyle( fontSize: 16, fontWeight: FontWeight.w500, - color: Colors.white), + color: Theme.of(context).accentTextTheme. + display3.backgroundColor), ), ), Padding( diff --git a/lib/src/screens/send/send_template_page.dart b/lib/src/screens/send/send_template_page.dart index bb2b1ec6a..77b63c7af 100644 --- a/lib/src/screens/send/send_template_page.dart +++ b/lib/src/screens/send/send_template_page.dart @@ -245,7 +245,7 @@ class SendTemplatePage extends BasePage { } }, text: S.of(context).save, - color: Theme.of(context).accentTextTheme.subtitle.decorationColor, + color: Colors.green, textColor: Theme.of(context).accentTextTheme.headline.decorationColor, ), diff --git a/lib/src/widgets/trail_button.dart b/lib/src/widgets/trail_button.dart index a7c4caecb..8fa1bf5e5 100644 --- a/lib/src/widgets/trail_button.dart +++ b/lib/src/widgets/trail_button.dart @@ -21,7 +21,10 @@ class TrailButton extends StatelessWidget { child: Text( caption, style: TextStyle( - color: Theme.of(context).textTheme.subhead.decorationColor, + color: Theme.of(context) + .accentTextTheme + .display4 + .decorationColor, fontWeight: FontWeight.w500, fontSize: 14), ), diff --git a/lib/themes.dart b/lib/themes.dart index 310acc3df..ae6c13a6f 100644 --- a/lib/themes.dart +++ b/lib/themes.dart @@ -35,7 +35,7 @@ class Themes extends EnumerableItem with Serializable { case Themes.light: return lightTheme; case Themes.bright: - return lightTheme; + return brightTheme; case Themes.dark: return darkTheme; default: @@ -58,6 +58,184 @@ class Themes extends EnumerableItem with Serializable { } static final ThemeData lightTheme = ThemeData( + fontFamily: 'Lato', + brightness: Brightness.light, + backgroundColor: Colors.white, + accentColor: Colors.white, // first gradient color + scaffoldBackgroundColor: Colors.white, // second gradient color + primaryColor: Colors.white, // third gradient color + buttonColor: Palette.blueAlice, // action buttons on dashboard page + indicatorColor: PaletteDark.darkCyanBlue, // page indicator + hoverColor: Palette.darkBlueCraiola, // amount hint text (receive page) + dividerColor: Palette.paleBlue, + hintColor: Palette.gray, + textTheme: TextTheme( + title: TextStyle( + color: Palette.darkBlueCraiola, // sync_indicator text + backgroundColor: Palette.blueAlice, // synced sync_indicator + decorationColor: Palette.blueAlice.withOpacity(0.75), // not synced sync_indicator + ), + caption: TextStyle( + color: Palette.shineOrange, // not synced light + decorationColor: PaletteDark.wildBlue, // filter icon + ), + overline: TextStyle( + color: Palette.blueAlice, // filter button + backgroundColor: PaletteDark.darkCyanBlue, // date section row + decorationColor: Palette.blueAlice // icons (transaction and trade rows) + ), + subhead: TextStyle( + color: Palette.blueAlice, // address button border + decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) + ), + headline: TextStyle( + color: Colors.white, // qr code + decorationColor: Palette.darkBlueCraiola, // bottom border of amount (receive page) + ), + display1: TextStyle( + color: PaletteDark.lightBlueGrey, // icons color (receive page) + decorationColor: Palette.moderateLavender, // icons background (receive page) + ), + display2: TextStyle( + color: Palette.darkBlueCraiola, // text color of tiles (receive page) + decorationColor: Palette.blueAlice // background of tiles (receive page) + ), + display3: TextStyle( + color: Colors.white, // text color of current tile (receive page), + //decorationColor: Palette.blueCraiola // background of current tile (receive page) + decorationColor: Palette.blueCraiola // background of current tile (receive page) + ), + display4: TextStyle( + color: Palette.violetBlue, // text color of tiles (account list) + decorationColor: Colors.white // background of tiles (account list) + ), + subtitle: TextStyle( + color: Palette.protectiveBlue, // text color of current tile (account list) + decorationColor: Colors.white // background of current tile (account list) + ), + body1: TextStyle( + color: Palette.moderatePurpleBlue, // scrollbar thumb + decorationColor: Palette.periwinkleCraiola // scrollbar background + ), + body2: TextStyle( + color: Palette.moderateLavender, // menu header + decorationColor: Colors.white, // menu background + ) + ), + primaryTextTheme: TextTheme( + title: TextStyle( + color: Palette.darkBlueCraiola, // title color + backgroundColor: Palette.wildPeriwinkle // textfield underline + ), + caption: TextStyle( + color: PaletteDark.pigeonBlue, // secondary text + decorationColor: Palette.wildLavender // menu divider + ), + overline: TextStyle( + color: Palette.darkGray, // transaction/trade details titles + decorationColor: PaletteDark.darkCyanBlue, // placeholder + ), + subhead: TextStyle( + color: Palette.blueCraiola, // first gradient color (send page) + decorationColor: Palette.blueGreyCraiola // second gradient color (send page) + ), + headline: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border color (send page) + decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) + ), + display1: TextStyle( + color: Colors.white.withOpacity(0.2), // text field button color (send page) + decorationColor: Colors.white // text field button icon color (send page) + ), + display2: TextStyle( + color: Colors.white.withOpacity(0.5), // estimated fee (send page) + decorationColor: Palette.moderateLavender // template dotted border (send page) + ), + display3: TextStyle( + color: Palette.darkBlueCraiola, // template new text (send page) + decorationColor: Palette.blueAlice // template background color (send page) + ), + display4: TextStyle( + color: Palette.darkBlueCraiola, // template title (send page) + decorationColor: Palette.niagara // receive amount text (exchange page) + ), + subtitle: TextStyle( + color: Palette.blueCraiola, // first gradient color top panel (exchange page) + decorationColor: Palette.blueGreyCraiola // second gradient color top panel (exchange page) + ), + body1: TextStyle( + color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) + decorationColor: Palette.blueGreyCraiola.withOpacity(0.7) // second gradient color bottom panel (exchange page) + ), + body2: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) + decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) + ) + ), + focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) + accentTextTheme: TextTheme( + title: TextStyle( + color: Colors.white, // picker background + backgroundColor: Palette.periwinkleCraiola, // picker divider + decorationColor: Colors.white // dialog background + ), + caption: TextStyle( + color: Palette.blueAlice, // container (confirm exchange) + backgroundColor: Palette.blueAlice, // button background (confirm exchange) + decorationColor: Palette.darkBlueCraiola, // text color (information page) + ), + subtitle: TextStyle( + color: Palette.darkBlueCraiola, // QR code (exchange trade page) + backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) + decorationColor: Palette.protectiveBlue // crete new wallet button background (wallet list page) + ), + headline: TextStyle( + color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) + backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) + decorationColor: Colors.white // restore wallet button text color (wallet list page) + ), + subhead: TextStyle( + color: Palette.darkGray, // titles color (filter widget) + backgroundColor: Palette.periwinkle, // divider color (filter widget) + decorationColor: Colors.white // checkbox background (filter widget) + ), + overline: TextStyle( + color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) + decorationColor: Colors.white, // menu subname + ), + display1: TextStyle( + color: Palette.blueCraiola, // first gradient color (menu header) + decorationColor: Palette.blueGreyCraiola, // second gradient color(menu header) + backgroundColor: PaletteDark.darkNightBlue // active dot color + ), + display2: TextStyle( + color: Palette.shadowWhite, // action button color (address text field) + decorationColor: Palette.darkGray, // hint text (seed widget) + backgroundColor: Palette.darkBlueCraiola // text on balance page + ), + display3: TextStyle( + color: Palette.darkGray, // hint text (new wallet page) + decorationColor: Palette.periwinkleCraiola, // underline (new wallet page) + backgroundColor: Palette.darkBlueCraiola // menu, icons, balance (dashboard page) + ), + display4: TextStyle( + color: Palette.darkGray, // switch background (settings page) + decorationColor: Colors.white.withOpacity(0.4) // hint text (exchange page) + ), + body1: TextStyle( + color: Palette.darkGray, // indicators (PIN code) + decorationColor: Palette.darkGray // switch (PIN code) + ), + body2: TextStyle( + color: Palette.protectiveBlue, // primary buttons, alert right buttons + decorationColor: Palette.brightOrange, // alert left button, + backgroundColor: Palette.dullGray // keyboard bar color + ), + ), + cardColor: Palette.protectiveBlue // bottom button (action list) + ); + + static final ThemeData brightTheme = ThemeData( fontFamily: 'Lato', brightness: Brightness.light, backgroundColor: Colors.white, @@ -206,18 +384,22 @@ class Themes extends EnumerableItem with Serializable { ), display1: TextStyle( color: Palette.blueCraiola, // first gradient color (menu header) - decorationColor: Palette.pinkFlamingo // second gradient color(menu header) + decorationColor: Palette.pinkFlamingo, // second gradient color(menu header) + backgroundColor: Colors.white // active dot color ), display2: TextStyle( color: Palette.shadowWhite, // action button color (address text field) - decorationColor: Palette.darkGray // hint text (seed widget) + decorationColor: Palette.darkGray, // hint text (seed widget) + backgroundColor: Colors.white.withOpacity(0.5) // text on balance page ), display3: TextStyle( color: Palette.darkGray, // hint text (new wallet page) - decorationColor: Palette.periwinkleCraiola // underline (new wallet page) + decorationColor: Palette.periwinkleCraiola, // underline (new wallet page) + backgroundColor: Colors.white // menu, icons, balance (dashboard page) ), display4: TextStyle( color: Palette.darkGray, // switch background (settings page) + decorationColor: Colors.white.withOpacity(0.4) // hint text (exchange page) ), body1: TextStyle( color: Palette.darkGray, // indicators (PIN code) @@ -380,18 +562,22 @@ class Themes extends EnumerableItem with Serializable { ), display1: TextStyle( color: PaletteDark.deepPurpleBlue, // first gradient color (menu header) - decorationColor: PaletteDark.deepPurpleBlue // second gradient color(menu header) + decorationColor: PaletteDark.deepPurpleBlue, // second gradient color(menu header) + backgroundColor: Colors.white // active dot color ), display2: TextStyle( color: PaletteDark.nightBlue, // action button color (address text field) - decorationColor: PaletteDark.darkCyanBlue // hint text (seed widget) + decorationColor: PaletteDark.darkCyanBlue, // hint text (seed widget) + backgroundColor: PaletteDark.cyanBlue // text on balance page ), display3: TextStyle( color: PaletteDark.cyanBlue, // hint text (new wallet page) - decorationColor: PaletteDark.darkGrey // underline (new wallet page) + decorationColor: PaletteDark.darkGrey, // underline (new wallet page) + backgroundColor: Colors.white // menu, icons, balance (dashboard page) ), display4: TextStyle( color: PaletteDark.deepVioletBlue, // switch background (settings page) + decorationColor: PaletteDark.lightBlueGrey // hint text (exchange page) ), body1: TextStyle( color: PaletteDark.indicatorVioletBlue, // indicators (PIN code) From 85497a121861dc818c28d3cba219e611154449cf Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Mon, 14 Dec 2020 19:54:56 +0200 Subject: [PATCH 04/10] CAKE-182 | changed colors on dashboard page for light theme; changed action buttons icons on dashboard page; changed buttons colors on alerts for light theme; deleted item_from_theme.dart; added getters (isLightTheme, isBrightTheme, isDarkTheme) to Themes class; applied getters to the app --- assets/images/2.0x/transfer.png | Bin 0 -> 1081 bytes assets/images/2.0x/upload.png | Bin 0 -> 760 bytes assets/images/3.0x/transfer.png | Bin 0 -> 1609 bytes assets/images/3.0x/upload.png | Bin 0 -> 1082 bytes assets/images/transfer.png | Bin 408 -> 629 bytes assets/images/upload.png | Bin 341 -> 440 bytes lib/entities/item_from_theme.dart | 17 -------- lib/main.dart | 32 ++++++--------- lib/src/screens/base_page.dart | 33 ++++------------ .../screens/new_wallet/new_wallet_page.dart | 14 ++----- .../new_wallet/new_wallet_type_page.dart | 16 ++------ lib/src/screens/seed/pre_seed_page.dart | 16 ++------ lib/src/screens/seed/wallet_seed_page.dart | 15 ++----- .../seed_language/seed_language_page.dart | 14 ++----- lib/src/screens/welcome/welcome_page.dart | 14 ++----- lib/src/widgets/alert_with_one_action.dart | 5 ++- lib/src/widgets/base_alert_dialog.dart | 25 ++++++++++-- lib/themes.dart | 37 ++++++++++++------ 18 files changed, 88 insertions(+), 150 deletions(-) create mode 100644 assets/images/2.0x/transfer.png create mode 100644 assets/images/2.0x/upload.png create mode 100644 assets/images/3.0x/transfer.png create mode 100644 assets/images/3.0x/upload.png delete mode 100644 lib/entities/item_from_theme.dart diff --git a/assets/images/2.0x/transfer.png b/assets/images/2.0x/transfer.png new file mode 100644 index 0000000000000000000000000000000000000000..61be7914295d12487de5a3e9bcf192234454b30a GIT binary patch literal 1081 zcmV-91jhS`P)NQX=!Ieie&Awa?@ zNSmVwwL8KY-)81~cQ)rEBzVV8B%a25AKrc6+ugaFK@cE4o=?UdJVbzU#a7u;an1rE z3=kmh7&#K(P0eJY3%Am_d=i8ZF>r35uF;R>9g3O|F;FU+<(Q$e&;}C-f;^?YP<3#N znn~}JrF&0^8epVNh#O!eO|-=TBW2=B1L>UEok-kGs#vufTEuXS9tCQx;Z&0e9xs0T zRvN3Z^8Uu_(p7z4YM_5SKZsSFR|sh@rVD|k{lZKixA+B^aPa$utAItva8?f1=eDE% z9T`S5qwkiGryF5VRy?DE{u5QFX)Kzt9BW}sJUij*O*4=g$sYn@y50elQ9)6mItDG^ zr2kNAeH+=vr9$IR(5xrX-77c%^*uv>P^C)cEX(hiNCWJW?wayDr^^cmg_&j0L}qMp zl{%idOnl^j$Phiy`MMEYrX@EGVFQipk2{ass&7~03+FoGeY^;E2>#4DDtqv;wkLu; zkZ{2C+Xmp&zapO5T_-I{)t`E8Mm((n_}pt)dxe<~povz+`|NMbt%19&f!9si-_Wjs z%*b2bwC)MouwOwFy2Sf93j7D_zMHt=8c;DK2u}{GYY)(fZt)DF3Zjov)%pzR#*G}B z#b1Vq0i|krfV6lEq~?=*L{8Qn4CNJ%$#D7Vjn_ItaAI&ubryK~9_*UF3W?$!#h&rLI#k zlN2AS8Cm;<*%UW|JwWxBAdT$mGM3;k5q|RFoPDL<_BglCI6_$N*i=k z;}w!tBYO>1#+t+nQp@htbok*ky$ARP&Za0W+-~ZHN{;bc_XdJPfGKDLtfiKkHqY#D z%j@ovLX}f~Xhkejsc|^CKAJaaiOq)x10B#oC64nIv>O4tU=18o8c14U3!H6KL zfvOByW1K_n0V2~k)}k14Bi*sMLHrKT(#-@>__j6aSWyG9u zRG-+9Ey=?|QXNx?j3c*cs?FsB0To@i#?N;9fjC{@gt!R0e}2$e(x=YBQ`a9X5o1z9 z>#)H#yfxJ+UCu9ORo`#t#NR%ym(E|FdnSIFPK$w3Vkkt~!TIXR`tGeaFYgyS@6kbT qls~JSH$9aIHc%}U%$!9GB|iZ>EFsJn0e3Y30000Q+SK~#7F?VHVS z8$}er-y46V&`Ovi2#K^Oq#o+hroagY#2HIqtG7CT0VxO42#MGyCq1BW;2ie`4v72# zl(@H2r%H0D;1*wio~Vm}CboAT^VYSqv-aBgusvhs-zB@_oz3je^XYkuV3_#z{B*>@ zH9$xJ;A*+Ja1$&-fMFsMvQ0S*&CjHk*T5o-3nGA*v;>5VO_GcYLJH;7pQ@f{k0b;O zm`UA^1IkTx7}Gu=D3sT4&4EFz5X9Ij$r?e7jgqVq#MmauIzfz0lB^WO*dobVL5vNO ztQN$WmSnvk#-yZU35qAPvB=bmH$cj`DxE4c#$ZIKB}okZf|?(6m2@q=yrlAEn%7Vj zQB>5?My)3A?QASo;D{Va(ADet1Uk5MxTv%X1k5}rF5GFIU-@VyDMIu^U z8Q9wN)8(L%W`Wn9!n0h_1$90bL!TznN&Wb2A3t!pHH=xGu&s*`tQ+E zgPz}D?YM;*25mWraTs8E-d5d*Bax>K)82Fec=PAt!m6I;r)hU!g*hq1lEd8pX0Z|y z#I>d3O_xAR{C~Y^njp9K_?wobx&M=#7A%RM&6gaDMyIqvNfShXH?+$U3chwcbVebk zMf2I{jyH|S?a13`g3vb+BuCFYY(^=k1xYAq3Ce-DnY9J+Y}ucAl(ol%9On5mYNK*E zJk>5kTM*TSZy3cL7!juAv>~c^PbD7q!-s-|^sSU>By%0(a=`6-1E00$T5J?FC#B}( z^uxZLRg2^><^?&zJ5pLDhcPbb;r9z0YF2yRA(}g@7K}E@VT|`d49{xSp8{Bj@fu`1 z6G45L2qwozugp8)u4Fl zc04R`8v&OHsPI;L#rU?jHG*6@C^x+!E|Ta&FpL#~y2)V>=^hxyxS$|8ykGU8xR?dQ zv<0CQ{`V!OVaW87Q!XxMzz{-&pR|t;6B`xZb<_TR>Oo?QoJ3}gH%#?S1E=w{b=VeE zUjLl;!2&nX28m5I=kNW;3GkJp(Ku-D3F>?E1lndHc1C)f8k^)KQeSgO$0u4MLCG6P zrFYUqIqh8SQ(sH3+<*aLm7MG*`~!bw)SN5nO;?qopq=|O&ZL+3Ko5bb)@yWm=ajn* zR>@KQPIdqB`G~}yK!4V~a`Dy$@3kGne7BgHNEA0)@qQ=47CG5$7T!sHiK^e3?IMT6 ziF5uuU4uBUq?T6&`r0N#P^i}_cbwW}S`PO!2XKH5Xh6OGFNZaM(KT|HXtlh)*zv}7 zVD$4$I$r>PKvnx@P*T0yE{O1+Bb}$R&K+B)v|u?E0Gq)w_pVz#{gS$h<0uF84g2}7Gp4FKYre71IQGbnPm=ThV0`mK3om;0m& z^d?5=Xrn<`ilohQl$j@l_^E2;@-Y`rDQo9Q00000NkvXX Hu0mjfe&PhY literal 0 HcmV?d00001 diff --git a/assets/images/3.0x/upload.png b/assets/images/3.0x/upload.png new file mode 100644 index 0000000000000000000000000000000000000000..f42a50eca6d952a120d6bab9483448ca7524d6da GIT binary patch literal 1082 zcmeAS@N?(olHy`uVBq!ia0vp^9w5xY1|&n@ZgvM!oCO|{#S9FJ79h;%I?XTvD9BhG z{`>cG z8y-1#{Nke{?EBm|up6(*jQ`DQ1m(i?l>|EY~1qc26U-VN*Poj>WA+6iq-vpP?y?gbG= z#kakIY>!Vd7w%kgYuT0)7W**z^hQb5%)G|Cx1(*uLsnmnT)ck!!{;+)W+zU{3RvHC zyh3k9jKQj~*-HdB_Hd}Ke|qD_q#LyjolZWRtDBDt2rx|3y)Cx#%Q3$qNyUA$4Q#s> zDX|t#XtMBdlv$#{7bL*0+0iU=#F6Wf0+O(-NUj!FFJK&nX_lhn$MmQwnFA`-9$b{X-9ugsg0kuOxHPQmg{wLv(7UCBi@GxxOTnq zZ$DAWQX1(|Ovpx{Lljv`)nhq31)6RgQ8&A}NLgqzYCtyRBMnq9dK9&v?=Mpe()E9kn=_Lt+)ppxU3 zPLT_pZPWWCCW#9;JnG~(X@1yc+?CGdsAG{-Vx#fPZOwA|p4mGBTke0*W__R&m+?-k z#A|7WQnbpEiCfR4E&i4xV|?B9umO)o4Y&O@ollZ;nzYn+o|$|)isz#39hr+;3O?@Z z-=rpFsWIi@!fS2)54>zyPW*bh&)a0@%;l8@2fs?1s6MQzx%y>SEnt# zyzrTw<&{(SPA00IGZ(6R)({2rP0gaJV*GAnQ@|_e*ORo-~oQ%6pB-b3ofG!+`N9o-E6yxR sx_k3gJnL4Q%XmdKI;Vst01igiz5oCK literal 0 HcmV?d00001 diff --git a/assets/images/transfer.png b/assets/images/transfer.png index 383c35fb149667f96a7d9ff74e6810884d1a0045..d388f818f9461b9ed65f1f11940d781d528e4576 100644 GIT binary patch delta 555 zcmV+`0@VGO1N8)uReu5sNkl=Di;sB7ztrU3R0nvP`nlHzh4~x&d{knictO~%z|CObp z=uzhQt30Z?RDb*Dry>C@M?eMnUrf&UDY-2QX>C;Vz9TSl~^ zZhx%*(5j!e69GNdDdS~n1Ee-;`3@M$2yh$SIUs2goaP&6g;+|Q(Y$WCv;oRI!iH)0 z5*zC(ldcdj6>HAon=~DlJ%*}fs7uj11F93?`?RYb-G4~tGM*b%L3RcOQ*ne+=td41gFJj&Fc0p9 t7$_DnDkMY;a2@ja*{k~D-tQxwbr-qx_2Kerb%_7~002ovPDHLkV1k5x2|fS- delta 332 zcmV-S0ki(~1egPmReu33Nkl&}^+SZ!$#-Nkju1S4!1GT1N3UYtBLW`$M6(nBCEz66Z}{T9zi_?>d9ypf;_! zRLyIGSipT0%|%>uE|;62*8fShBD*hjk+Z(+lAyo85gkO`qe`(MM~oo8F|paW6a#q_ eUed(;hrb1`nnArsT}luD0000nF1-k0nQEFArfVW9S5NmDZCpy1yWvNt=2R1S7Yyd00%lzdGh6c2y4a$Au~0rTW5c&5{iWPfENLbk;{U5puWVEpii zd$Jd_FzrOcaAN_p_{2ErDF4rq{_j#`->{^ouc(vKtdnn4Yay<`2Y zZe=Z_zO>A)R$MBGK~!tPx-I&V`3t@lA6fI{Zp~J;;j0)MbL|`Ldxnvxp-)Tz0000< KMNUMnLSTY0w5C-6 delta 265 zcmV+k0rvj51JweMReu2LNkl=qQfh2D$+wh!ZdZ zBZw1#6Vz97#EVhjqNrmSQ5zTLuR)L(Fl>#iJ6k zJa)#IvTOcKVeZ(xxQqxpdV zsOfHs77#q4b;#fhZ7Dt*sF<=uO;!G@sFykExIhcd1XTd^pA#twC93J!-(!+A-q;LB zsETJ;vV$E}putpI8 P0000 items}) { - switch (currentTheme) { - case Themes.light: - return items[Themes.light]; - case Themes.bright: - return items[Themes.bright]; - case Themes.dark: - return items[Themes.dark]; - default: - return items[Themes.light]; - } -} \ No newline at end of file diff --git a/lib/main.dart b/lib/main.dart index 3f72adcba..b72d10e61 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,5 +1,3 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; -import 'package:cake_wallet/themes.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:hive/hive.dart'; @@ -125,31 +123,25 @@ class App extends StatelessWidget { @override Widget build(BuildContext context) { final settingsStore = getIt.get().settingsStore; - final currentTheme = settingsStore.currentTheme ?? Themes.light; - final Map items = { - Themes.light: Brightness.dark, - Themes.bright: Brightness.dark, - Themes.dark: Brightness.light - }; - final statusBarColor = Colors.transparent; - final statusBarBrightness = - itemFromTheme(currentTheme: currentTheme, items: items) as Brightness - ?? Brightness.dark; - final statusBarIconBrightness = - itemFromTheme(currentTheme: currentTheme, items: items) as Brightness - ?? Brightness.dark; final authenticationStore = getIt.get(); final initialRoute = authenticationStore.state == AuthenticationState.denied ? Routes.disclaimer : Routes.login; - SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle( - statusBarColor: statusBarColor, - statusBarBrightness: statusBarBrightness, - statusBarIconBrightness: statusBarIconBrightness)); - return Observer(builder: (BuildContext context) { + final currentTheme = settingsStore.currentTheme; + final statusBarBrightness = currentTheme.isDarkTheme + ? Brightness.dark + : Brightness.light; + final statusBarIconBrightness = currentTheme.isDarkTheme + ? Brightness.light + : Brightness.dark; + SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle( + statusBarColor: statusBarColor, + statusBarBrightness: statusBarBrightness, + statusBarIconBrightness: statusBarIconBrightness)); + return Root( authenticationStore: authenticationStore, navigatorKey: navigatorKey, diff --git a/lib/src/screens/base_page.dart b/lib/src/screens/base_page.dart index d7e567da8..99d125ec8 100644 --- a/lib/src/screens/base_page.dart +++ b/lib/src/screens/base_page.dart @@ -1,4 +1,3 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/themes.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; @@ -14,17 +13,11 @@ abstract class BasePage extends StatelessWidget { : _scaffoldKey = GlobalKey(); final GlobalKey _scaffoldKey; - static final Image closeButtonImage = + final Image closeButtonImage = Image.asset('assets/images/close_button.png'); - static final Image closeButtonImageDarkTheme = + final Image closeButtonImageDarkTheme = Image.asset('assets/images/close_button_dark_theme.png'); - final Map buttonItems = { - Themes.light: closeButtonImage, - Themes.bright: closeButtonImage, - Themes.dark: closeButtonImageDarkTheme - }; - String get title => null; bool get isModalBackButton => false; @@ -60,8 +53,7 @@ abstract class BasePage extends StatelessWidget { color: titleColor ?? Theme.of(context).primaryTextTheme.title.color, size: 16,); final _closeButton = - itemFromTheme(currentTheme: currentTheme, items: buttonItems) as Image - ?? closeButtonImage; + currentTheme.isDarkTheme ? closeButtonImageDarkTheme : closeButtonImage; return SizedBox( height: 37, @@ -97,7 +89,8 @@ abstract class BasePage extends StatelessWidget { Widget floatingActionButton(BuildContext context) => null; ObstructingPreferredSizeWidget appBar(BuildContext context) { - final appBarColor = _setBackgroundColor(); + final appBarColor = + currentTheme.isDarkTheme ? backgroundDarkColor : backgroundLightColor; switch (appBarStyle) { case AppBarStyle.regular: @@ -139,7 +132,8 @@ abstract class BasePage extends StatelessWidget { @override Widget build(BuildContext context) { - final _backgroundColor = _setBackgroundColor(); + final _backgroundColor = + currentTheme.isDarkTheme ? backgroundDarkColor : backgroundLightColor; final root = Scaffold( key: _scaffoldKey, @@ -153,17 +147,4 @@ abstract class BasePage extends StatelessWidget { return rootWrapper?.call(context, root) ?? root; } - - Color _setBackgroundColor() { - switch (currentTheme) { - case Themes.light: - return backgroundLightColor; - case Themes.bright: - return backgroundLightColor; - case Themes.dark: - return backgroundDarkColor; - default: - return backgroundLightColor; - } - } } diff --git a/lib/src/screens/new_wallet/new_wallet_page.dart b/lib/src/screens/new_wallet/new_wallet_page.dart index 1f3eb8a3e..86ad09d86 100644 --- a/lib/src/screens/new_wallet/new_wallet_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_page.dart @@ -14,30 +14,22 @@ import 'package:cake_wallet/src/screens/seed_language/widgets/seed_language_pick import 'package:cake_wallet/src/widgets/alert_with_one_action.dart'; import 'package:cake_wallet/core/execution_state.dart'; import 'package:cake_wallet/view_model/wallet_new_vm.dart'; -import 'package:cake_wallet/themes.dart'; -import 'package:cake_wallet/entities/item_from_theme.dart'; class NewWalletPage extends BasePage { NewWalletPage(this._walletNewVM); final WalletNewVM _walletNewVM; - static final walletNameImage = Image.asset('assets/images/wallet_name.png'); - static final walletNameLightImage = + final walletNameImage = Image.asset('assets/images/wallet_name.png'); + final walletNameLightImage = Image.asset('assets/images/wallet_name_light.png'); - final Map items = { - Themes.light: walletNameLightImage, - Themes.bright: walletNameLightImage, - Themes.dark: walletNameImage - }; @override String get title => S.current.new_wallet; @override Widget body(BuildContext context) => WalletNameForm(_walletNewVM, - itemFromTheme(currentTheme: currentTheme, items: items) as Image - ?? walletNameLightImage); + currentTheme.isDarkTheme ? walletNameImage : walletNameLightImage); } class WalletNameForm extends StatefulWidget { diff --git a/lib/src/screens/new_wallet/new_wallet_type_page.dart b/lib/src/screens/new_wallet/new_wallet_type_page.dart index e984f7ad5..76ea98b56 100644 --- a/lib/src/screens/new_wallet/new_wallet_type_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_type_page.dart @@ -1,4 +1,3 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/entities/wallet_type.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; @@ -7,7 +6,6 @@ import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; import 'package:cake_wallet/src/screens/new_wallet/widgets/select_button.dart'; -import 'package:cake_wallet/themes.dart'; class NewWalletTypePage extends BasePage { NewWalletTypePage({this.onTypeSelected, this.isNewWallet = true}); @@ -15,14 +13,9 @@ class NewWalletTypePage extends BasePage { final void Function(BuildContext, WalletType) onTypeSelected; final bool isNewWallet; - static final walletTypeImage = Image.asset('assets/images/wallet_type.png'); - static final walletTypeLightImage = + final walletTypeImage = Image.asset('assets/images/wallet_type.png'); + final walletTypeLightImage = Image.asset('assets/images/wallet_type_light.png'); - final Map items = { - Themes.light: walletTypeLightImage, - Themes.bright: walletTypeLightImage, - Themes.dark: walletTypeImage - }; @override String get title => isNewWallet @@ -33,9 +26,8 @@ class NewWalletTypePage extends BasePage { Widget body(BuildContext context) => WalletTypeForm( onTypeSelected: onTypeSelected, - walletImage: - itemFromTheme(currentTheme: currentTheme, items: items) as Image - ?? walletTypeLightImage); + walletImage: currentTheme.isDarkTheme + ? walletTypeImage : walletTypeLightImage); } class WalletTypeForm extends StatefulWidget { diff --git a/lib/src/screens/seed/pre_seed_page.dart b/lib/src/screens/seed/pre_seed_page.dart index 4f63c5a79..58aed36d9 100644 --- a/lib/src/screens/seed/pre_seed_page.dart +++ b/lib/src/screens/seed/pre_seed_page.dart @@ -1,21 +1,13 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/routes.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; -import 'package:cake_wallet/themes.dart'; class PreSeedPage extends BasePage { - static final imageLight = Image.asset('assets/images/pre_seed_light.png'); - static final imageDark = Image.asset('assets/images/pre_seed_dark.png'); - - final Map items = { - Themes.light: imageLight, - Themes.bright: imageLight, - Themes.dark: imageDark - }; + final imageLight = Image.asset('assets/images/pre_seed_light.png'); + final imageDark = Image.asset('assets/images/pre_seed_dark.png'); @override Widget leading(BuildContext context) => null; @@ -25,9 +17,7 @@ class PreSeedPage extends BasePage { @override Widget body(BuildContext context) { - final image = - itemFromTheme(currentTheme: currentTheme, items: items) as Image - ?? imageLight; + final image = currentTheme.isDarkTheme ? imageDark : imageLight; return WillPopScope( onWillPop: () async => false, diff --git a/lib/src/screens/seed/wallet_seed_page.dart b/lib/src/screens/seed/wallet_seed_page.dart index 135ca9c46..fff8cca35 100644 --- a/lib/src/screens/seed/wallet_seed_page.dart +++ b/lib/src/screens/seed/wallet_seed_page.dart @@ -1,4 +1,3 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/palette.dart'; import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart'; import 'package:cake_wallet/utils/show_bar.dart'; @@ -12,18 +11,12 @@ import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/view_model/wallet_seed_view_model.dart'; -import 'package:cake_wallet/themes.dart'; class WalletSeedPage extends BasePage { WalletSeedPage(this.walletSeedViewModel, {@required this.isNewWalletCreated}); - static final imageLight = Image.asset('assets/images/crypto_lock_light.png'); - static final imageDark = Image.asset('assets/images/crypto_lock.png'); - final Map items = { - Themes.light: imageLight, - Themes.bright: imageLight, - Themes.dark: imageDark - }; + final imageLight = Image.asset('assets/images/crypto_lock_light.png'); + final imageDark = Image.asset('assets/images/crypto_lock.png'); @override String get title => S.current.seed_title; @@ -88,9 +81,7 @@ class WalletSeedPage extends BasePage { @override Widget body(BuildContext context) { - final image = - itemFromTheme(currentTheme: currentTheme, items: items) as Image - ?? imageLight; + final image = currentTheme.isDarkTheme ? imageDark : imageLight; return WillPopScope(onWillPop: () async => false, child: Container( padding: EdgeInsets.all(24), diff --git a/lib/src/screens/seed_language/seed_language_page.dart b/lib/src/screens/seed_language/seed_language_page.dart index d6d5580ee..4c9ef6b43 100644 --- a/lib/src/screens/seed_language/seed_language_page.dart +++ b/lib/src/screens/seed_language/seed_language_page.dart @@ -1,4 +1,3 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:cake_wallet/src/widgets/seed_language_selector.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter/material.dart'; @@ -8,21 +7,15 @@ import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; import 'package:cake_wallet/src/screens/seed_language/widgets/seed_language_picker.dart'; -import 'package:cake_wallet/themes.dart'; class SeedLanguage extends BasePage { SeedLanguage({this.onConfirm}); final Function(BuildContext, String) onConfirm; - static final walletNameImage = Image.asset('assets/images/wallet_name.png'); - static final walletNameLightImage = + final walletNameImage = Image.asset('assets/images/wallet_name.png'); + final walletNameLightImage = Image.asset('assets/images/wallet_name_light.png'); - final Map items = { - Themes.light: walletNameLightImage, - Themes.bright: walletNameLightImage, - Themes.dark: walletNameImage - }; @override String get title => S.current.wallet_list_restore_wallet; @@ -32,8 +25,7 @@ class SeedLanguage extends BasePage { SeedLanguageForm( onConfirm: onConfirm, walletImage: - itemFromTheme(currentTheme: currentTheme, items: items) as Image - ?? walletNameLightImage); + currentTheme.isDarkTheme ? walletNameImage : walletNameLightImage); } class SeedLanguageForm extends StatefulWidget { diff --git a/lib/src/screens/welcome/welcome_page.dart b/lib/src/screens/welcome/welcome_page.dart index 4d73e0fcd..d6bcf1c2f 100644 --- a/lib/src/screens/welcome/welcome_page.dart +++ b/lib/src/screens/welcome/welcome_page.dart @@ -1,4 +1,3 @@ -import 'package:cake_wallet/entities/item_from_theme.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; @@ -8,14 +7,8 @@ import 'package:cake_wallet/themes.dart'; class WelcomePage extends BasePage { static const aspectRatioImage = 1.25; - static final welcomeImageLight = Image.asset('assets/images/welcome_light.png'); - static final welcomeImageDark = Image.asset('assets/images/welcome.png'); - - final Map items = { - Themes.light: welcomeImageLight, - Themes.bright: welcomeImageLight, - Themes.dark: welcomeImageDark - }; + final welcomeImageLight = Image.asset('assets/images/welcome_light.png'); + final welcomeImageDark = Image.asset('assets/images/welcome.png'); @override Widget build(BuildContext context) { @@ -30,8 +23,7 @@ class WelcomePage extends BasePage { @override Widget body(BuildContext context) { final welcomeImage = - itemFromTheme(currentTheme: currentTheme, items: items) as Image - ?? welcomeImageLight; + currentTheme.isDarkTheme ? welcomeImageDark : welcomeImageLight; final newWalletImage = Image.asset('assets/images/new_wallet.png', height: 12, diff --git a/lib/src/widgets/alert_with_one_action.dart b/lib/src/widgets/alert_with_one_action.dart index 5a39adbc5..5aedbe9da 100644 --- a/lib/src/widgets/alert_with_one_action.dart +++ b/lib/src/widgets/alert_with_one_action.dart @@ -31,7 +31,7 @@ class AlertWithOneAction extends BaseAlertDialog { width: 300, height: 52, padding: EdgeInsets.only(left: 12, right: 12), - color: Theme.of(context).accentTextTheme.body2.color, + color: Theme.of(context).accentTextTheme.body1.backgroundColor, child: ButtonTheme( minWidth: double.infinity, child: FlatButton( @@ -44,7 +44,8 @@ class AlertWithOneAction extends BaseAlertDialog { style: TextStyle( fontSize: 15, fontWeight: FontWeight.w600, - color: Colors.white, + color: Theme.of(context).primaryTextTheme.body1 + .backgroundColor, decoration: TextDecoration.none, ), )), diff --git a/lib/src/widgets/base_alert_dialog.dart b/lib/src/widgets/base_alert_dialog.dart index 069c2bcf9..15637c189 100644 --- a/lib/src/widgets/base_alert_dialog.dart +++ b/lib/src/widgets/base_alert_dialog.dart @@ -1,4 +1,7 @@ import 'dart:ui'; +import 'package:cake_wallet/di.dart'; +import 'package:cake_wallet/store/settings_store.dart'; +import 'package:cake_wallet/themes.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; @@ -10,6 +13,7 @@ class BaseAlertDialog extends StatelessWidget { VoidCallback get actionLeft => () {}; VoidCallback get actionRight => () {}; bool get barrierDismissible => true; + Themes get currentTheme => getIt.get().currentTheme; Widget title(BuildContext context) { return Text( @@ -61,18 +65,26 @@ class BaseAlertDialog extends StatelessWidget { fontSize: 15, fontFamily: 'Lato', fontWeight: FontWeight.w600, - color: Colors.white, + color: Theme.of(context).primaryTextTheme.body2 + .backgroundColor, decoration: TextDecoration.none, ), )), ), ) ), + currentTheme.isLightTheme + ? Container( + width: 1, + height: 52, + color: Colors.grey[300], + ) + : Offstage(), Flexible( child: Container( height: 52, padding: EdgeInsets.only(left: 6, right: 6), - color: Theme.of(context).accentTextTheme.body2.color, + color: Theme.of(context).accentTextTheme.body1.backgroundColor, child: ButtonTheme( minWidth: double.infinity, child: FlatButton( @@ -86,7 +98,8 @@ class BaseAlertDialog extends StatelessWidget { fontSize: 15, fontFamily: 'Lato', fontWeight: FontWeight.w600, - color: Colors.white, + color: Theme.of(context).primaryTextTheme.body1 + .backgroundColor, decoration: TextDecoration.none, ), )), @@ -133,6 +146,12 @@ class BaseAlertDialog extends StatelessWidget { ], ), ), + currentTheme.isLightTheme + ? Container( + height: 1, + color: Colors.grey[300], + ) + : Offstage(), actionButtons(context) ], ), diff --git a/lib/themes.dart b/lib/themes.dart index ae6c13a6f..4c29de9de 100644 --- a/lib/themes.dart +++ b/lib/themes.dart @@ -43,6 +43,10 @@ class Themes extends EnumerableItem with Serializable { } } + bool get isLightTheme => this == Themes.light; + bool get isBrightTheme => this == Themes.bright; + bool get isDarkTheme => this == Themes.dark; + @override String toString() { switch (this) { @@ -65,7 +69,7 @@ class Themes extends EnumerableItem with Serializable { scaffoldBackgroundColor: Colors.white, // second gradient color primaryColor: Colors.white, // third gradient color buttonColor: Palette.blueAlice, // action buttons on dashboard page - indicatorColor: PaletteDark.darkCyanBlue, // page indicator + indicatorColor: PaletteDark.darkCyanBlue.withOpacity(0.67), // page indicator hoverColor: Palette.darkBlueCraiola, // amount hint text (receive page) dividerColor: Palette.paleBlue, hintColor: Palette.gray, @@ -165,11 +169,13 @@ class Themes extends EnumerableItem with Serializable { ), body1: TextStyle( color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) - decorationColor: Palette.blueGreyCraiola.withOpacity(0.7) // second gradient color bottom panel (exchange page) + decorationColor: Palette.blueGreyCraiola.withOpacity(0.7), // second gradient color bottom panel (exchange page) + backgroundColor: Palette.protectiveBlue // alert right button text ), body2: TextStyle( color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) + backgroundColor: Palette.brightOrange // alert left button text ) ), focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) @@ -211,7 +217,7 @@ class Themes extends EnumerableItem with Serializable { display2: TextStyle( color: Palette.shadowWhite, // action button color (address text field) decorationColor: Palette.darkGray, // hint text (seed widget) - backgroundColor: Palette.darkBlueCraiola // text on balance page + backgroundColor: Palette.darkBlueCraiola.withOpacity(0.67) // text on balance page ), display3: TextStyle( color: Palette.darkGray, // hint text (new wallet page) @@ -224,11 +230,12 @@ class Themes extends EnumerableItem with Serializable { ), body1: TextStyle( color: Palette.darkGray, // indicators (PIN code) - decorationColor: Palette.darkGray // switch (PIN code) + decorationColor: Palette.darkGray, // switch (PIN code) + backgroundColor: Colors.white // alert right button ), body2: TextStyle( - color: Palette.protectiveBlue, // primary buttons, alert right buttons - decorationColor: Palette.brightOrange, // alert left button, + color: Palette.protectiveBlue, // primary buttons + decorationColor: Colors.white, // alert left button, backgroundColor: Palette.dullGray // keyboard bar color ), ), @@ -343,11 +350,13 @@ class Themes extends EnumerableItem with Serializable { ), body1: TextStyle( color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) - decorationColor: Palette.pinkFlamingo.withOpacity(0.7) // second gradient color bottom panel (exchange page) + decorationColor: Palette.pinkFlamingo.withOpacity(0.7), // second gradient color bottom panel (exchange page) + backgroundColor: Colors.white // alert right button text ), body2: TextStyle( color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) + backgroundColor: Colors.white // alert left button text ) ), focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) @@ -403,10 +412,11 @@ class Themes extends EnumerableItem with Serializable { ), body1: TextStyle( color: Palette.darkGray, // indicators (PIN code) - decorationColor: Palette.darkGray // switch (PIN code) + decorationColor: Palette.darkGray, // switch (PIN code) + backgroundColor: Palette.moderateSlateBlue // alert right button ), body2: TextStyle( - color: Palette.moderateSlateBlue, // primary buttons, alert right buttons + color: Palette.moderateSlateBlue, // primary buttons decorationColor: Palette.brightOrange, // alert left button, backgroundColor: Palette.dullGray // keyboard bar color ), @@ -521,11 +531,13 @@ class Themes extends EnumerableItem with Serializable { ), body1: TextStyle( color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page) - decorationColor: PaletteDark.darkNightBlue // second gradient color bottom panel (exchange page) + decorationColor: PaletteDark.darkNightBlue, // second gradient color bottom panel (exchange page) + backgroundColor: Colors.white // alert right button text ), body2: TextStyle( color: PaletteDark.blueGrey, // text field border on top panel (exchange page) decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page) + backgroundColor: Colors.white // alert left button text ) ), focusColor: PaletteDark.moderateBlue, // text field button (exchange page) @@ -581,10 +593,11 @@ class Themes extends EnumerableItem with Serializable { ), body1: TextStyle( color: PaletteDark.indicatorVioletBlue, // indicators (PIN code) - decorationColor: PaletteDark.lightPurpleBlue // switch (PIN code) + decorationColor: PaletteDark.lightPurpleBlue, // switch (PIN code) + backgroundColor: Palette.blueCraiola // alert right button ), body2: TextStyle( - color: Palette.blueCraiola, // primary buttons, alert right buttons + color: Palette.blueCraiola, // primary buttons decorationColor: Palette.alizarinRed, // alert left button backgroundColor: PaletteDark.granite // keyboard bar color ), From 10b419fbbe94a1e06c902d63e351a86ba4e09ee5 Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Tue, 15 Dec 2020 21:30:16 +0200 Subject: [PATCH 05/10] CAKE-182 | applied new color scheme to alert buttons; deleted themes.dart; added theme_base.dart, light_theme.dart, bright_theme.dart, dark_theme.dart, theme_list.dart to the app --- lib/main.dart | 5 +- lib/src/screens/base_page.dart | 16 +- .../screens/new_wallet/new_wallet_page.dart | 4 +- .../new_wallet/new_wallet_type_page.dart | 3 +- lib/src/screens/seed/pre_seed_page.dart | 3 +- lib/src/screens/seed/wallet_seed_page.dart | 3 +- .../seed_language/seed_language_page.dart | 5 +- lib/src/screens/welcome/welcome_page.dart | 6 +- lib/src/themes/bright_theme.dart | 197 ++++++ lib/src/themes/dark_theme.dart | 196 ++++++ lib/src/themes/light_theme.dart | 196 ++++++ lib/src/themes/theme_base.dart | 17 + lib/src/themes/theme_list.dart | 25 + lib/src/widgets/base_alert_dialog.dart | 20 +- lib/store/settings_store.dart | 13 +- lib/themes.dart | 607 ------------------ .../settings/settings_view_model.dart | 9 +- 17 files changed, 675 insertions(+), 650 deletions(-) create mode 100644 lib/src/themes/bright_theme.dart create mode 100644 lib/src/themes/dark_theme.dart create mode 100644 lib/src/themes/light_theme.dart create mode 100644 lib/src/themes/theme_base.dart create mode 100644 lib/src/themes/theme_list.dart delete mode 100644 lib/themes.dart diff --git a/lib/main.dart b/lib/main.dart index b72d10e61..fae053798 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,3 +1,4 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:hive/hive.dart'; @@ -131,10 +132,10 @@ class App extends StatelessWidget { return Observer(builder: (BuildContext context) { final currentTheme = settingsStore.currentTheme; - final statusBarBrightness = currentTheme.isDarkTheme + final statusBarBrightness = currentTheme.type == ThemeType.dark ? Brightness.dark : Brightness.light; - final statusBarIconBrightness = currentTheme.isDarkTheme + final statusBarIconBrightness = currentTheme.type == ThemeType.dark ? Brightness.light : Brightness.dark; SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle( diff --git a/lib/src/screens/base_page.dart b/lib/src/screens/base_page.dart index 99d125ec8..7af4b1a50 100644 --- a/lib/src/screens/base_page.dart +++ b/lib/src/screens/base_page.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/themes.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; @@ -38,7 +38,7 @@ abstract class BasePage extends StatelessWidget { Widget Function(BuildContext, Widget) get rootWrapper => null; - Themes get currentTheme => getIt.get().currentTheme; + ThemeBase get currentTheme => getIt.get().currentTheme; void onOpenEndDrawer() => _scaffoldKey.currentState.openEndDrawer(); @@ -52,8 +52,8 @@ abstract class BasePage extends StatelessWidget { final _backButton = Icon(Icons.arrow_back_ios, color: titleColor ?? Theme.of(context).primaryTextTheme.title.color, size: 16,); - final _closeButton = - currentTheme.isDarkTheme ? closeButtonImageDarkTheme : closeButtonImage; + final _closeButton = currentTheme.type == ThemeType.dark + ? closeButtonImageDarkTheme : closeButtonImage; return SizedBox( height: 37, @@ -89,8 +89,8 @@ abstract class BasePage extends StatelessWidget { Widget floatingActionButton(BuildContext context) => null; ObstructingPreferredSizeWidget appBar(BuildContext context) { - final appBarColor = - currentTheme.isDarkTheme ? backgroundDarkColor : backgroundLightColor; + final appBarColor = currentTheme.type == ThemeType.dark + ? backgroundDarkColor : backgroundLightColor; switch (appBarStyle) { case AppBarStyle.regular: @@ -132,8 +132,8 @@ abstract class BasePage extends StatelessWidget { @override Widget build(BuildContext context) { - final _backgroundColor = - currentTheme.isDarkTheme ? backgroundDarkColor : backgroundLightColor; + final _backgroundColor = currentTheme.type == ThemeType.dark + ? backgroundDarkColor : backgroundLightColor; final root = Scaffold( key: _scaffoldKey, diff --git a/lib/src/screens/new_wallet/new_wallet_page.dart b/lib/src/screens/new_wallet/new_wallet_page.dart index 86ad09d86..638fdf028 100644 --- a/lib/src/screens/new_wallet/new_wallet_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_page.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/routes.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:mobx/mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; @@ -29,7 +30,8 @@ class NewWalletPage extends BasePage { @override Widget body(BuildContext context) => WalletNameForm(_walletNewVM, - currentTheme.isDarkTheme ? walletNameImage : walletNameLightImage); + currentTheme.type == ThemeType.dark + ? walletNameImage : walletNameLightImage); } class WalletNameForm extends StatefulWidget { diff --git a/lib/src/screens/new_wallet/new_wallet_type_page.dart b/lib/src/screens/new_wallet/new_wallet_type_page.dart index 76ea98b56..49ed74a9a 100644 --- a/lib/src/screens/new_wallet/new_wallet_type_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_type_page.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/entities/wallet_type.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:cake_wallet/generated/i18n.dart'; @@ -26,7 +27,7 @@ class NewWalletTypePage extends BasePage { Widget body(BuildContext context) => WalletTypeForm( onTypeSelected: onTypeSelected, - walletImage: currentTheme.isDarkTheme + walletImage: currentTheme.type == ThemeType.dark ? walletTypeImage : walletTypeLightImage); } diff --git a/lib/src/screens/seed/pre_seed_page.dart b/lib/src/screens/seed/pre_seed_page.dart index 58aed36d9..b04206e8b 100644 --- a/lib/src/screens/seed/pre_seed_page.dart +++ b/lib/src/screens/seed/pre_seed_page.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/routes.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/generated/i18n.dart'; @@ -17,7 +18,7 @@ class PreSeedPage extends BasePage { @override Widget body(BuildContext context) { - final image = currentTheme.isDarkTheme ? imageDark : imageLight; + final image = currentTheme.type == ThemeType.dark ? imageDark : imageLight; return WillPopScope( onWillPop: () async => false, diff --git a/lib/src/screens/seed/wallet_seed_page.dart b/lib/src/screens/seed/wallet_seed_page.dart index fff8cca35..f783442ae 100644 --- a/lib/src/screens/seed/wallet_seed_page.dart +++ b/lib/src/screens/seed/wallet_seed_page.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/palette.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart'; import 'package:cake_wallet/utils/show_bar.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; @@ -81,7 +82,7 @@ class WalletSeedPage extends BasePage { @override Widget body(BuildContext context) { - final image = currentTheme.isDarkTheme ? imageDark : imageLight; + final image = currentTheme.type == ThemeType.dark ? imageDark : imageLight; return WillPopScope(onWillPop: () async => false, child: Container( padding: EdgeInsets.all(24), diff --git a/lib/src/screens/seed_language/seed_language_page.dart b/lib/src/screens/seed_language/seed_language_page.dart index 4c9ef6b43..5cc614e00 100644 --- a/lib/src/screens/seed_language/seed_language_page.dart +++ b/lib/src/screens/seed_language/seed_language_page.dart @@ -1,3 +1,4 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:cake_wallet/src/widgets/seed_language_selector.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter/material.dart'; @@ -24,8 +25,8 @@ class SeedLanguage extends BasePage { Widget body(BuildContext context) => SeedLanguageForm( onConfirm: onConfirm, - walletImage: - currentTheme.isDarkTheme ? walletNameImage : walletNameLightImage); + walletImage: currentTheme.type == ThemeType.dark + ? walletNameImage : walletNameLightImage); } class SeedLanguageForm extends StatefulWidget { diff --git a/lib/src/screens/welcome/welcome_page.dart b/lib/src/screens/welcome/welcome_page.dart index d6bcf1c2f..9a12d5b69 100644 --- a/lib/src/screens/welcome/welcome_page.dart +++ b/lib/src/screens/welcome/welcome_page.dart @@ -1,9 +1,9 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/generated/i18n.dart'; -import 'package:cake_wallet/themes.dart'; class WelcomePage extends BasePage { static const aspectRatioImage = 1.25; @@ -22,8 +22,8 @@ class WelcomePage extends BasePage { @override Widget body(BuildContext context) { - final welcomeImage = - currentTheme.isDarkTheme ? welcomeImageDark : welcomeImageLight; + final welcomeImage = currentTheme.type == ThemeType.dark + ? welcomeImageDark : welcomeImageLight; final newWalletImage = Image.asset('assets/images/new_wallet.png', height: 12, diff --git a/lib/src/themes/bright_theme.dart b/lib/src/themes/bright_theme.dart new file mode 100644 index 000000000..97ffb0b72 --- /dev/null +++ b/lib/src/themes/bright_theme.dart @@ -0,0 +1,197 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:flutter/material.dart'; + +class BrightTheme extends ThemeBase { + BrightTheme({@required int raw}) : super(raw: raw); + + @override + String get title => S.current.bright_theme; + + @override + ThemeType get type => ThemeType.bright; + + @override + ThemeData get themeData => ThemeData( + fontFamily: 'Lato', + brightness: Brightness.light, + backgroundColor: Colors.white, + accentColor: Palette.blueCraiola, // first gradient color + scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color + primaryColor: Palette.redHat, // third gradient color + buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page + indicatorColor: Colors.white.withOpacity(0.5), // page indicator + hoverColor: Colors.white, // amount hint text (receive page) + dividerColor: Palette.paleBlue, + hintColor: Palette.gray, + textTheme: TextTheme( + title: TextStyle( + color: Colors.white, // sync_indicator text + backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator + decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator + ), + caption: TextStyle( + color: Palette.shineOrange, // not synced light + decorationColor: Colors.white, // filter icon + ), + overline: TextStyle( + color: Colors.white.withOpacity(0.2), // filter button + backgroundColor: Colors.white.withOpacity(0.5), // date section row + decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows) + ), + subhead: TextStyle( + color: Colors.white.withOpacity(0.2), // address button border + decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget) + ), + headline: TextStyle( + color: Colors.white, // qr code + decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page) + ), + display1: TextStyle( + color: PaletteDark.lightBlueGrey, // icons color (receive page) + decorationColor: Palette.lavender, // icons background (receive page) + ), + display2: TextStyle( + color: Palette.darkBlueCraiola, // text color of tiles (receive page) + decorationColor: Colors.white // background of tiles (receive page) + ), + display3: TextStyle( + color: Colors.white, // text color of current tile (receive page), + //decorationColor: Palette.blueCraiola // background of current tile (receive page) + decorationColor: Palette.moderateSlateBlue // background of current tile (receive page) + ), + display4: TextStyle( + color: Palette.violetBlue, // text color of tiles (account list) + decorationColor: Colors.white // background of tiles (account list) + ), + subtitle: TextStyle( + color: Palette.moderateSlateBlue, // text color of current tile (account list) + decorationColor: Colors.white // background of current tile (account list) + ), + body1: TextStyle( + color: Palette.moderatePurpleBlue, // scrollbar thumb + decorationColor: Palette.periwinkleCraiola // scrollbar background + ), + body2: TextStyle( + color: Palette.moderateLavender, // menu header + decorationColor: Colors.white, // menu background + ) + ), + primaryTextTheme: TextTheme( + title: TextStyle( + color: Palette.darkBlueCraiola, // title color + backgroundColor: Palette.wildPeriwinkle // textfield underline + ), + caption: TextStyle( + color: PaletteDark.pigeonBlue, // secondary text + decorationColor: Palette.wildLavender // menu divider + ), + overline: TextStyle( + color: Palette.darkGray, // transaction/trade details titles + decorationColor: Colors.white.withOpacity(0.5), // placeholder + ), + subhead: TextStyle( + color: Palette.blueCraiola, // first gradient color (send page) + decorationColor: Palette.pinkFlamingo // second gradient color (send page) + ), + headline: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border color (send page) + decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) + ), + display1: TextStyle( + color: Colors.white.withOpacity(0.2), // text field button color (send page) + decorationColor: Colors.white // text field button icon color (send page) + ), + display2: TextStyle( + color: Colors.white.withOpacity(0.5), // estimated fee (send page) + decorationColor: Palette.shadowWhite // template dotted border (send page) + ), + display3: TextStyle( + color: Palette.darkBlueCraiola, // template new text (send page) + decorationColor: Palette.shadowWhite // template background color (send page) + ), + display4: TextStyle( + color: Palette.darkBlueCraiola, // template title (send page) + decorationColor: Palette.niagara // receive amount text (exchange page) + ), + subtitle: TextStyle( + color: Palette.blueCraiola, // first gradient color top panel (exchange page) + decorationColor: Palette.pinkFlamingo // second gradient color top panel (exchange page) + ), + body1: TextStyle( + color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) + decorationColor: Palette.pinkFlamingo.withOpacity(0.7), // second gradient color bottom panel (exchange page) + backgroundColor: Palette.moderateSlateBlue // alert right button text + ), + body2: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) + decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) + backgroundColor: Palette.brightOrange // alert left button text + ) + ), + focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) + accentTextTheme: TextTheme( + title: TextStyle( + color: Colors.white, // picker background + backgroundColor: Palette.periwinkleCraiola, // picker divider + decorationColor: Colors.white // dialog background + ), + caption: TextStyle( + color: Palette.moderateLavender, // container (confirm exchange) + backgroundColor: Palette.moderateLavender, // button background (confirm exchange) + decorationColor: Palette.darkBlueCraiola, // text color (information page) + ), + subtitle: TextStyle( + color: Palette.darkBlueCraiola, // QR code (exchange trade page) + backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) + //decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page) + decorationColor: Palette.moderateSlateBlue // crete new wallet button background (wallet list page) + ), + headline: TextStyle( + color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) + backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) + decorationColor: Colors.white // restore wallet button text color (wallet list page) + ), + subhead: TextStyle( + color: Palette.darkGray, // titles color (filter widget) + backgroundColor: Palette.periwinkle, // divider color (filter widget) + decorationColor: Colors.white // checkbox background (filter widget) + ), + overline: TextStyle( + color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) + decorationColor: Colors.white, // menu subname + ), + display1: TextStyle( + color: Palette.blueCraiola, // first gradient color (menu header) + decorationColor: Palette.pinkFlamingo, // second gradient color(menu header) + backgroundColor: Colors.white // active dot color + ), + display2: TextStyle( + color: Palette.shadowWhite, // action button color (address text field) + decorationColor: Palette.darkGray, // hint text (seed widget) + backgroundColor: Colors.white.withOpacity(0.5) // text on balance page + ), + display3: TextStyle( + color: Palette.darkGray, // hint text (new wallet page) + decorationColor: Palette.periwinkleCraiola, // underline (new wallet page) + backgroundColor: Colors.white // menu, icons, balance (dashboard page) + ), + display4: TextStyle( + color: Palette.darkGray, // switch background (settings page) + decorationColor: Colors.white.withOpacity(0.4) // hint text (exchange page) + ), + body1: TextStyle( + color: Palette.darkGray, // indicators (PIN code) + decorationColor: Palette.darkGray, // switch (PIN code) + backgroundColor: Colors.white // alert right button + ), + body2: TextStyle( + color: Palette.moderateSlateBlue, // primary buttons + decorationColor: Colors.white, // alert left button, + backgroundColor: Palette.dullGray // keyboard bar color + ), + ), + cardColor: Palette.moderateSlateBlue // bottom button (action list) + ); +} \ No newline at end of file diff --git a/lib/src/themes/dark_theme.dart b/lib/src/themes/dark_theme.dart new file mode 100644 index 000000000..409dd699b --- /dev/null +++ b/lib/src/themes/dark_theme.dart @@ -0,0 +1,196 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:flutter/material.dart'; + +class DarkTheme extends ThemeBase { + DarkTheme({@required int raw}) : super(raw: raw); + + @override + String get title => S.current.dark_theme; + + @override + ThemeType get type => ThemeType.dark; + + @override + ThemeData get themeData => ThemeData( + fontFamily: 'Lato', + brightness: Brightness.dark, + backgroundColor: PaletteDark.backgroundColor, + accentColor: PaletteDark.backgroundColor, // first gradient color + scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color + primaryColor: PaletteDark.backgroundColor, // third gradient color + buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page + indicatorColor: PaletteDark.cyanBlue, // page indicator + hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page) + dividerColor: PaletteDark.dividerColor, + hintColor: PaletteDark.pigeonBlue, // menu + textTheme: TextTheme( + title: TextStyle( + color: PaletteDark.wildBlue, // sync_indicator text + backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator + decorationColor: PaletteDark.oceanBlue // not synced sync_indicator + ), + caption: TextStyle( + color: PaletteDark.orangeYellow, // not synced light + decorationColor: PaletteDark.wildBlue, // filter icon + ), + overline: TextStyle( + color: PaletteDark.oceanBlue, // filter button + backgroundColor: PaletteDark.darkCyanBlue, // date section row + decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows) + ), + subhead: TextStyle( + color: PaletteDark.nightBlue, // address button border + decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) + ), + headline: TextStyle( + color: PaletteDark.lightBlueGrey, // qr code + decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page) + ), + display1: TextStyle( + color: Colors.white, // icons color (receive page) + decorationColor: PaletteDark.distantNightBlue, // icons background (receive page) + ), + display2: TextStyle( + color: Colors.white, // text color of tiles (receive page) + decorationColor: PaletteDark.nightBlue // background of tiles (receive page) + ), + display3: TextStyle( + color: Palette.blueCraiola, // text color of current tile (receive page) + decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page) + ), + display4: TextStyle( + color: Colors.white, // text color of tiles (account list) + decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list) + ), + subtitle: TextStyle( + color: Palette.blueCraiola, // text color of current tile (account list) + decorationColor: PaletteDark.darkNightBlue // background of current tile (account list) + ), + body1: TextStyle( + color: PaletteDark.wildBlueGrey, // scrollbar thumb + decorationColor: PaletteDark.violetBlue // scrollbar background + ), + body2: TextStyle( + color: PaletteDark.deepPurpleBlue, // menu header + decorationColor: PaletteDark.deepPurpleBlue, // menu background + ) + ), + primaryTextTheme: TextTheme( + title: TextStyle( + color: Colors.white, // title color + backgroundColor: PaletteDark.darkOceanBlue // textfield underline + ), + caption: TextStyle( + color: PaletteDark.darkCyanBlue, // secondary text + decorationColor: PaletteDark.darkOceanBlue // menu divider + ), + overline: TextStyle( + color: PaletteDark.lightBlueGrey, // transaction/trade details titles + decorationColor: Colors.grey, // placeholder + ), + subhead: TextStyle( + color: PaletteDark.darkNightBlue, // first gradient color (send page) + decorationColor: PaletteDark.darkNightBlue // second gradient color (send page) + ), + headline: TextStyle( + color: PaletteDark.lightVioletBlue, // text field border color (send page) + decorationColor: PaletteDark.darkCyanBlue, // text field hint color (send page) + ), + display1: TextStyle( + color: PaletteDark.buttonNightBlue, // text field button color (send page) + decorationColor: PaletteDark.gray // text field button icon color (send page) + ), + display2: TextStyle( + color: Colors.white, // estimated fee (send page) + decorationColor: PaletteDark.darkCyanBlue // template dotted border (send page) + ), + display3: TextStyle( + color: PaletteDark.darkCyanBlue, // template new text (send page) + decorationColor: PaletteDark.darkVioletBlue // template background color (send page) + ), + display4: TextStyle( + color: PaletteDark.cyanBlue, // template title (send page) + decorationColor: PaletteDark.darkCyanBlue // receive amount text (exchange page) + ), + subtitle: TextStyle( + color: PaletteDark.wildVioletBlue, // first gradient color top panel (exchange page) + decorationColor: PaletteDark.wildVioletBlue // second gradient color top panel (exchange page) + ), + body1: TextStyle( + color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page) + decorationColor: PaletteDark.darkNightBlue, // second gradient color bottom panel (exchange page) + backgroundColor: Palette.blueCraiola // alert right button text + ), + body2: TextStyle( + color: PaletteDark.blueGrey, // text field border on top panel (exchange page) + decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page) + backgroundColor: Palette.alizarinRed // alert left button text + ) + ), + focusColor: PaletteDark.moderateBlue, // text field button (exchange page) + accentTextTheme: TextTheme( + title: TextStyle( + color: PaletteDark.nightBlue, // picker background + backgroundColor: PaletteDark.dividerColor, // picker divider + decorationColor: PaletteDark.darkNightBlue // dialog background + ), + caption: TextStyle( + color: PaletteDark.nightBlue, // container (confirm exchange) + backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange) + decorationColor: Palette.darkLavender, // text color (information page) + ), + subtitle: TextStyle( + //color: PaletteDark.lightBlueGrey, // QR code (exchange trade page) + color: Colors.white, // QR code (exchange trade page) + backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page) + decorationColor: Colors.white // crete new wallet button background (wallet list page) + ), + headline: TextStyle( + color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page) + backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page) + decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page) + ), + subhead: TextStyle( + color: Colors.white, // titles color (filter widget) + backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget) + decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget) + ), + overline: TextStyle( + color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget) + decorationColor: PaletteDark.darkCyanBlue, // menu subname + ), + display1: TextStyle( + color: PaletteDark.deepPurpleBlue, // first gradient color (menu header) + decorationColor: PaletteDark.deepPurpleBlue, // second gradient color(menu header) + backgroundColor: Colors.white // active dot color + ), + display2: TextStyle( + color: PaletteDark.nightBlue, // action button color (address text field) + decorationColor: PaletteDark.darkCyanBlue, // hint text (seed widget) + backgroundColor: PaletteDark.cyanBlue // text on balance page + ), + display3: TextStyle( + color: PaletteDark.cyanBlue, // hint text (new wallet page) + decorationColor: PaletteDark.darkGrey, // underline (new wallet page) + backgroundColor: Colors.white // menu, icons, balance (dashboard page) + ), + display4: TextStyle( + color: PaletteDark.deepVioletBlue, // switch background (settings page) + decorationColor: PaletteDark.lightBlueGrey // hint text (exchange page) + ), + body1: TextStyle( + color: PaletteDark.indicatorVioletBlue, // indicators (PIN code) + decorationColor: PaletteDark.lightPurpleBlue, // switch (PIN code) + backgroundColor: PaletteDark.darkNightBlue // alert right button + ), + body2: TextStyle( + color: Palette.blueCraiola, // primary buttons + decorationColor: PaletteDark.darkNightBlue, // alert left button + backgroundColor: PaletteDark.granite // keyboard bar color + ), + ), + cardColor: PaletteDark.darkNightBlue // bottom button (action list) + ); +} \ No newline at end of file diff --git a/lib/src/themes/light_theme.dart b/lib/src/themes/light_theme.dart new file mode 100644 index 000000000..ae64d74d8 --- /dev/null +++ b/lib/src/themes/light_theme.dart @@ -0,0 +1,196 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/generated/i18n.dart'; +import 'package:cake_wallet/palette.dart'; +import 'package:flutter/material.dart'; + +class LightTheme extends ThemeBase { + LightTheme({@required int raw}) : super(raw: raw); + + @override + String get title => S.current.light_theme; + + @override + ThemeType get type => ThemeType.light; + + @override + ThemeData get themeData => ThemeData( + fontFamily: 'Lato', + brightness: Brightness.light, + backgroundColor: Colors.white, + accentColor: Colors.white, // first gradient color + scaffoldBackgroundColor: Colors.white, // second gradient color + primaryColor: Colors.white, // third gradient color + buttonColor: Palette.blueAlice, // action buttons on dashboard page + indicatorColor: PaletteDark.darkCyanBlue.withOpacity(0.67), // page indicator + hoverColor: Palette.darkBlueCraiola, // amount hint text (receive page) + dividerColor: Palette.paleBlue, + hintColor: Palette.gray, + textTheme: TextTheme( + title: TextStyle( + color: Palette.darkBlueCraiola, // sync_indicator text + backgroundColor: Palette.blueAlice, // synced sync_indicator + decorationColor: Palette.blueAlice.withOpacity(0.75), // not synced sync_indicator + ), + caption: TextStyle( + color: Palette.shineOrange, // not synced light + decorationColor: PaletteDark.wildBlue, // filter icon + ), + overline: TextStyle( + color: Palette.blueAlice, // filter button + backgroundColor: PaletteDark.darkCyanBlue, // date section row + decorationColor: Palette.blueAlice // icons (transaction and trade rows) + ), + subhead: TextStyle( + color: Palette.blueAlice, // address button border + decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) + ), + headline: TextStyle( + color: Colors.white, // qr code + decorationColor: Palette.darkBlueCraiola, // bottom border of amount (receive page) + ), + display1: TextStyle( + color: PaletteDark.lightBlueGrey, // icons color (receive page) + decorationColor: Palette.moderateLavender, // icons background (receive page) + ), + display2: TextStyle( + color: Palette.darkBlueCraiola, // text color of tiles (receive page) + decorationColor: Palette.blueAlice // background of tiles (receive page) + ), + display3: TextStyle( + color: Colors.white, // text color of current tile (receive page), + //decorationColor: Palette.blueCraiola // background of current tile (receive page) + decorationColor: Palette.blueCraiola // background of current tile (receive page) + ), + display4: TextStyle( + color: Palette.violetBlue, // text color of tiles (account list) + decorationColor: Colors.white // background of tiles (account list) + ), + subtitle: TextStyle( + color: Palette.protectiveBlue, // text color of current tile (account list) + decorationColor: Colors.white // background of current tile (account list) + ), + body1: TextStyle( + color: Palette.moderatePurpleBlue, // scrollbar thumb + decorationColor: Palette.periwinkleCraiola // scrollbar background + ), + body2: TextStyle( + color: Palette.moderateLavender, // menu header + decorationColor: Colors.white, // menu background + ) + ), + primaryTextTheme: TextTheme( + title: TextStyle( + color: Palette.darkBlueCraiola, // title color + backgroundColor: Palette.wildPeriwinkle // textfield underline + ), + caption: TextStyle( + color: PaletteDark.pigeonBlue, // secondary text + decorationColor: Palette.wildLavender // menu divider + ), + overline: TextStyle( + color: Palette.darkGray, // transaction/trade details titles + decorationColor: PaletteDark.darkCyanBlue, // placeholder + ), + subhead: TextStyle( + color: Palette.blueCraiola, // first gradient color (send page) + decorationColor: Palette.blueGreyCraiola // second gradient color (send page) + ), + headline: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border color (send page) + decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) + ), + display1: TextStyle( + color: Colors.white.withOpacity(0.2), // text field button color (send page) + decorationColor: Colors.white // text field button icon color (send page) + ), + display2: TextStyle( + color: Colors.white.withOpacity(0.5), // estimated fee (send page) + decorationColor: Palette.moderateLavender // template dotted border (send page) + ), + display3: TextStyle( + color: Palette.darkBlueCraiola, // template new text (send page) + decorationColor: Palette.blueAlice // template background color (send page) + ), + display4: TextStyle( + color: Palette.darkBlueCraiola, // template title (send page) + decorationColor: Palette.niagara // receive amount text (exchange page) + ), + subtitle: TextStyle( + color: Palette.blueCraiola, // first gradient color top panel (exchange page) + decorationColor: Palette.blueGreyCraiola // second gradient color top panel (exchange page) + ), + body1: TextStyle( + color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) + decorationColor: Palette.blueGreyCraiola.withOpacity(0.7), // second gradient color bottom panel (exchange page) + backgroundColor: Palette.protectiveBlue // alert right button text + ), + body2: TextStyle( + color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) + decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) + backgroundColor: Palette.brightOrange // alert left button text + ) + ), + focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) + accentTextTheme: TextTheme( + title: TextStyle( + color: Colors.white, // picker background + backgroundColor: Palette.periwinkleCraiola, // picker divider + decorationColor: Colors.white // dialog background + ), + caption: TextStyle( + color: Palette.blueAlice, // container (confirm exchange) + backgroundColor: Palette.blueAlice, // button background (confirm exchange) + decorationColor: Palette.darkBlueCraiola, // text color (information page) + ), + subtitle: TextStyle( + color: Palette.darkBlueCraiola, // QR code (exchange trade page) + backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) + decorationColor: Palette.protectiveBlue // crete new wallet button background (wallet list page) + ), + headline: TextStyle( + color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) + backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) + decorationColor: Colors.white // restore wallet button text color (wallet list page) + ), + subhead: TextStyle( + color: Palette.darkGray, // titles color (filter widget) + backgroundColor: Palette.periwinkle, // divider color (filter widget) + decorationColor: Colors.white // checkbox background (filter widget) + ), + overline: TextStyle( + color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) + decorationColor: Colors.white, // menu subname + ), + display1: TextStyle( + color: Palette.blueCraiola, // first gradient color (menu header) + decorationColor: Palette.blueGreyCraiola, // second gradient color(menu header) + backgroundColor: PaletteDark.darkNightBlue // active dot color + ), + display2: TextStyle( + color: Palette.shadowWhite, // action button color (address text field) + decorationColor: Palette.darkGray, // hint text (seed widget) + backgroundColor: Palette.darkBlueCraiola.withOpacity(0.67) // text on balance page + ), + display3: TextStyle( + color: Palette.darkGray, // hint text (new wallet page) + decorationColor: Palette.periwinkleCraiola, // underline (new wallet page) + backgroundColor: Palette.darkBlueCraiola // menu, icons, balance (dashboard page) + ), + display4: TextStyle( + color: Palette.darkGray, // switch background (settings page) + decorationColor: Colors.white.withOpacity(0.4) // hint text (exchange page) + ), + body1: TextStyle( + color: Palette.darkGray, // indicators (PIN code) + decorationColor: Palette.darkGray, // switch (PIN code) + backgroundColor: Colors.white // alert right button + ), + body2: TextStyle( + color: Palette.protectiveBlue, // primary buttons + decorationColor: Colors.white, // alert left button, + backgroundColor: Palette.dullGray // keyboard bar color + ), + ), + cardColor: Palette.protectiveBlue // bottom button (action list) + ); +} \ No newline at end of file diff --git a/lib/src/themes/theme_base.dart b/lib/src/themes/theme_base.dart new file mode 100644 index 000000000..bc7baf70c --- /dev/null +++ b/lib/src/themes/theme_base.dart @@ -0,0 +1,17 @@ +import 'package:flutter/material.dart'; + +enum ThemeType {light, bright, dark} + +abstract class ThemeBase { + ThemeBase({@required this.raw}); + + final int raw; + String get title; + ThemeData get themeData; + ThemeType get type; + + @override + String toString() { + return title; + } +} \ No newline at end of file diff --git a/lib/src/themes/theme_list.dart b/lib/src/themes/theme_list.dart new file mode 100644 index 000000000..2e1aa1fb8 --- /dev/null +++ b/lib/src/themes/theme_list.dart @@ -0,0 +1,25 @@ +import 'package:cake_wallet/src/themes/bright_theme.dart'; +import 'package:cake_wallet/src/themes/dark_theme.dart'; +import 'package:cake_wallet/src/themes/light_theme.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; + +class ThemeList { + static final all = [lightTheme, brightTheme, darkTheme]; + + static final lightTheme = LightTheme(raw: 0); + static final brightTheme = BrightTheme(raw: 1); + static final darkTheme = DarkTheme(raw: 2); + + static ThemeBase deserialize({int raw}) { + switch (raw) { + case 0: + return lightTheme; + case 1: + return brightTheme; + case 2: + return darkTheme; + default: + return null; + } + } +} \ No newline at end of file diff --git a/lib/src/widgets/base_alert_dialog.dart b/lib/src/widgets/base_alert_dialog.dart index 15637c189..19c00ca43 100644 --- a/lib/src/widgets/base_alert_dialog.dart +++ b/lib/src/widgets/base_alert_dialog.dart @@ -1,7 +1,4 @@ import 'dart:ui'; -import 'package:cake_wallet/di.dart'; -import 'package:cake_wallet/store/settings_store.dart'; -import 'package:cake_wallet/themes.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; @@ -13,7 +10,6 @@ class BaseAlertDialog extends StatelessWidget { VoidCallback get actionLeft => () {}; VoidCallback get actionRight => () {}; bool get barrierDismissible => true; - Themes get currentTheme => getIt.get().currentTheme; Widget title(BuildContext context) { return Text( @@ -73,13 +69,11 @@ class BaseAlertDialog extends StatelessWidget { ), ) ), - currentTheme.isLightTheme - ? Container( + Container( width: 1, height: 52, - color: Colors.grey[300], - ) - : Offstage(), + color: Theme.of(context).dividerColor, + ), Flexible( child: Container( height: 52, @@ -146,12 +140,10 @@ class BaseAlertDialog extends StatelessWidget { ], ), ), - currentTheme.isLightTheme - ? Container( + Container( height: 1, - color: Colors.grey[300], - ) - : Offstage(), + color: Theme.of(context).dividerColor, + ), actionButtons(context) ], ), diff --git a/lib/store/settings_store.dart b/lib/store/settings_store.dart index 785763066..d8f009273 100644 --- a/lib/store/settings_store.dart +++ b/lib/store/settings_store.dart @@ -1,5 +1,6 @@ import 'package:cake_wallet/entities/preferences_key.dart'; -import 'package:cake_wallet/themes.dart'; +import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/src/themes/theme_list.dart'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:hive/hive.dart'; @@ -28,7 +29,7 @@ abstract class SettingsStoreBase with Store { @required BalanceDisplayMode initialBalanceDisplayMode, @required bool initialSaveRecipientAddress, @required bool initialAllowBiometricalAuthentication, - @required Themes initialTheme, + @required ThemeBase initialTheme, @required int initialPinLength, @required String initialLanguageCode, // @required String initialCurrentLocale, @@ -66,8 +67,8 @@ abstract class SettingsStoreBase with Store { reaction( (_) => currentTheme, - (Themes theme) => sharedPreferences.setInt( - PreferencesKey.currentTheme, theme.serialize())); + (ThemeBase theme) => sharedPreferences.setInt( + PreferencesKey.currentTheme, theme.raw)); reaction( (_) => allowBiometricalAuthentication, @@ -111,7 +112,7 @@ abstract class SettingsStoreBase with Store { bool allowBiometricalAuthentication; @observable - Themes currentTheme; + ThemeBase currentTheme; @observable int pinCodeLength; @@ -154,7 +155,7 @@ abstract class SettingsStoreBase with Store { final allowBiometricalAuthentication = sharedPreferences .getBool(PreferencesKey.allowBiometricalAuthenticationKey) ?? false; - final savedTheme = Themes.deserialize( + final savedTheme = ThemeList.deserialize( raw: sharedPreferences.getInt(PreferencesKey.currentTheme) ?? 0); final actionListDisplayMode = ObservableList(); actionListDisplayMode.addAll(deserializeActionlistDisplayModes( diff --git a/lib/themes.dart b/lib/themes.dart deleted file mode 100644 index 4c29de9de..000000000 --- a/lib/themes.dart +++ /dev/null @@ -1,607 +0,0 @@ -import 'package:flutter/material.dart'; -import 'palette.dart'; -import 'package:cake_wallet/generated/i18n.dart'; -import 'package:cake_wallet/entities/enumerable_item.dart'; - -class Themes extends EnumerableItem with Serializable { - const Themes({String title, int raw}) - : super(title: title, raw: raw); - - static const all = [ - Themes.light, - Themes.bright, - Themes.dark, - ]; - - static const light = Themes(title: 'Light', raw: 0); - static const bright = Themes(title: 'Bright', raw: 1); - static const dark = Themes(title: 'Dark', raw: 2); - - static Themes deserialize({int raw}) { - switch (raw) { - case 0: - return light; - case 1: - return bright; - case 2: - return dark; - default: - return null; - } - } - - ThemeData get themeData { - switch (this) { - case Themes.light: - return lightTheme; - case Themes.bright: - return brightTheme; - case Themes.dark: - return darkTheme; - default: - return null; - } - } - - bool get isLightTheme => this == Themes.light; - bool get isBrightTheme => this == Themes.bright; - bool get isDarkTheme => this == Themes.dark; - - @override - String toString() { - switch (this) { - case Themes.light: - return S.current.light_theme; - case Themes.bright: - return S.current.bright_theme; - case Themes.dark: - return S.current.dark_theme; - default: - return ''; - } - } - - static final ThemeData lightTheme = ThemeData( - fontFamily: 'Lato', - brightness: Brightness.light, - backgroundColor: Colors.white, - accentColor: Colors.white, // first gradient color - scaffoldBackgroundColor: Colors.white, // second gradient color - primaryColor: Colors.white, // third gradient color - buttonColor: Palette.blueAlice, // action buttons on dashboard page - indicatorColor: PaletteDark.darkCyanBlue.withOpacity(0.67), // page indicator - hoverColor: Palette.darkBlueCraiola, // amount hint text (receive page) - dividerColor: Palette.paleBlue, - hintColor: Palette.gray, - textTheme: TextTheme( - title: TextStyle( - color: Palette.darkBlueCraiola, // sync_indicator text - backgroundColor: Palette.blueAlice, // synced sync_indicator - decorationColor: Palette.blueAlice.withOpacity(0.75), // not synced sync_indicator - ), - caption: TextStyle( - color: Palette.shineOrange, // not synced light - decorationColor: PaletteDark.wildBlue, // filter icon - ), - overline: TextStyle( - color: Palette.blueAlice, // filter button - backgroundColor: PaletteDark.darkCyanBlue, // date section row - decorationColor: Palette.blueAlice // icons (transaction and trade rows) - ), - subhead: TextStyle( - color: Palette.blueAlice, // address button border - decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) - ), - headline: TextStyle( - color: Colors.white, // qr code - decorationColor: Palette.darkBlueCraiola, // bottom border of amount (receive page) - ), - display1: TextStyle( - color: PaletteDark.lightBlueGrey, // icons color (receive page) - decorationColor: Palette.moderateLavender, // icons background (receive page) - ), - display2: TextStyle( - color: Palette.darkBlueCraiola, // text color of tiles (receive page) - decorationColor: Palette.blueAlice // background of tiles (receive page) - ), - display3: TextStyle( - color: Colors.white, // text color of current tile (receive page), - //decorationColor: Palette.blueCraiola // background of current tile (receive page) - decorationColor: Palette.blueCraiola // background of current tile (receive page) - ), - display4: TextStyle( - color: Palette.violetBlue, // text color of tiles (account list) - decorationColor: Colors.white // background of tiles (account list) - ), - subtitle: TextStyle( - color: Palette.protectiveBlue, // text color of current tile (account list) - decorationColor: Colors.white // background of current tile (account list) - ), - body1: TextStyle( - color: Palette.moderatePurpleBlue, // scrollbar thumb - decorationColor: Palette.periwinkleCraiola // scrollbar background - ), - body2: TextStyle( - color: Palette.moderateLavender, // menu header - decorationColor: Colors.white, // menu background - ) - ), - primaryTextTheme: TextTheme( - title: TextStyle( - color: Palette.darkBlueCraiola, // title color - backgroundColor: Palette.wildPeriwinkle // textfield underline - ), - caption: TextStyle( - color: PaletteDark.pigeonBlue, // secondary text - decorationColor: Palette.wildLavender // menu divider - ), - overline: TextStyle( - color: Palette.darkGray, // transaction/trade details titles - decorationColor: PaletteDark.darkCyanBlue, // placeholder - ), - subhead: TextStyle( - color: Palette.blueCraiola, // first gradient color (send page) - decorationColor: Palette.blueGreyCraiola // second gradient color (send page) - ), - headline: TextStyle( - color: Colors.white.withOpacity(0.5), // text field border color (send page) - decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) - ), - display1: TextStyle( - color: Colors.white.withOpacity(0.2), // text field button color (send page) - decorationColor: Colors.white // text field button icon color (send page) - ), - display2: TextStyle( - color: Colors.white.withOpacity(0.5), // estimated fee (send page) - decorationColor: Palette.moderateLavender // template dotted border (send page) - ), - display3: TextStyle( - color: Palette.darkBlueCraiola, // template new text (send page) - decorationColor: Palette.blueAlice // template background color (send page) - ), - display4: TextStyle( - color: Palette.darkBlueCraiola, // template title (send page) - decorationColor: Palette.niagara // receive amount text (exchange page) - ), - subtitle: TextStyle( - color: Palette.blueCraiola, // first gradient color top panel (exchange page) - decorationColor: Palette.blueGreyCraiola // second gradient color top panel (exchange page) - ), - body1: TextStyle( - color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) - decorationColor: Palette.blueGreyCraiola.withOpacity(0.7), // second gradient color bottom panel (exchange page) - backgroundColor: Palette.protectiveBlue // alert right button text - ), - body2: TextStyle( - color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) - decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) - backgroundColor: Palette.brightOrange // alert left button text - ) - ), - focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) - accentTextTheme: TextTheme( - title: TextStyle( - color: Colors.white, // picker background - backgroundColor: Palette.periwinkleCraiola, // picker divider - decorationColor: Colors.white // dialog background - ), - caption: TextStyle( - color: Palette.blueAlice, // container (confirm exchange) - backgroundColor: Palette.blueAlice, // button background (confirm exchange) - decorationColor: Palette.darkBlueCraiola, // text color (information page) - ), - subtitle: TextStyle( - color: Palette.darkBlueCraiola, // QR code (exchange trade page) - backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) - decorationColor: Palette.protectiveBlue // crete new wallet button background (wallet list page) - ), - headline: TextStyle( - color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) - backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) - decorationColor: Colors.white // restore wallet button text color (wallet list page) - ), - subhead: TextStyle( - color: Palette.darkGray, // titles color (filter widget) - backgroundColor: Palette.periwinkle, // divider color (filter widget) - decorationColor: Colors.white // checkbox background (filter widget) - ), - overline: TextStyle( - color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) - decorationColor: Colors.white, // menu subname - ), - display1: TextStyle( - color: Palette.blueCraiola, // first gradient color (menu header) - decorationColor: Palette.blueGreyCraiola, // second gradient color(menu header) - backgroundColor: PaletteDark.darkNightBlue // active dot color - ), - display2: TextStyle( - color: Palette.shadowWhite, // action button color (address text field) - decorationColor: Palette.darkGray, // hint text (seed widget) - backgroundColor: Palette.darkBlueCraiola.withOpacity(0.67) // text on balance page - ), - display3: TextStyle( - color: Palette.darkGray, // hint text (new wallet page) - decorationColor: Palette.periwinkleCraiola, // underline (new wallet page) - backgroundColor: Palette.darkBlueCraiola // menu, icons, balance (dashboard page) - ), - display4: TextStyle( - color: Palette.darkGray, // switch background (settings page) - decorationColor: Colors.white.withOpacity(0.4) // hint text (exchange page) - ), - body1: TextStyle( - color: Palette.darkGray, // indicators (PIN code) - decorationColor: Palette.darkGray, // switch (PIN code) - backgroundColor: Colors.white // alert right button - ), - body2: TextStyle( - color: Palette.protectiveBlue, // primary buttons - decorationColor: Colors.white, // alert left button, - backgroundColor: Palette.dullGray // keyboard bar color - ), - ), - cardColor: Palette.protectiveBlue // bottom button (action list) - ); - - static final ThemeData brightTheme = ThemeData( - fontFamily: 'Lato', - brightness: Brightness.light, - backgroundColor: Colors.white, - accentColor: Palette.blueCraiola, // first gradient color - scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color - primaryColor: Palette.redHat, // third gradient color - buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page - indicatorColor: Colors.white.withOpacity(0.5), // page indicator - hoverColor: Colors.white, // amount hint text (receive page) - dividerColor: Palette.paleBlue, - hintColor: Palette.gray, - textTheme: TextTheme( - title: TextStyle( - color: Colors.white, // sync_indicator text - backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator - decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator - ), - caption: TextStyle( - color: Palette.shineOrange, // not synced light - decorationColor: Colors.white, // filter icon - ), - overline: TextStyle( - color: Colors.white.withOpacity(0.2), // filter button - backgroundColor: Colors.white.withOpacity(0.5), // date section row - decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows) - ), - subhead: TextStyle( - color: Colors.white.withOpacity(0.2), // address button border - decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget) - ), - headline: TextStyle( - color: Colors.white, // qr code - decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page) - ), - display1: TextStyle( - color: PaletteDark.lightBlueGrey, // icons color (receive page) - decorationColor: Palette.lavender, // icons background (receive page) - ), - display2: TextStyle( - color: Palette.darkBlueCraiola, // text color of tiles (receive page) - decorationColor: Colors.white // background of tiles (receive page) - ), - display3: TextStyle( - color: Colors.white, // text color of current tile (receive page), - //decorationColor: Palette.blueCraiola // background of current tile (receive page) - decorationColor: Palette.moderateSlateBlue // background of current tile (receive page) - ), - display4: TextStyle( - color: Palette.violetBlue, // text color of tiles (account list) - decorationColor: Colors.white // background of tiles (account list) - ), - subtitle: TextStyle( - color: Palette.moderateSlateBlue, // text color of current tile (account list) - decorationColor: Colors.white // background of current tile (account list) - ), - body1: TextStyle( - color: Palette.moderatePurpleBlue, // scrollbar thumb - decorationColor: Palette.periwinkleCraiola // scrollbar background - ), - body2: TextStyle( - color: Palette.moderateLavender, // menu header - decorationColor: Colors.white, // menu background - ) - ), - primaryTextTheme: TextTheme( - title: TextStyle( - color: Palette.darkBlueCraiola, // title color - backgroundColor: Palette.wildPeriwinkle // textfield underline - ), - caption: TextStyle( - color: PaletteDark.pigeonBlue, // secondary text - decorationColor: Palette.wildLavender // menu divider - ), - overline: TextStyle( - color: Palette.darkGray, // transaction/trade details titles - decorationColor: Colors.white.withOpacity(0.5), // placeholder - ), - subhead: TextStyle( - color: Palette.blueCraiola, // first gradient color (send page) - decorationColor: Palette.pinkFlamingo // second gradient color (send page) - ), - headline: TextStyle( - color: Colors.white.withOpacity(0.5), // text field border color (send page) - decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page) - ), - display1: TextStyle( - color: Colors.white.withOpacity(0.2), // text field button color (send page) - decorationColor: Colors.white // text field button icon color (send page) - ), - display2: TextStyle( - color: Colors.white.withOpacity(0.5), // estimated fee (send page) - decorationColor: Palette.shadowWhite // template dotted border (send page) - ), - display3: TextStyle( - color: Palette.darkBlueCraiola, // template new text (send page) - decorationColor: Palette.shadowWhite // template background color (send page) - ), - display4: TextStyle( - color: Palette.darkBlueCraiola, // template title (send page) - decorationColor: Palette.niagara // receive amount text (exchange page) - ), - subtitle: TextStyle( - color: Palette.blueCraiola, // first gradient color top panel (exchange page) - decorationColor: Palette.pinkFlamingo // second gradient color top panel (exchange page) - ), - body1: TextStyle( - color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page) - decorationColor: Palette.pinkFlamingo.withOpacity(0.7), // second gradient color bottom panel (exchange page) - backgroundColor: Colors.white // alert right button text - ), - body2: TextStyle( - color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page) - decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page) - backgroundColor: Colors.white // alert left button text - ) - ), - focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page) - accentTextTheme: TextTheme( - title: TextStyle( - color: Colors.white, // picker background - backgroundColor: Palette.periwinkleCraiola, // picker divider - decorationColor: Colors.white // dialog background - ), - caption: TextStyle( - color: Palette.moderateLavender, // container (confirm exchange) - backgroundColor: Palette.moderateLavender, // button background (confirm exchange) - decorationColor: Palette.darkBlueCraiola, // text color (information page) - ), - subtitle: TextStyle( - color: Palette.darkBlueCraiola, // QR code (exchange trade page) - backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page) - //decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page) - decorationColor: Palette.moderateSlateBlue // crete new wallet button background (wallet list page) - ), - headline: TextStyle( - color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page) - backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page) - decorationColor: Colors.white // restore wallet button text color (wallet list page) - ), - subhead: TextStyle( - color: Palette.darkGray, // titles color (filter widget) - backgroundColor: Palette.periwinkle, // divider color (filter widget) - decorationColor: Colors.white // checkbox background (filter widget) - ), - overline: TextStyle( - color: Palette.wildPeriwinkle, // checkbox bounds (filter widget) - decorationColor: Colors.white, // menu subname - ), - display1: TextStyle( - color: Palette.blueCraiola, // first gradient color (menu header) - decorationColor: Palette.pinkFlamingo, // second gradient color(menu header) - backgroundColor: Colors.white // active dot color - ), - display2: TextStyle( - color: Palette.shadowWhite, // action button color (address text field) - decorationColor: Palette.darkGray, // hint text (seed widget) - backgroundColor: Colors.white.withOpacity(0.5) // text on balance page - ), - display3: TextStyle( - color: Palette.darkGray, // hint text (new wallet page) - decorationColor: Palette.periwinkleCraiola, // underline (new wallet page) - backgroundColor: Colors.white // menu, icons, balance (dashboard page) - ), - display4: TextStyle( - color: Palette.darkGray, // switch background (settings page) - decorationColor: Colors.white.withOpacity(0.4) // hint text (exchange page) - ), - body1: TextStyle( - color: Palette.darkGray, // indicators (PIN code) - decorationColor: Palette.darkGray, // switch (PIN code) - backgroundColor: Palette.moderateSlateBlue // alert right button - ), - body2: TextStyle( - color: Palette.moderateSlateBlue, // primary buttons - decorationColor: Palette.brightOrange, // alert left button, - backgroundColor: Palette.dullGray // keyboard bar color - ), - ), - cardColor: Palette.moderateSlateBlue // bottom button (action list) - ); - - static final ThemeData darkTheme = ThemeData( - fontFamily: 'Lato', - brightness: Brightness.dark, - backgroundColor: PaletteDark.backgroundColor, - accentColor: PaletteDark.backgroundColor, // first gradient color - scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color - primaryColor: PaletteDark.backgroundColor, // third gradient color - buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page - indicatorColor: PaletteDark.cyanBlue, // page indicator - hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page) - dividerColor: PaletteDark.dividerColor, - hintColor: PaletteDark.pigeonBlue, // menu - textTheme: TextTheme( - title: TextStyle( - color: PaletteDark.wildBlue, // sync_indicator text - backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator - decorationColor: PaletteDark.oceanBlue // not synced sync_indicator - ), - caption: TextStyle( - color: PaletteDark.orangeYellow, // not synced light - decorationColor: PaletteDark.wildBlue, // filter icon - ), - overline: TextStyle( - color: PaletteDark.oceanBlue, // filter button - backgroundColor: PaletteDark.darkCyanBlue, // date section row - decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows) - ), - subhead: TextStyle( - color: PaletteDark.nightBlue, // address button border - decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget) - ), - headline: TextStyle( - color: PaletteDark.lightBlueGrey, // qr code - decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page) - ), - display1: TextStyle( - color: Colors.white, // icons color (receive page) - decorationColor: PaletteDark.distantNightBlue, // icons background (receive page) - ), - display2: TextStyle( - color: Colors.white, // text color of tiles (receive page) - decorationColor: PaletteDark.nightBlue // background of tiles (receive page) - ), - display3: TextStyle( - color: Palette.blueCraiola, // text color of current tile (receive page) - decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page) - ), - display4: TextStyle( - color: Colors.white, // text color of tiles (account list) - decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list) - ), - subtitle: TextStyle( - color: Palette.blueCraiola, // text color of current tile (account list) - decorationColor: PaletteDark.darkNightBlue // background of current tile (account list) - ), - body1: TextStyle( - color: PaletteDark.wildBlueGrey, // scrollbar thumb - decorationColor: PaletteDark.violetBlue // scrollbar background - ), - body2: TextStyle( - color: PaletteDark.deepPurpleBlue, // menu header - decorationColor: PaletteDark.deepPurpleBlue, // menu background - ) - ), - primaryTextTheme: TextTheme( - title: TextStyle( - color: Colors.white, // title color - backgroundColor: PaletteDark.darkOceanBlue // textfield underline - ), - caption: TextStyle( - color: PaletteDark.darkCyanBlue, // secondary text - decorationColor: PaletteDark.darkOceanBlue // menu divider - ), - overline: TextStyle( - color: PaletteDark.lightBlueGrey, // transaction/trade details titles - decorationColor: Colors.grey, // placeholder - ), - subhead: TextStyle( - color: PaletteDark.darkNightBlue, // first gradient color (send page) - decorationColor: PaletteDark.darkNightBlue // second gradient color (send page) - ), - headline: TextStyle( - color: PaletteDark.lightVioletBlue, // text field border color (send page) - decorationColor: PaletteDark.darkCyanBlue, // text field hint color (send page) - ), - display1: TextStyle( - color: PaletteDark.buttonNightBlue, // text field button color (send page) - decorationColor: PaletteDark.gray // text field button icon color (send page) - ), - display2: TextStyle( - color: Colors.white, // estimated fee (send page) - decorationColor: PaletteDark.darkCyanBlue // template dotted border (send page) - ), - display3: TextStyle( - color: PaletteDark.darkCyanBlue, // template new text (send page) - decorationColor: PaletteDark.darkVioletBlue // template background color (send page) - ), - display4: TextStyle( - color: PaletteDark.cyanBlue, // template title (send page) - decorationColor: PaletteDark.darkCyanBlue // receive amount text (exchange page) - ), - subtitle: TextStyle( - color: PaletteDark.wildVioletBlue, // first gradient color top panel (exchange page) - decorationColor: PaletteDark.wildVioletBlue // second gradient color top panel (exchange page) - ), - body1: TextStyle( - color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page) - decorationColor: PaletteDark.darkNightBlue, // second gradient color bottom panel (exchange page) - backgroundColor: Colors.white // alert right button text - ), - body2: TextStyle( - color: PaletteDark.blueGrey, // text field border on top panel (exchange page) - decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page) - backgroundColor: Colors.white // alert left button text - ) - ), - focusColor: PaletteDark.moderateBlue, // text field button (exchange page) - accentTextTheme: TextTheme( - title: TextStyle( - color: PaletteDark.nightBlue, // picker background - backgroundColor: PaletteDark.dividerColor, // picker divider - decorationColor: PaletteDark.darkNightBlue // dialog background - ), - caption: TextStyle( - color: PaletteDark.nightBlue, // container (confirm exchange) - backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange) - decorationColor: Palette.darkLavender, // text color (information page) - ), - subtitle: TextStyle( - //color: PaletteDark.lightBlueGrey, // QR code (exchange trade page) - color: Colors.white, // QR code (exchange trade page) - backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page) - decorationColor: Colors.white // crete new wallet button background (wallet list page) - ), - headline: TextStyle( - color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page) - backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page) - decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page) - ), - subhead: TextStyle( - color: Colors.white, // titles color (filter widget) - backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget) - decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget) - ), - overline: TextStyle( - color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget) - decorationColor: PaletteDark.darkCyanBlue, // menu subname - ), - display1: TextStyle( - color: PaletteDark.deepPurpleBlue, // first gradient color (menu header) - decorationColor: PaletteDark.deepPurpleBlue, // second gradient color(menu header) - backgroundColor: Colors.white // active dot color - ), - display2: TextStyle( - color: PaletteDark.nightBlue, // action button color (address text field) - decorationColor: PaletteDark.darkCyanBlue, // hint text (seed widget) - backgroundColor: PaletteDark.cyanBlue // text on balance page - ), - display3: TextStyle( - color: PaletteDark.cyanBlue, // hint text (new wallet page) - decorationColor: PaletteDark.darkGrey, // underline (new wallet page) - backgroundColor: Colors.white // menu, icons, balance (dashboard page) - ), - display4: TextStyle( - color: PaletteDark.deepVioletBlue, // switch background (settings page) - decorationColor: PaletteDark.lightBlueGrey // hint text (exchange page) - ), - body1: TextStyle( - color: PaletteDark.indicatorVioletBlue, // indicators (PIN code) - decorationColor: PaletteDark.lightPurpleBlue, // switch (PIN code) - backgroundColor: Palette.blueCraiola // alert right button - ), - body2: TextStyle( - color: Palette.blueCraiola, // primary buttons - decorationColor: Palette.alizarinRed, // alert left button - backgroundColor: PaletteDark.granite // keyboard bar color - ), - ), - cardColor: PaletteDark.darkNightBlue // bottom button (action list) - ); -} \ No newline at end of file diff --git a/lib/view_model/settings/settings_view_model.dart b/lib/view_model/settings/settings_view_model.dart index 08ccb40b4..472e99767 100644 --- a/lib/view_model/settings/settings_view_model.dart +++ b/lib/view_model/settings/settings_view_model.dart @@ -1,5 +1,6 @@ +import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/src/themes/theme_list.dart'; import 'package:cake_wallet/src/screens/pin_code/pin_code_widget.dart'; -import 'package:cake_wallet/themes.dart'; import 'package:flutter/cupertino.dart'; import 'package:mobx/mobx.dart'; import 'package:package_info/package_info.dart'; @@ -109,9 +110,9 @@ abstract class SettingsViewModelBase with Store { }), PickerListItem( title: S.current.color_theme, - items: Themes.all, + items: ThemeList.all, selectedItem: () => theme, - onItemSelected: (Themes theme) => + onItemSelected: (ThemeBase theme) => _settingsStore.currentTheme = theme) ], [ @@ -189,7 +190,7 @@ abstract class SettingsViewModelBase with Store { _settingsStore.allowBiometricalAuthentication; @computed - Themes get theme => _settingsStore.currentTheme; + ThemeBase get theme => _settingsStore.currentTheme; final Map itemHeaders; List> sections; From 6639238ca7547b1c74079dca17c7f1244bcc6f2c Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Tue, 15 Dec 2020 21:43:50 +0200 Subject: [PATCH 06/10] CAKE-182 | moved themes directory from src to lib --- lib/main.dart | 2 +- lib/src/screens/base_page.dart | 2 +- lib/src/screens/new_wallet/new_wallet_page.dart | 2 +- lib/src/screens/new_wallet/new_wallet_type_page.dart | 2 +- lib/src/screens/seed/pre_seed_page.dart | 2 +- lib/src/screens/seed/wallet_seed_page.dart | 2 +- lib/src/screens/seed_language/seed_language_page.dart | 2 +- lib/src/screens/welcome/welcome_page.dart | 2 +- lib/store/settings_store.dart | 4 ++-- lib/{src => }/themes/bright_theme.dart | 2 +- lib/{src => }/themes/dark_theme.dart | 2 +- lib/{src => }/themes/light_theme.dart | 2 +- lib/{src => }/themes/theme_base.dart | 0 lib/{src => }/themes/theme_list.dart | 8 ++++---- lib/view_model/settings/settings_view_model.dart | 4 ++-- 15 files changed, 19 insertions(+), 19 deletions(-) rename lib/{src => }/themes/bright_theme.dart (99%) rename lib/{src => }/themes/dark_theme.dart (99%) rename lib/{src => }/themes/light_theme.dart (99%) rename lib/{src => }/themes/theme_base.dart (100%) rename lib/{src => }/themes/theme_list.dart (66%) diff --git a/lib/main.dart b/lib/main.dart index fae053798..3c52f4ad1 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:hive/hive.dart'; diff --git a/lib/src/screens/base_page.dart b/lib/src/screens/base_page.dart index 7af4b1a50..77e0e92fe 100644 --- a/lib/src/screens/base_page.dart +++ b/lib/src/screens/base_page.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/palette.dart'; diff --git a/lib/src/screens/new_wallet/new_wallet_page.dart b/lib/src/screens/new_wallet/new_wallet_page.dart index 638fdf028..e6e1a958d 100644 --- a/lib/src/screens/new_wallet/new_wallet_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_page.dart @@ -1,5 +1,5 @@ import 'package:cake_wallet/routes.dart'; -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:mobx/mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; diff --git a/lib/src/screens/new_wallet/new_wallet_type_page.dart b/lib/src/screens/new_wallet/new_wallet_type_page.dart index 49ed74a9a..59c803871 100644 --- a/lib/src/screens/new_wallet/new_wallet_type_page.dart +++ b/lib/src/screens/new_wallet/new_wallet_type_page.dart @@ -1,5 +1,5 @@ import 'package:cake_wallet/entities/wallet_type.dart'; -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:cake_wallet/generated/i18n.dart'; diff --git a/lib/src/screens/seed/pre_seed_page.dart b/lib/src/screens/seed/pre_seed_page.dart index b04206e8b..0a2bc0161 100644 --- a/lib/src/screens/seed/pre_seed_page.dart +++ b/lib/src/screens/seed/pre_seed_page.dart @@ -1,5 +1,5 @@ import 'package:cake_wallet/routes.dart'; -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/generated/i18n.dart'; diff --git a/lib/src/screens/seed/wallet_seed_page.dart b/lib/src/screens/seed/wallet_seed_page.dart index f783442ae..5bdd07be6 100644 --- a/lib/src/screens/seed/wallet_seed_page.dart +++ b/lib/src/screens/seed/wallet_seed_page.dart @@ -1,5 +1,5 @@ import 'package:cake_wallet/palette.dart'; -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart'; import 'package:cake_wallet/utils/show_bar.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; diff --git a/lib/src/screens/seed_language/seed_language_page.dart b/lib/src/screens/seed_language/seed_language_page.dart index 5cc614e00..541c9b8c1 100644 --- a/lib/src/screens/seed_language/seed_language_page.dart +++ b/lib/src/screens/seed_language/seed_language_page.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/src/widgets/seed_language_selector.dart'; import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter/material.dart'; diff --git a/lib/src/screens/welcome/welcome_page.dart b/lib/src/screens/welcome/welcome_page.dart index 9a12d5b69..35934f64f 100644 --- a/lib/src/screens/welcome/welcome_page.dart +++ b/lib/src/screens/welcome/welcome_page.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; diff --git a/lib/store/settings_store.dart b/lib/store/settings_store.dart index d8f009273..f6cc7c1fe 100644 --- a/lib/store/settings_store.dart +++ b/lib/store/settings_store.dart @@ -1,6 +1,6 @@ import 'package:cake_wallet/entities/preferences_key.dart'; -import 'package:cake_wallet/src/themes/theme_base.dart'; -import 'package:cake_wallet/src/themes/theme_list.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_list.dart'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:hive/hive.dart'; diff --git a/lib/src/themes/bright_theme.dart b/lib/themes/bright_theme.dart similarity index 99% rename from lib/src/themes/bright_theme.dart rename to lib/themes/bright_theme.dart index 97ffb0b72..39c33f8f1 100644 --- a/lib/src/themes/bright_theme.dart +++ b/lib/themes/bright_theme.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/palette.dart'; import 'package:flutter/material.dart'; diff --git a/lib/src/themes/dark_theme.dart b/lib/themes/dark_theme.dart similarity index 99% rename from lib/src/themes/dark_theme.dart rename to lib/themes/dark_theme.dart index 409dd699b..09fb5526f 100644 --- a/lib/src/themes/dark_theme.dart +++ b/lib/themes/dark_theme.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/palette.dart'; import 'package:flutter/material.dart'; diff --git a/lib/src/themes/light_theme.dart b/lib/themes/light_theme.dart similarity index 99% rename from lib/src/themes/light_theme.dart rename to lib/themes/light_theme.dart index ae64d74d8..7d1486a91 100644 --- a/lib/src/themes/light_theme.dart +++ b/lib/themes/light_theme.dart @@ -1,4 +1,4 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/palette.dart'; import 'package:flutter/material.dart'; diff --git a/lib/src/themes/theme_base.dart b/lib/themes/theme_base.dart similarity index 100% rename from lib/src/themes/theme_base.dart rename to lib/themes/theme_base.dart diff --git a/lib/src/themes/theme_list.dart b/lib/themes/theme_list.dart similarity index 66% rename from lib/src/themes/theme_list.dart rename to lib/themes/theme_list.dart index 2e1aa1fb8..b4cea1391 100644 --- a/lib/src/themes/theme_list.dart +++ b/lib/themes/theme_list.dart @@ -1,7 +1,7 @@ -import 'package:cake_wallet/src/themes/bright_theme.dart'; -import 'package:cake_wallet/src/themes/dark_theme.dart'; -import 'package:cake_wallet/src/themes/light_theme.dart'; -import 'package:cake_wallet/src/themes/theme_base.dart'; +import 'package:cake_wallet/themes/bright_theme.dart'; +import 'package:cake_wallet/themes/dark_theme.dart'; +import 'package:cake_wallet/themes/light_theme.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; class ThemeList { static final all = [lightTheme, brightTheme, darkTheme]; diff --git a/lib/view_model/settings/settings_view_model.dart b/lib/view_model/settings/settings_view_model.dart index 472e99767..c416dd096 100644 --- a/lib/view_model/settings/settings_view_model.dart +++ b/lib/view_model/settings/settings_view_model.dart @@ -1,5 +1,5 @@ -import 'package:cake_wallet/src/themes/theme_base.dart'; -import 'package:cake_wallet/src/themes/theme_list.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; +import 'package:cake_wallet/themes/theme_list.dart'; import 'package:cake_wallet/src/screens/pin_code/pin_code_widget.dart'; import 'package:flutter/cupertino.dart'; import 'package:mobx/mobx.dart'; From 4098f6f586fa11b2f29f1c033e686e474d085f01 Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Wed, 16 Dec 2020 22:45:45 +0200 Subject: [PATCH 07/10] CAKE-182 | fixed status bar on dashboard and receive pages --- lib/src/screens/dashboard/dashboard_page.dart | 4 +++- lib/src/screens/receive/receive_page.dart | 4 +++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index d94759404..b88afced6 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -1,5 +1,6 @@ import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/routes.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart'; @@ -20,7 +21,8 @@ class DashboardPage extends BasePage { }); @override - Color get backgroundLightColor => Colors.transparent; + Color get backgroundLightColor => currentTheme.type == ThemeType.bright + ? Colors.transparent : Colors.white; @override Color get backgroundDarkColor => Colors.transparent; diff --git a/lib/src/screens/receive/receive_page.dart b/lib/src/screens/receive/receive_page.dart index 6a84408e6..c441bd380 100644 --- a/lib/src/screens/receive/receive_page.dart +++ b/lib/src/screens/receive/receive_page.dart @@ -1,4 +1,5 @@ import 'package:cake_wallet/src/widgets/keyboard_done_button.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; @@ -27,7 +28,8 @@ class ReceivePage extends BasePage { String get title => S.current.receive; @override - Color get backgroundLightColor => Colors.transparent; + Color get backgroundLightColor => currentTheme.type == ThemeType.bright + ? Colors.transparent : Colors.white; @override Color get backgroundDarkColor => Colors.transparent; From 8a0f8152166bcb1992d2d777e45073a539d0ca74 Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Wed, 16 Dec 2020 22:58:10 +0200 Subject: [PATCH 08/10] CAKE-182 | fixed status bar --- lib/main.dart | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lib/main.dart b/lib/main.dart index 3c52f4ad1..72a5fc75b 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -133,8 +133,8 @@ class App extends StatelessWidget { return Observer(builder: (BuildContext context) { final currentTheme = settingsStore.currentTheme; final statusBarBrightness = currentTheme.type == ThemeType.dark - ? Brightness.dark - : Brightness.light; + ? Brightness.light + : Brightness.dark; final statusBarIconBrightness = currentTheme.type == ThemeType.dark ? Brightness.light : Brightness.dark; From c257c60d72f211b20b68b73705b4d1667366c9bc Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Thu, 17 Dec 2020 20:14:16 +0200 Subject: [PATCH 09/10] CAKE-210 | added possibility to enter comma in amount field (qr_widget.dart); replaced comma by dot in the MoneroURI and BitcoinURI classes (wallet_address_list_view_model.dart) --- lib/src/screens/receive/widgets/qr_widget.dart | 2 +- .../wallet_address_list/wallet_address_list_view_model.dart | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/src/screens/receive/widgets/qr_widget.dart b/lib/src/screens/receive/widgets/qr_widget.dart index e94351266..2b77ce851 100644 --- a/lib/src/screens/receive/widgets/qr_widget.dart +++ b/lib/src/screens/receive/widgets/qr_widget.dart @@ -67,7 +67,7 @@ class QRWidget extends StatelessWidget { decimal: true), inputFormatters: [ BlacklistingTextInputFormatter( - RegExp('[\\-|\\ |\\,]')) + RegExp('[\\-|\\ ]')) ], textAlign: TextAlign.center, hintText: S.of(context).receive_amount, diff --git a/lib/view_model/wallet_address_list/wallet_address_list_view_model.dart b/lib/view_model/wallet_address_list/wallet_address_list_view_model.dart index aca1ef808..0e8fe850c 100644 --- a/lib/view_model/wallet_address_list/wallet_address_list_view_model.dart +++ b/lib/view_model/wallet_address_list/wallet_address_list_view_model.dart @@ -31,7 +31,7 @@ class MoneroURI extends PaymentURI { var base = 'monero:' + address; if (amount?.isNotEmpty ?? false) { - base += '?tx_amount=$amount'; + base += '?tx_amount=${amount.replaceAll(',', '.')}'; } return base; @@ -47,7 +47,7 @@ class BitcoinURI extends PaymentURI { var base = 'bitcoin:' + address; if (amount?.isNotEmpty ?? false) { - base += '?amount=$amount'; + base += '?amount=${amount.replaceAll(',', '.')}'; } return base; From 572948d17636b7b456ddc3aeae23a3910911a4f2 Mon Sep 17 00:00:00 2001 From: OleksandrSobol Date: Fri, 18 Dec 2020 15:21:30 +0200 Subject: [PATCH 10/10] CAKE-219 | changed buttons color for dark mode on send and wallet list pages; change button text color on send template page --- lib/src/screens/send/send_page.dart | 10 ++-------- lib/src/screens/send/send_template_page.dart | 3 +-- lib/src/screens/wallet_list/wallet_list_page.dart | 9 +++------ 3 files changed, 6 insertions(+), 16 deletions(-) diff --git a/lib/src/screens/send/send_page.dart b/lib/src/screens/send/send_page.dart index 50fb14d04..e269af635 100644 --- a/lib/src/screens/send/send_page.dart +++ b/lib/src/screens/send/send_page.dart @@ -496,14 +496,8 @@ class SendPage extends BasePage { } }, text: S.of(context).send, - color: Theme.of(context) - .accentTextTheme - .subtitle - .decorationColor, - textColor: Theme.of(context) - .accentTextTheme - .headline - .decorationColor, + color: Theme.of(context).accentTextTheme.body2.color, + textColor: Colors.white, isLoading: sendViewModel.state is IsExecutingState || sendViewModel.state is TransactionCommitting, isDisabled: diff --git a/lib/src/screens/send/send_template_page.dart b/lib/src/screens/send/send_template_page.dart index 77b63c7af..0dcbc010a 100644 --- a/lib/src/screens/send/send_template_page.dart +++ b/lib/src/screens/send/send_template_page.dart @@ -246,8 +246,7 @@ class SendTemplatePage extends BasePage { }, text: S.of(context).save, color: Colors.green, - textColor: - Theme.of(context).accentTextTheme.headline.decorationColor, + textColor: Colors.white, ), ), )); diff --git a/lib/src/screens/wallet_list/wallet_list_page.dart b/lib/src/screens/wallet_list/wallet_list_page.dart index 1b15a8e0e..6c6e01900 100644 --- a/lib/src/screens/wallet_list/wallet_list_page.dart +++ b/lib/src/screens/wallet_list/wallet_list_page.dart @@ -1,5 +1,4 @@ import 'package:cake_wallet/src/screens/auth/auth_page.dart'; -import 'package:cake_wallet/src/screens/wallet_list/widgets/wallet_menu_alert.dart'; import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart'; import 'package:cake_wallet/utils/show_bar.dart'; import 'package:cake_wallet/utils/show_pop_up.dart'; @@ -15,7 +14,6 @@ import 'package:cake_wallet/view_model/wallet_list/wallet_list_view_model.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; -import 'package:cake_wallet/src/screens/wallet_list/wallet_menu.dart'; import 'package:flutter_slidable/flutter_slidable.dart'; class WalletListPage extends BasePage { @@ -51,7 +49,7 @@ class WalletListBodyState extends State { final newWalletImage = Image.asset('assets/images/new_wallet.png', height: 12, width: 12, - color: Theme.of(context).accentTextTheme.headline.decorationColor); + color: Colors.white); final restoreWalletImage = Image.asset('assets/images/restore_wallet.png', height: 12, width: 12, @@ -168,9 +166,8 @@ class WalletListBodyState extends State { onPressed: () => _generateNewWallet(), image: newWalletImage, text: S.of(context).wallet_list_create_new_wallet, - color: Theme.of(context).accentTextTheme.subtitle.decorationColor, - textColor: - Theme.of(context).accentTextTheme.headline.decorationColor, + color: Theme.of(context).accentTextTheme.body2.color, + textColor: Colors.white, ), SizedBox(height: 10.0), PrimaryImageButton(