diff --git a/assets/svg/address-book2.svg b/assets/svg/address-book2.svg new file mode 100644 index 000000000..18de31c55 --- /dev/null +++ b/assets/svg/address-book2.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/svg/chevron-right.svg b/assets/svg/chevron-right.svg new file mode 100644 index 000000000..c8efcde44 --- /dev/null +++ b/assets/svg/chevron-right.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/svg/dark/bell-new.svg b/assets/svg/dark/bell-new.svg new file mode 100644 index 000000000..f976e0986 --- /dev/null +++ b/assets/svg/dark/bell-new.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/svg/dark/buy-coins-icon.svg b/assets/svg/dark/buy-coins-icon.svg new file mode 100644 index 000000000..9170c4190 --- /dev/null +++ b/assets/svg/dark/buy-coins-icon.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/assets/svg/dark/exchange-2.svg b/assets/svg/dark/exchange-2.svg new file mode 100644 index 000000000..ee04dcebe --- /dev/null +++ b/assets/svg/dark/exchange-2.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/svg/dark/stack-icon1.svg b/assets/svg/dark/stack-icon1.svg new file mode 100644 index 000000000..4fb16176a --- /dev/null +++ b/assets/svg/dark/stack-icon1.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/svg/dark/tx-exchange-icon-failed.svg b/assets/svg/dark/tx-exchange-icon-failed.svg new file mode 100644 index 000000000..64acda4e9 --- /dev/null +++ b/assets/svg/dark/tx-exchange-icon-failed.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/assets/svg/dark/tx-exchange-icon-pending.svg b/assets/svg/dark/tx-exchange-icon-pending.svg new file mode 100644 index 000000000..f9cdeb7c2 --- /dev/null +++ b/assets/svg/dark/tx-exchange-icon-pending.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/assets/svg/dark/tx-exchange-icon.svg b/assets/svg/dark/tx-exchange-icon.svg new file mode 100644 index 000000000..36b2cf7cc --- /dev/null +++ b/assets/svg/dark/tx-exchange-icon.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/svg/dark/tx-icon-receive-failed.svg b/assets/svg/dark/tx-icon-receive-failed.svg new file mode 100644 index 000000000..cb1d500b1 --- /dev/null +++ b/assets/svg/dark/tx-icon-receive-failed.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/assets/svg/dark/tx-icon-receive-pending.svg b/assets/svg/dark/tx-icon-receive-pending.svg new file mode 100644 index 000000000..efb8350b3 --- /dev/null +++ b/assets/svg/dark/tx-icon-receive-pending.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/assets/svg/dark/tx-icon-receive.svg b/assets/svg/dark/tx-icon-receive.svg new file mode 100644 index 000000000..15be19d52 --- /dev/null +++ b/assets/svg/dark/tx-icon-receive.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/svg/dark/tx-icon-send-failed.svg b/assets/svg/dark/tx-icon-send-failed.svg new file mode 100644 index 000000000..2be637ef3 --- /dev/null +++ b/assets/svg/dark/tx-icon-send-failed.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/assets/svg/dark/tx-icon-send-pending.svg b/assets/svg/dark/tx-icon-send-pending.svg new file mode 100644 index 000000000..50cca5a9e --- /dev/null +++ b/assets/svg/dark/tx-icon-send-pending.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/assets/svg/dark/tx-icon-send.svg b/assets/svg/dark/tx-icon-send.svg new file mode 100644 index 000000000..0e64ee37e --- /dev/null +++ b/assets/svg/dark/tx-icon-send.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/svg/exchange-3.svg b/assets/svg/exchange-3.svg new file mode 100644 index 000000000..4a3c92524 --- /dev/null +++ b/assets/svg/exchange-3.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/svg/bell-new.svg b/assets/svg/light/bell-new.svg similarity index 100% rename from assets/svg/bell-new.svg rename to assets/svg/light/bell-new.svg diff --git a/assets/svg/buy-coins-icon.svg b/assets/svg/light/buy-coins-icon.svg similarity index 100% rename from assets/svg/buy-coins-icon.svg rename to assets/svg/light/buy-coins-icon.svg diff --git a/assets/svg/exchange-2.svg b/assets/svg/light/exchange-2.svg similarity index 100% rename from assets/svg/exchange-2.svg rename to assets/svg/light/exchange-2.svg diff --git a/assets/svg/light/stack-icon1.svg b/assets/svg/light/stack-icon1.svg new file mode 100644 index 000000000..f316012d7 --- /dev/null +++ b/assets/svg/light/stack-icon1.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/svg/tx-exchange-icon-failed.svg b/assets/svg/light/tx-exchange-icon-failed.svg similarity index 100% rename from assets/svg/tx-exchange-icon-failed.svg rename to assets/svg/light/tx-exchange-icon-failed.svg diff --git a/assets/svg/tx-exchange-icon-pending.svg b/assets/svg/light/tx-exchange-icon-pending.svg similarity index 100% rename from assets/svg/tx-exchange-icon-pending.svg rename to assets/svg/light/tx-exchange-icon-pending.svg diff --git a/assets/svg/tx-exchange-icon.svg b/assets/svg/light/tx-exchange-icon.svg similarity index 100% rename from assets/svg/tx-exchange-icon.svg rename to assets/svg/light/tx-exchange-icon.svg diff --git a/assets/svg/tx-icon-receive-failed.svg b/assets/svg/light/tx-icon-receive-failed.svg similarity index 100% rename from assets/svg/tx-icon-receive-failed.svg rename to assets/svg/light/tx-icon-receive-failed.svg diff --git a/assets/svg/tx-icon-receive-pending.svg b/assets/svg/light/tx-icon-receive-pending.svg similarity index 100% rename from assets/svg/tx-icon-receive-pending.svg rename to assets/svg/light/tx-icon-receive-pending.svg diff --git a/assets/svg/tx-icon-receive.svg b/assets/svg/light/tx-icon-receive.svg similarity index 100% rename from assets/svg/tx-icon-receive.svg rename to assets/svg/light/tx-icon-receive.svg diff --git a/assets/svg/tx-icon-send-failed.svg b/assets/svg/light/tx-icon-send-failed.svg similarity index 100% rename from assets/svg/tx-icon-send-failed.svg rename to assets/svg/light/tx-icon-send-failed.svg diff --git a/assets/svg/tx-icon-send-pending.svg b/assets/svg/light/tx-icon-send-pending.svg similarity index 100% rename from assets/svg/tx-icon-send-pending.svg rename to assets/svg/light/tx-icon-send-pending.svg diff --git a/assets/svg/tx-icon-send.svg b/assets/svg/light/tx-icon-send.svg similarity index 100% rename from assets/svg/tx-icon-send.svg rename to assets/svg/light/tx-icon-send.svg diff --git a/assets/svg/message-question-1.svg b/assets/svg/message-question-1.svg new file mode 100644 index 000000000..17e066651 --- /dev/null +++ b/assets/svg/message-question-1.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/assets/svg/minimize.svg b/assets/svg/minimize.svg new file mode 100644 index 000000000..94292fed4 --- /dev/null +++ b/assets/svg/minimize.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/assets/svg/stack-icon1.svg b/assets/svg/stack-icon1.svg deleted file mode 100644 index bf5f8fae7..000000000 --- a/assets/svg/stack-icon1.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/assets/svg/wallet-fa.svg b/assets/svg/wallet-fa.svg new file mode 100644 index 000000000..a91170596 --- /dev/null +++ b/assets/svg/wallet-fa.svg @@ -0,0 +1,4 @@ + + + + diff --git a/lib/hive/db.dart b/lib/hive/db.dart index 3aae3096a..c8e148923 100644 --- a/lib/hive/db.dart +++ b/lib/hive/db.dart @@ -9,7 +9,6 @@ import 'package:stackwallet/models/notification_model.dart'; import 'package:stackwallet/models/trade_wallet_lookup.dart'; import 'package:stackwallet/services/wallets_service.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; - import 'package:stackwallet/utilities/logger.dart'; class DB { @@ -30,6 +29,7 @@ class DB { static const String boxNameWalletsToDeleteOnStart = "walletsToDeleteOnStart"; static const String boxNamePriceCache = "priceAPIPrice24hCache"; static const String boxNameDBInfo = "dbInfo"; + static const String boxNameTheme = "theme"; String boxNameTxCache({required Coin coin}) => "${coin.name}_txCache"; String boxNameSetCache({required Coin coin}) => diff --git a/lib/main.dart b/lib/main.dart index 5aeb89508..54d4b2332 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -29,6 +29,7 @@ import 'package:stackwallet/pages/loading_view.dart'; import 'package:stackwallet/pages/pinpad_views/create_pin_view.dart'; import 'package:stackwallet/pages/pinpad_views/lock_screen_view.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/restore_from_encrypted_string_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; import 'package:stackwallet/providers/exchange/available_currencies_state_provider.dart'; import 'package:stackwallet/providers/exchange/available_floating_rate_pairs_state_provider.dart'; import 'package:stackwallet/providers/exchange/change_now_provider.dart'; @@ -49,13 +50,16 @@ import 'package:stackwallet/services/notifications_api.dart'; import 'package:stackwallet/services/notifications_service.dart'; import 'package:stackwallet/services/trade_service.dart'; import 'package:stackwallet/services/wallets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/db_version_migration.dart'; import 'package:stackwallet/utilities/enums/backup_frequency_type.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/prefs.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/color_theme.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; +import 'package:window_size/window_size.dart'; final openedFromSWBFileStringStateProvider = StateProvider((ref) => null); @@ -65,6 +69,13 @@ final openedFromSWBFileStringStateProvider = // miscellaneous box for later use void main() async { WidgetsBinding widgetsBinding = WidgetsFlutterBinding.ensureInitialized(); + + if (Util.isDesktop) { + setWindowTitle('Stack Wallet'); + setWindowMinSize(const Size(1200, 900)); + setWindowMaxSize(Size.infinite); + } + Directory appDirectory = (await getApplicationDocumentsDirectory()); if (Platform.isIOS) { appDirectory = (await getLibraryDirectory()); @@ -130,6 +141,19 @@ void main() async { monero.onStartup(); + await Hive.openBox(DB.boxNameTheme); + final colorScheme = DB.instance + .get(boxName: DB.boxNameTheme, key: "colorScheme") as String?; + + switch (colorScheme) { + case "dark": + StackTheme.instance.setTheme(ThemeType.dark); + break; + case "light": + default: + StackTheme.instance.setTheme(ThemeType.light); + } + // SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, // overlays: [SystemUiOverlay.bottom]); await NotificationApi.init(); @@ -497,11 +521,16 @@ class _MaterialAppWithThemeState extends ConsumerState title: 'Stack Wallet', onGenerateRoute: RouteGenerator.generateRoute, theme: ThemeData( - highlightColor: CFColors.splashLight, + highlightColor: StackTheme.instance.color.highlight, brightness: Brightness.light, fontFamily: GoogleFonts.inter().fontFamily, + unselectedWidgetColor: + StackTheme.instance.color.radioButtonBorderDisabled, textTheme: GoogleFonts.interTextTheme().copyWith( button: STextStyles.button, + subtitle1: STextStyles.field.copyWith( + color: StackTheme.instance.color.textDark, + ), ), radioTheme: const RadioThemeData( splashRadius: 0, @@ -509,18 +538,20 @@ class _MaterialAppWithThemeState extends ConsumerState ), // splashFactory: NoSplash.splashFactory, splashColor: Colors.transparent, - buttonTheme: const ButtonThemeData( - splashColor: CFColors.splashMed, + buttonTheme: ButtonThemeData( + splashColor: StackTheme.instance.color.splash, ), textButtonTheme: TextButtonThemeData( style: ButtonStyle( // splashFactory: NoSplash.splashFactory, - overlayColor: MaterialStateProperty.all(CFColors.splashMed), + overlayColor: + MaterialStateProperty.all(StackTheme.instance.color.splash), minimumSize: MaterialStateProperty.all(const Size(46, 46)), textStyle: MaterialStateProperty.all(STextStyles.button), - foregroundColor: MaterialStateProperty.all(CFColors.white), - backgroundColor: - MaterialStateProperty.all(CFColors.buttonGray), + foregroundColor: MaterialStateProperty.all( + StackTheme.instance.color.buttonTextSecondary), + backgroundColor: MaterialStateProperty.all( + StackTheme.instance.color.buttonBackSecondary), shape: MaterialStateProperty.all( RoundedRectangleBorder( // 1000 to be relatively sure it keeps its pill shape @@ -529,8 +560,9 @@ class _MaterialAppWithThemeState extends ConsumerState ), ), ), - primaryColor: CFColors.stackAccent, - primarySwatch: CFColors.createMaterialColor(CFColors.stackAccent), + primaryColor: StackTheme.instance.color.accentColorDark, + primarySwatch: + Util.createMaterialColor(StackTheme.instance.color.accentColorDark), checkboxTheme: CheckboxThemeData( splashRadius: 0, shape: RoundedRectangleBorder( @@ -540,28 +572,28 @@ class _MaterialAppWithThemeState extends ConsumerState checkColor: MaterialStateColor.resolveWith( (state) { if (state.contains(MaterialState.selected)) { - return CFColors.white; + return StackTheme.instance.color.checkboxIconChecked; } - return CFColors.link2; + return StackTheme.instance.color.checkboxBGChecked; }, ), fillColor: MaterialStateColor.resolveWith( (states) { if (states.contains(MaterialState.selected)) { - return CFColors.link2; + return StackTheme.instance.color.checkboxBGChecked; } - return CFColors.disabledButton; + return StackTheme.instance.color.checkboxBorderEmpty; }, ), ), - appBarTheme: const AppBarTheme( + appBarTheme: AppBarTheme( centerTitle: false, - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, elevation: 0, ), inputDecorationTheme: InputDecorationTheme( - focusColor: CFColors.fieldGray, - fillColor: CFColors.fieldGray, + focusColor: StackTheme.instance.color.textFieldDefaultBG, + fillColor: StackTheme.instance.color.textFieldDefaultBG, filled: true, contentPadding: const EdgeInsets.symmetric( vertical: 6, @@ -569,11 +601,16 @@ class _MaterialAppWithThemeState extends ConsumerState ), labelStyle: STextStyles.fieldLabel, hintStyle: STextStyles.fieldLabel, - enabledBorder: _buildOutlineInputBorder(CFColors.fieldGray), - focusedBorder: _buildOutlineInputBorder(CFColors.fieldGray), - errorBorder: _buildOutlineInputBorder(CFColors.fieldGray), - disabledBorder: _buildOutlineInputBorder(CFColors.fieldGray), - focusedErrorBorder: _buildOutlineInputBorder(CFColors.fieldGray), + enabledBorder: _buildOutlineInputBorder( + StackTheme.instance.color.textFieldDefaultBG), + focusedBorder: _buildOutlineInputBorder( + StackTheme.instance.color.textFieldDefaultBG), + errorBorder: _buildOutlineInputBorder( + StackTheme.instance.color.textFieldDefaultBG), + disabledBorder: _buildOutlineInputBorder( + StackTheme.instance.color.textFieldDefaultBG), + focusedErrorBorder: _buildOutlineInputBorder( + StackTheme.instance.color.textFieldDefaultBG), ), ), home: FutureBuilder( @@ -595,6 +632,14 @@ class _MaterialAppWithThemeState extends ConsumerState ref.read(prefsChangeNotifierProvider).startupWalletId; } + // TODO proper desktop auth view + if (Util.isDesktop) { + Future.delayed(Duration.zero).then((value) => + Navigator.of(context).pushNamedAndRemoveUntil( + DesktopHomeView.routeName, (route) => false)); + return Container(); + } + return LockscreenView( isInitialAppLogin: true, routeOnSuccess: HomeView.routeName, diff --git a/lib/notifications/notification_card.dart b/lib/notifications/notification_card.dart index 2047169db..4c1bdf91c 100644 --- a/lib/notifications/notification_card.dart +++ b/lib/notifications/notification_card.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/models/notification_model.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -42,7 +42,7 @@ class NotificationCard extends StatelessWidget { ), child: SvgPicture.asset( notification.iconAssetName, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 24, height: 24, ), @@ -83,7 +83,7 @@ class NotificationCard extends StatelessWidget { if (notification.read) Positioned.fill( child: RoundedContainer( - color: CFColors.almostWhite.withOpacity(0.5), + color: StackTheme.instance.color.background.withOpacity(0.5), ), ), ], diff --git a/lib/notifications/show_flush_bar.dart b/lib/notifications/show_flush_bar.dart index b250302bd..569cf8ea9 100644 --- a/lib/notifications/show_flush_bar.dart +++ b/lib/notifications/show_flush_bar.dart @@ -2,9 +2,9 @@ import 'package:another_flushbar/flushbar.dart'; import 'package:another_flushbar/flushbar_route.dart' as flushRoute; import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; Future showFloatingFlushBar({ required FlushBarType type, @@ -19,16 +19,16 @@ Future showFloatingFlushBar({ Color fg; switch (type) { case FlushBarType.success: - fg = CFColors.notificationGreenForeground; - bg = CFColors.notificationGreenBackground; + fg = StackTheme.instance.color.snackBarTextSuccess; + bg = StackTheme.instance.color.snackBarBackSuccess; break; case FlushBarType.info: - fg = CFColors.notificationBlueForeground; - bg = CFColors.notificationBlueBackground; + fg = StackTheme.instance.color.snackBarTextInfo; + bg = StackTheme.instance.color.snackBarBackInfo; break; case FlushBarType.warning: - fg = CFColors.notificationRedForeground; - bg = CFColors.notificationRedBackground; + fg = StackTheme.instance.color.snackBarTextError; + bg = StackTheme.instance.color.snackBarBackError; break; } final bar = Flushbar( @@ -53,6 +53,7 @@ Future showFloatingFlushBar({ Constants.size.circularBorderRadius, ), margin: const EdgeInsets.all(20), + maxWidth: 550, ); final _route = flushRoute.showFlushbar( diff --git a/lib/pages/add_wallet_views/add_wallet_view/add_wallet_view.dart b/lib/pages/add_wallet_views/add_wallet_view/add_wallet_view.dart index 45180c842..ac8eae5eb 100644 --- a/lib/pages/add_wallet_views/add_wallet_view/add_wallet_view.dart +++ b/lib/pages/add_wallet_views/add_wallet_view/add_wallet_view.dart @@ -1,85 +1,220 @@ import 'package:flutter/material.dart'; -import 'package:flutter_riverpod/flutter_riverpod.dart'; -import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/add_wallet_text.dart'; +import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/mobile_coin_list.dart'; import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/next_button.dart'; -import 'package:stackwallet/providers/global/prefs_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/searchable_coin_list.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; +import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; +import 'package:stackwallet/widgets/rounded_white_container.dart'; +import 'package:stackwallet/widgets/stack_text_field.dart'; +import 'package:stackwallet/widgets/textfield_icon_button.dart'; -class AddWalletView extends StatelessWidget { +class AddWalletView extends StatefulWidget { const AddWalletView({Key? key}) : super(key: key); static const routeName = "/addWallet"; @override - Widget build(BuildContext context) { - List coins = [...Coin.values]; - coins.remove(Coin.firoTestNet); - return Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () { - Navigator.of(context).pop(); - }, - ), - ), - body: Container( - color: CFColors.almostWhite, - child: Padding( - padding: const EdgeInsets.all(16), - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - Text( - "Add wallet", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, - ), - const SizedBox( - height: 16, - ), - Text( - "Select wallet currency", - textAlign: TextAlign.center, - style: STextStyles.subtitle, - ), - const SizedBox( - height: 16, - ), - Expanded( - child: Consumer( - builder: (_, ref, __) { - bool showTestNet = ref.watch( - prefsChangeNotifierProvider - .select((value) => value.showTestNetCoins), - ); + State createState() => _AddWalletViewState(); +} - return ListView.builder( - itemCount: showTestNet - ? coins.length - : coins.length - (kTestNetCoinCount), - itemBuilder: (ctx, index) { - return Padding( - padding: const EdgeInsets.all(4), - child: CoinSelectItem( - coin: coins[index], +class _AddWalletViewState extends State { + late final TextEditingController _searchFieldController; + late final FocusNode _searchFocusNode; + + String _searchTerm = ""; + + final List coins = [...Coin.values]; + + @override + void initState() { + _searchFieldController = TextEditingController(); + _searchFocusNode = FocusNode(); + coins.remove(Coin.firoTestNet); + super.initState(); + } + + @override + void dispose() { + _searchFieldController.dispose(); + _searchFocusNode.dispose(); + super.dispose(); + } + + @override + Widget build(BuildContext context) { + debugPrint("BUILD: $runtimeType"); + + if (Util.isDesktop) { + return DesktopScaffold( + appBar: const DesktopAppBar( + isCompactHeight: false, + leading: AppBarBackButton(), + trailing: ExitToMyStackButton(), + ), + body: Column( + children: [ + const AddWalletText( + isDesktop: true, + ), + const SizedBox( + height: 16, + ), + Expanded( + child: SizedBox( + width: 480, + child: RoundedWhiteContainer( + radiusMultiplier: 2, + padding: const EdgeInsets.only( + left: 16, + top: 16, + right: 16, + bottom: 0, + ), + child: Column( + children: [ + Padding( + padding: const EdgeInsets.all(4.0), + child: ClipRRect( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, ), - ); - }, - ); - }, + child: TextField( + controller: _searchFieldController, + focusNode: _searchFocusNode, + onChanged: (value) { + setState(() { + _searchTerm = value; + }); + }, + style: STextStyles.desktopTextMedium.copyWith( + height: 2, + ), + decoration: standardInputDecoration( + "Search", + _searchFocusNode, + ).copyWith( + contentPadding: const EdgeInsets.symmetric( + vertical: 10, + ), + prefixIcon: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 16, + // vertical: 20, + ), + child: SvgPicture.asset( + Assets.svg.search, + width: 24, + height: 24, + color: StackTheme.instance.color + .textFieldDefaultSearchIconLeft, + ), + ), + suffixIcon: _searchFieldController.text.isNotEmpty + ? Padding( + padding: const EdgeInsets.only(right: 10), + child: UnconstrainedBox( + child: Row( + children: [ + TextFieldIconButton( + child: const XIcon( + width: 24, + height: 24, + ), + onTap: () async { + setState(() { + _searchFieldController.text = + ""; + _searchTerm = ""; + }); + }, + ), + ], + ), + ), + ) + : null, + ), + ), + ), + ), + Expanded( + child: SearchableCoinList( + coins: coins, + isDesktop: true, + searchTerm: _searchTerm, + ), + ), + ], + ), ), ), - const SizedBox( - height: 16, + ), + const SizedBox( + height: 16, + ), + const SizedBox( + height: 70, + width: 480, + child: AddWalletNextButton( + isDesktop: true, ), - const AddWalletNextButton(), - ], + ), + const SizedBox( + height: 32, + ), + ], + ), + ); + } else { + return Scaffold( + appBar: AppBar( + leading: AppBarBackButton( + onPressed: () { + Navigator.of(context).pop(); + }, ), ), - ), - ); + body: Container( + color: StackTheme.instance.color.background, + child: Padding( + padding: const EdgeInsets.all(16), + child: Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + const AddWalletText( + isDesktop: false, + ), + const SizedBox( + height: 16, + ), + Expanded( + child: MobileCoinList( + coins: coins, + isDesktop: false, + ), + ), + const SizedBox( + height: 16, + ), + const AddWalletNextButton( + isDesktop: false, + ), + ], + ), + ), + ), + ); + } } } diff --git a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/add_wallet_text.dart b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/add_wallet_text.dart new file mode 100644 index 000000000..fb9f74135 --- /dev/null +++ b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/add_wallet_text.dart @@ -0,0 +1,31 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; + +class AddWalletText extends StatelessWidget { + const AddWalletText({Key? key, required this.isDesktop}) : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Text( + "Add wallet", + textAlign: TextAlign.center, + style: isDesktop ? STextStyles.desktopH2 : STextStyles.pageTitleH1, + ), + const SizedBox( + height: 16, + ), + Text( + "Select wallet currency", + textAlign: TextAlign.center, + style: + isDesktop ? STextStyles.desktopSubtitleH2 : STextStyles.subtitle, + ), + ], + ); + } +} diff --git a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart index 8ab1a4ffe..0f9e8bf0a 100644 --- a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart +++ b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart @@ -3,10 +3,11 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; class CoinSelectItem extends ConsumerWidget { const CoinSelectItem({ @@ -20,40 +21,69 @@ class CoinSelectItem extends ConsumerWidget { Widget build(BuildContext context, WidgetRef ref) { debugPrint("BUILD: CoinSelectItem for ${coin.name}"); final selectedCoin = ref.watch(addWalletSelectedCoinStateProvider); + + final isDesktop = Util.isDesktop; + return Container( decoration: BoxDecoration( // color: selectedCoin == coin ? CFColors.selection : CFColors.white, - color: selectedCoin == coin ? CFColors.selected2 : CFColors.white, + color: selectedCoin == coin + ? StackTheme.instance.color.textFieldActiveBG + : StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular(Constants.size.circularBorderRadius), ), child: MaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, key: Key("coinSelectItemButtonKey_${coin.name}"), - padding: const EdgeInsets.all(12), + padding: isDesktop + ? const EdgeInsets.only(left: 24) + : const EdgeInsets.all(12), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(Constants.size.circularBorderRadius), ), - child: Row( - children: [ - SvgPicture.asset( - Assets.svg.iconFor(coin: coin), - width: 26, - height: 26, - ), - const SizedBox( - width: 10, - ), - Text( - coin.prettyName, - style: STextStyles.subtitle.copyWith( - fontWeight: FontWeight.w600, - fontSize: 14, + child: ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + ), + child: Row( + children: [ + SvgPicture.asset( + Assets.svg.iconFor(coin: coin), + width: 26, + height: 26, ), - ), - ], + SizedBox( + width: isDesktop ? 12 : 10, + ), + Text( + coin.prettyName, + style: isDesktop + ? STextStyles.desktopTextMedium + : STextStyles.subtitle.copyWith( + fontWeight: FontWeight.w600, + fontSize: 14, + ), + ), + if (isDesktop && selectedCoin == coin) const Spacer(), + if (isDesktop && selectedCoin == coin) + Padding( + padding: const EdgeInsets.only( + right: 18, + ), + child: SizedBox( + width: 24, + height: 24, + child: SvgPicture.asset( + Assets.svg.check, + color: StackTheme.instance.color.accentColorDark, + ), + ), + ), + ], + ), ), onPressed: () => ref.read(addWalletSelectedCoinStateProvider.state).state = coin, diff --git a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/mobile_coin_list.dart b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/mobile_coin_list.dart new file mode 100644 index 000000000..1f36f3b65 --- /dev/null +++ b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/mobile_coin_list.dart @@ -0,0 +1,40 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart'; +import 'package:stackwallet/providers/global/prefs_provider.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; + +class MobileCoinList extends StatelessWidget { + const MobileCoinList({ + Key? key, + required this.coins, + required this.isDesktop, + }) : super(key: key); + + final List coins; + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Consumer( + builder: (_, ref, __) { + bool showTestNet = ref.watch( + prefsChangeNotifierProvider.select((value) => value.showTestNetCoins), + ); + + return ListView.builder( + itemCount: + showTestNet ? coins.length : coins.length - (kTestNetCoinCount), + itemBuilder: (ctx, index) { + return Padding( + padding: const EdgeInsets.all(4), + child: CoinSelectItem( + coin: coins[index], + ), + ); + }, + ); + }, + ); + } +} diff --git a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/next_button.dart b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/next_button.dart index 61a0ef7b1..7f79c2da4 100644 --- a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/next_button.dart +++ b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/next_button.dart @@ -2,19 +2,27 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view/create_or_restore_wallet_view.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class AddWalletNextButton extends ConsumerWidget { - const AddWalletNextButton({Key? key}) : super(key: key); + const AddWalletNextButton({ + Key? key, + required this.isDesktop, + }) : super(key: key); + + final bool isDesktop; @override Widget build(BuildContext context, WidgetRef ref) { debugPrint("BUILD: NextButton"); final selectedCoin = ref.watch(addWalletSelectedCoinStateProvider.state).state; + + final enabled = selectedCoin != null; + return TextButton( - onPressed: selectedCoin == null + onPressed: !enabled ? null : () { final selectedCoin = @@ -25,22 +33,16 @@ class AddWalletNextButton extends ConsumerWidget { arguments: selectedCoin, ); }, - style: selectedCoin == null - ? Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent.withOpacity( - 0.25, - ), - ), - ) - : Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: enabled + ? StackTheme.instance.getPrimaryEnabledButtonColor(context) + : StackTheme.instance.getPrimaryDisabledButtonColor(context), child: Text( "Next", - style: STextStyles.button, + style: isDesktop + ? enabled + ? STextStyles.desktopButtonEnabled + : STextStyles.desktopButtonDisabled + : STextStyles.button, ), ); } diff --git a/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/searchable_coin_list.dart b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/searchable_coin_list.dart new file mode 100644 index 000000000..fb443b915 --- /dev/null +++ b/lib/pages/add_wallet_views/add_wallet_view/sub_widgets/searchable_coin_list.dart @@ -0,0 +1,57 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/sub_widgets/coin_select_item.dart'; +import 'package:stackwallet/providers/global/prefs_provider.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; + +class SearchableCoinList extends ConsumerWidget { + const SearchableCoinList({ + Key? key, + required this.coins, + required this.isDesktop, + required this.searchTerm, + }) : super(key: key); + + final List coins; + final bool isDesktop; + final String searchTerm; + + List filterCoins(String text, bool showTestNetCoins) { + final _coins = [...coins]; + if (text.isNotEmpty) { + final lowercaseTerm = text.toLowerCase(); + _coins.retainWhere((e) => + e.ticker.toLowerCase().contains(lowercaseTerm) || + e.prettyName.toLowerCase().contains(lowercaseTerm) || + e.name.toLowerCase().contains(lowercaseTerm)); + } + if (!showTestNetCoins) { + _coins.removeWhere((e) => e.name.endsWith("TestNet")); + } + // remove firo testnet regardless + _coins.remove(Coin.firoTestNet); + + return _coins; + } + + @override + Widget build(BuildContext context, WidgetRef ref) { + bool showTestNet = ref.watch( + prefsChangeNotifierProvider.select((value) => value.showTestNetCoins), + ); + + final _coins = filterCoins(searchTerm, showTestNet); + + return ListView.builder( + itemCount: _coins.length, + itemBuilder: (ctx, index) { + return Padding( + padding: const EdgeInsets.all(4), + child: CoinSelectItem( + coin: _coins[index], + ), + ); + }, + ); + } +} diff --git a/lib/pages/add_wallet_views/create_or_restore_wallet_view/create_or_restore_wallet_view.dart b/lib/pages/add_wallet_views/create_or_restore_wallet_view/create_or_restore_wallet_view.dart index 50c91a514..3a3919e44 100644 --- a/lib/pages/add_wallet_views/create_or_restore_wallet_view/create_or_restore_wallet_view.dart +++ b/lib/pages/add_wallet_views/create_or_restore_wallet_view/create_or_restore_wallet_view.dart @@ -1,12 +1,15 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart'; -import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; -import 'package:stackwallet/utilities/enums/add_wallet_type_enum.dart'; +import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/coin_image.dart'; +import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_subtitle.dart'; +import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_title.dart'; +import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_wallet_button_group.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; -import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; -import 'package:tuple/tuple.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; class CreateOrRestoreWalletView extends StatelessWidget { const CreateOrRestoreWalletView({ @@ -22,97 +25,100 @@ class CreateOrRestoreWalletView extends StatelessWidget { Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); - return Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () { - Navigator.of(context).pop(); - }, + final isDesktop = Util.isDesktop; + + if (isDesktop) { + return DesktopScaffold( + appBar: const DesktopAppBar( + isCompactHeight: false, + leading: AppBarBackButton(), + trailing: ExitToMyStackButton(), ), - ), - body: Container( - color: CFColors.almostWhite, - child: Padding( - padding: const EdgeInsets.all(16), + body: SizedBox( + width: 480, child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, + mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.center, children: [ - Padding( - padding: const EdgeInsets.all(31), - child: Image( - image: AssetImage( - Assets.png.imageFor(coin: coin), - ), - width: MediaQuery.of(context).size.width / 3, - ), - ), - const Spacer( - flex: 2, - ), - Text( - "Add ${coin.prettyName} wallet", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, + CreateRestoreWalletTitle( + coin: coin, + isDesktop: isDesktop, ), const SizedBox( - height: 8, + height: 16, ), - Text( - "Create a new wallet or restore an existing wallet from seed.", - textAlign: TextAlign.center, - style: STextStyles.subtitle), - const Spacer( - flex: 5, - ), - TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), - onPressed: () { - Navigator.of(context).pushNamed( - NameYourWalletView.routeName, - arguments: Tuple2( - AddWalletType.New, - coin, - ), - ); - }, - child: Text( - "Create new wallet", - style: STextStyles.button, + SizedBox( + width: 324, + child: CreateRestoreWalletSubTitle( + isDesktop: isDesktop, ), ), const SizedBox( - height: 12, + height: 32, ), - TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent.withOpacity(0.25), - ), - ), - onPressed: () { - Navigator.of(context).pushNamed( - NameYourWalletView.routeName, - arguments: Tuple2( - AddWalletType.Restore, - coin, - ), - ); - }, - child: Text( - "Restore wallet", - style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), - ), + CoinImage( + coin: coin, + isDesktop: isDesktop, + ), + const SizedBox( + height: 32, + ), + CreateWalletButtonGroup( + coin: coin, + isDesktop: isDesktop, ), ], ), ), - ), - ); + ); + } else { + return Scaffold( + appBar: AppBar( + leading: AppBarBackButton( + onPressed: () { + Navigator.of(context).pop(); + }, + ), + ), + body: Container( + color: StackTheme.instance.color.background, + child: Padding( + padding: const EdgeInsets.all(16), + child: Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Padding( + padding: const EdgeInsets.all(31), + child: CoinImage( + coin: coin, + isDesktop: isDesktop, + ), + ), + const Spacer( + flex: 2, + ), + CreateRestoreWalletTitle( + coin: coin, + isDesktop: isDesktop, + ), + const SizedBox( + height: 8, + ), + CreateRestoreWalletSubTitle( + isDesktop: isDesktop, + ), + const Spacer( + flex: 5, + ), + CreateWalletButtonGroup( + coin: coin, + isDesktop: isDesktop, + ), + ], + ), + ), + ), + ); + } } } diff --git a/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/coin_image.dart b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/coin_image.dart new file mode 100644 index 000000000..c96cc14ad --- /dev/null +++ b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/coin_image.dart @@ -0,0 +1,24 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; + +class CoinImage extends StatelessWidget { + const CoinImage({ + Key? key, + required this.coin, + required this.isDesktop, + }) : super(key: key); + + final Coin coin; + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Image( + image: AssetImage( + Assets.png.imageFor(coin: coin), + ), + width: isDesktop ? 324 : MediaQuery.of(context).size.width / 3, + ); + } +} diff --git a/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_subtitle.dart b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_subtitle.dart new file mode 100644 index 000000000..75e7cec0c --- /dev/null +++ b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_subtitle.dart @@ -0,0 +1,20 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; + +class CreateRestoreWalletSubTitle extends StatelessWidget { + const CreateRestoreWalletSubTitle({ + Key? key, + required this.isDesktop, + }) : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Text( + "Create a new wallet or restore an existing wallet from seed.", + textAlign: TextAlign.center, + style: isDesktop ? STextStyles.desktopSubtitleH2 : STextStyles.subtitle, + ); + } +} diff --git a/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_title.dart b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_title.dart new file mode 100644 index 000000000..3769d08eb --- /dev/null +++ b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_or_restore_wallet_title.dart @@ -0,0 +1,23 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; + +class CreateRestoreWalletTitle extends StatelessWidget { + const CreateRestoreWalletTitle({ + Key? key, + required this.coin, + required this.isDesktop, + }) : super(key: key); + + final Coin coin; + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Text( + "Add ${coin.prettyName} wallet", + textAlign: TextAlign.center, + style: isDesktop ? STextStyles.desktopH2 : STextStyles.pageTitleH1, + ); + } +} diff --git a/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_wallet_button_group.dart b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_wallet_button_group.dart new file mode 100644 index 000000000..f8efe8166 --- /dev/null +++ b/lib/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/create_wallet_button_group.dart @@ -0,0 +1,80 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart'; +import 'package:stackwallet/utilities/enums/add_wallet_type_enum.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:tuple/tuple.dart'; + +class CreateWalletButtonGroup extends StatelessWidget { + const CreateWalletButtonGroup({ + Key? key, + required this.coin, + required this.isDesktop, + }) : super(key: key); + + final Coin coin; + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Column( + crossAxisAlignment: + isDesktop ? CrossAxisAlignment.center : CrossAxisAlignment.stretch, + children: [ + ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + minWidth: isDesktop ? 480 : 0, + ), + child: TextButton( + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), + onPressed: () { + Navigator.of(context).pushNamed( + NameYourWalletView.routeName, + arguments: Tuple2( + AddWalletType.New, + coin, + ), + ); + }, + child: Text( + "Create new wallet", + style: isDesktop + ? STextStyles.desktopButtonEnabled + : STextStyles.button, + ), + ), + ), + SizedBox( + height: isDesktop ? 16 : 12, + ), + ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + minWidth: isDesktop ? 480 : 0, + ), + child: TextButton( + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), + onPressed: () { + Navigator.of(context).pushNamed( + NameYourWalletView.routeName, + arguments: Tuple2( + AddWalletType.Restore, + coin, + ), + ); + }, + child: Text( + "Restore wallet", + style: isDesktop + ? STextStyles.desktopButtonSecondaryEnabled + : STextStyles.button.copyWith( + color: StackTheme.instance.color.accentColorDark), + ), + ), + ), + ], + ); + } +} diff --git a/lib/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart b/lib/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart index 5338c8461..e170f2fde 100644 --- a/lib/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart +++ b/lib/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart @@ -1,19 +1,26 @@ +import 'dart:async'; + import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart'; -import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart'; import 'package:stackwallet/providers/global/wallets_service_provider.dart'; import 'package:stackwallet/providers/ui/verify_recovery_phrase/mnemonic_word_count_state_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/add_wallet_type_enum.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/name_generator.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; import 'package:stackwallet/widgets/icon_widgets/dice_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -21,14 +28,6 @@ import 'package:stackwallet/widgets/stack_text_field.dart'; import 'package:stackwallet/widgets/textfield_icon_button.dart'; import 'package:tuple/tuple.dart'; -// TODO replace with real list and move out of this file -const kWalletNameWordList = [ - "Bubby", - "Baby", - "Bobby", - "Booby", -]; - class NameYourWalletView extends ConsumerStatefulWidget { const NameYourWalletView({ Key? key, @@ -59,6 +58,8 @@ class _NameYourWalletViewState extends ConsumerState { Set namesToExclude = {}; late final NameGenerator generator; + late final bool isDesktop; + Future _generateRandomWalletName() async { final name = generator.generate(namesToExclude: namesToExclude); namesToExclude.add(name); @@ -67,6 +68,8 @@ class _NameYourWalletViewState extends ConsumerState { @override void initState() { + isDesktop = Util.isDesktop; + ref.read(walletsServiceChangeNotifierProvider).walletNames.then( (value) => namesToExclude.addAll( value.values.map((e) => e.name), @@ -92,231 +95,261 @@ class _NameYourWalletViewState extends ConsumerState { Widget build(BuildContext context) { debugPrint( "BUILD: NameYourWalletView with ${coin.name} ${addWalletType.name}"); - return Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () { - if (textFieldFocusNode.hasFocus) { - textFieldFocusNode.unfocus(); - Future.delayed(const Duration(milliseconds: 100)) - .then((value) => Navigator.of(context).pop()); - } else { - if (mounted) { - Navigator.of(context).pop(); - } - } - }, + + if (isDesktop) { + return DesktopScaffold( + appBar: const DesktopAppBar( + leading: AppBarBackButton(), + trailing: ExitToMyStackButton(), + isCompactHeight: false, ), - ), - body: Container( - color: CFColors.almostWhite, - child: Padding( - padding: const EdgeInsets.all(16), - child: LayoutBuilder( - builder: (ctx, constraints) { - return SingleChildScrollView( - child: ConstrainedBox( - constraints: BoxConstraints(minHeight: constraints.maxHeight), - child: IntrinsicHeight( - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, + body: SizedBox( + width: 480, + child: _content(), + ), + ); + } else { + return Scaffold( + appBar: AppBar( + leading: AppBarBackButton( + onPressed: () { + if (textFieldFocusNode.hasFocus) { + textFieldFocusNode.unfocus(); + Future.delayed(const Duration(milliseconds: 100)) + .then((value) => Navigator.of(context).pop()); + } else { + if (mounted) { + Navigator.of(context).pop(); + } + } + }, + ), + ), + body: Container( + color: StackTheme.instance.color.background, + child: Padding( + padding: const EdgeInsets.all(16), + child: LayoutBuilder( + builder: (ctx, constraints) { + return SingleChildScrollView( + child: ConstrainedBox( + constraints: + BoxConstraints(minHeight: constraints.maxHeight), + child: IntrinsicHeight( + child: _content(), + ), + ), + ); + }, + ), + ), + ), + ); + } + } + + Widget _content() => Column( + crossAxisAlignment: + isDesktop ? CrossAxisAlignment.center : CrossAxisAlignment.stretch, + children: [ + if (!isDesktop) + const Spacer( + flex: 1, + ), + if (!isDesktop) + Image( + image: AssetImage( + Assets.png.imageFor(coin: coin), + ), + height: 100, + ), + SizedBox( + height: isDesktop ? 24 : 16, + ), + Text( + "Name your ${coin.prettyName} wallet", + textAlign: TextAlign.center, + style: isDesktop ? STextStyles.desktopH2 : STextStyles.pageTitleH1, + ), + SizedBox( + height: isDesktop ? 16 : 8, + ), + Text( + "Enter a label for your wallet (e.g. Savings)", + textAlign: TextAlign.center, + style: isDesktop + ? STextStyles.desktopSubtitleH2 + : STextStyles.subtitle, + ), + SizedBox( + height: isDesktop ? 40 : 16, + ), + ClipRRect( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + child: TextField( + onChanged: (string) { + if (string.isEmpty) { + if (_nextEnabled) { + setState(() { + _nextEnabled = false; + _showDiceIcon = true; + }); + } + } else { + if (!_nextEnabled) { + setState(() { + _nextEnabled = true; + _showDiceIcon = false; + }); + } + } + }, + focusNode: textFieldFocusNode, + controller: textEditingController, + style: isDesktop + ? STextStyles.desktopTextMedium.copyWith( + height: 2, + ) + : STextStyles.field, + decoration: standardInputDecoration( + "Enter wallet name", + textFieldFocusNode, + ).copyWith( + suffixIcon: Padding( + padding: EdgeInsets.only(right: isDesktop ? 6 : 0), + child: UnconstrainedBox( + child: Row( children: [ - const Spacer( - flex: 1, - ), - Image( - image: AssetImage( - Assets.png.imageFor(coin: coin), - ), - height: 100, - ), - const SizedBox( - height: 16, - ), - Text( - "Name your ${coin.prettyName} wallet", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, - ), - const SizedBox( - height: 8, - ), - Text( - "Enter a label for your wallet (e.g. Savings)", - textAlign: TextAlign.center, - style: STextStyles.subtitle, - ), - const SizedBox( - height: 16, - ), - ClipRRect( - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius, - ), - child: TextField( - onChanged: (string) { - if (string.isEmpty) { - if (_nextEnabled) { - setState(() { - _nextEnabled = false; - _showDiceIcon = true; - }); - } - } else { - if (!_nextEnabled) { - setState(() { - _nextEnabled = true; - _showDiceIcon = false; - }); - } - } - }, - focusNode: textFieldFocusNode, - controller: textEditingController, - style: STextStyles.field, - decoration: standardInputDecoration( - "Enter wallet name", - textFieldFocusNode, - ).copyWith( - suffixIcon: Padding( - padding: const EdgeInsets.only(right: 0), - child: UnconstrainedBox( - child: Row( - children: [ - TextFieldIconButton( - key: const Key( - "genRandomWalletNameButtonKey"), - child: _showDiceIcon - ? const DiceIcon() - : const XIcon(), - onTap: () async { - if (_showDiceIcon) { - textEditingController.text = - await _generateRandomWalletName(); - setState(() { - _nextEnabled = true; - _showDiceIcon = false; - }); - } else { - textEditingController.text = ""; - setState(() { - _nextEnabled = false; - _showDiceIcon = true; - }); - } - }, - ) - ], - ), + TextFieldIconButton( + key: const Key("genRandomWalletNameButtonKey"), + child: _showDiceIcon + ? DiceIcon( + width: isDesktop ? 20 : 17, + height: isDesktop ? 20 : 17, + ) + : XIcon( + width: isDesktop ? 21 : 18, + height: isDesktop ? 21 : 18, ), - ), - ), - ), - ), - const SizedBox( - height: 8, - ), - RoundedWhiteContainer( - child: Center( - child: Text( - "Roll the dice to pick a random name.", - style: STextStyles.itemSubtitle, - ), - ), - ), - const Spacer( - flex: 4, - ), - TextButton( - onPressed: _nextEnabled - ? () async { - final walletsService = ref.read( - walletsServiceChangeNotifierProvider); - final name = textEditingController.text; - - if (await walletsService - .checkForDuplicate(name)) { - showFloatingFlushBar( - type: FlushBarType.warning, - message: "Wallet name already in use.", - iconAsset: Assets.svg.circleAlert, - context: context, - ); - } else { - // hide keyboard if has focus - if (FocusScope.of(context).hasFocus) { - FocusScope.of(context).unfocus(); - await Future.delayed( - const Duration(milliseconds: 50)); - } - - if (mounted) { - switch (widget.addWalletType) { - case AddWalletType.New: - Navigator.of(context).pushNamed( - NewWalletRecoveryPhraseWarningView - .routeName, - arguments: Tuple2( - name, - coin, - ), - ); - break; - case AddWalletType.Restore: - ref - .read( - mnemonicWordCountStateProvider - .state) - .state = Constants - .possibleLengthsForCoin(coin) - .first; - Navigator.of(context).pushNamed( - RestoreOptionsView.routeName, - arguments: Tuple2( - name, - coin, - ), - ); - break; - } - } - } - } - : null, - style: _nextEnabled - ? Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - )) - : Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent.withOpacity( - 0.25, - ), - ), - ), - child: Text( - "Next", - style: STextStyles.button, - ), - ), + onTap: () async { + if (_showDiceIcon) { + textEditingController.text = + await _generateRandomWalletName(); + setState(() { + _nextEnabled = true; + _showDiceIcon = false; + }); + } else { + textEditingController.text = ""; + setState(() { + _nextEnabled = false; + _showDiceIcon = true; + }); + } + }, + ) ], ), ), ), - ); - }, + ), + ), ), - ), - ), - ); - } + SizedBox( + height: isDesktop ? 16 : 8, + ), + RoundedWhiteContainer( + child: Center( + child: Text( + "Roll the dice to pick a random name.", + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ) + : STextStyles.itemSubtitle, + ), + ), + ), + if (!isDesktop) + const Spacer( + flex: 4, + ), + if (isDesktop) + const SizedBox( + height: 32, + ), + ConstrainedBox( + constraints: BoxConstraints( + minWidth: isDesktop ? 480 : 0, + minHeight: isDesktop ? 70 : 0, + ), + child: TextButton( + onPressed: _nextEnabled + ? () async { + final walletsService = + ref.read(walletsServiceChangeNotifierProvider); + final name = textEditingController.text; + + if (await walletsService.checkForDuplicate(name)) { + unawaited(showFloatingFlushBar( + type: FlushBarType.warning, + message: "Wallet name already in use.", + iconAsset: Assets.svg.circleAlert, + context: context, + )); + } else { + // hide keyboard if has focus + if (FocusScope.of(context).hasFocus) { + FocusScope.of(context).unfocus(); + await Future.delayed( + const Duration(milliseconds: 50)); + } + + if (mounted) { + switch (widget.addWalletType) { + case AddWalletType.New: + unawaited(Navigator.of(context).pushNamed( + NewWalletRecoveryPhraseWarningView.routeName, + arguments: Tuple2( + name, + coin, + ), + )); + break; + case AddWalletType.Restore: + ref + .read(mnemonicWordCountStateProvider.state) + .state = Constants.possibleLengthsForCoin( + coin) + .first; + unawaited(Navigator.of(context).pushNamed( + RestoreOptionsView.routeName, + arguments: Tuple2( + name, + coin, + ), + )); + break; + } + } + } + } + : null, + style: _nextEnabled + ? StackTheme.instance.getPrimaryEnabledButtonColor(context) + : StackTheme.instance.getPrimaryDisabledButtonColor(context), + child: Text( + "Next", + style: isDesktop + ? _nextEnabled + ? STextStyles.desktopButtonEnabled + : STextStyles.desktopButtonDisabled + : STextStyles.button, + ), + ), + ), + ], + ); } diff --git a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart index 7f12e8b6d..aefade548 100644 --- a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart +++ b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart @@ -1,3 +1,4 @@ +import 'dart:async'; import 'dart:math'; import 'package:flutter/material.dart'; @@ -8,15 +9,21 @@ import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart'; import 'package:stackwallet/pages/add_wallet_views/verify_recovery_phrase_view/verify_recovery_phrase_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; import 'package:tuple/tuple.dart'; class NewWalletRecoveryPhraseView extends ConsumerStatefulWidget { @@ -46,12 +53,14 @@ class _NewWalletRecoveryPhraseViewState late Manager _manager; late List _mnemonic; late ClipboardInterface _clipboardInterface; + late final bool isDesktop; @override void initState() { _manager = widget.manager; _mnemonic = widget.mnemonic; _clipboardInterface = widget.clipboardInterface; + isDesktop = Util.isDesktop; super.initState(); } @@ -67,144 +76,230 @@ class _NewWalletRecoveryPhraseViewState await _manager.exitCurrentWallet(); } + Future _copy() async { + final words = await _manager.mnemonic; + await _clipboardInterface.setData(ClipboardData(text: words.join(" "))); + unawaited(showFloatingFlushBar( + type: FlushBarType.info, + message: "Copied to clipboard", + iconAsset: Assets.svg.copy, + context: context, + )); + } + @override Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); return WillPopScope( - onWillPop: onWillPop, - child: Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () async { - await delete(); + onWillPop: onWillPop, + child: MasterScaffold( + isDesktop: isDesktop, + appBar: isDesktop + ? DesktopAppBar( + isCompactHeight: false, + leading: AppBarBackButton( + onPressed: () async { + await delete(); - if (mounted) { - Navigator.of(context).popUntil( - ModalRoute.withName( - NewWalletRecoveryPhraseWarningView.routeName, + if (mounted) { + Navigator.of(context).popUntil( + ModalRoute.withName( + NewWalletRecoveryPhraseWarningView.routeName, + ), + ); + } + // Navigator.of(context).pop(); + }, ), - ); - } - // Navigator.of(context).pop(); - }, - ), - actions: [ - Padding( - padding: const EdgeInsets.all(10), - child: AspectRatio( - aspectRatio: 1, - child: AppBarIconButton( - color: CFColors.almostWhite, - shadows: const [], - icon: SvgPicture.asset( - Assets.svg.copy, - width: 24, - height: 24, + trailing: ExitToMyStackButton( + onPressed: () async { + await delete(); + if (mounted) { + Navigator.of(context).popUntil( + ModalRoute.withName(DesktopHomeView.routeName), + ); + } + }, ), - onPressed: () async { - final words = await _manager.mnemonic; - await _clipboardInterface - .setData(ClipboardData(text: words.join(" "))); - showFloatingFlushBar( - type: FlushBarType.info, - message: "Copied to clipboard", - iconAsset: Assets.svg.copy, - context: context, - ); - }, - ), - ), - ), - ], - ), - body: Container( - color: CFColors.almostWhite, - child: Padding( - padding: const EdgeInsets.all(16), - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - const SizedBox( - height: 4, - ), - Text( - _manager.walletName, - textAlign: TextAlign.center, - style: STextStyles.label.copyWith( - fontSize: 12, - ), - ), - const SizedBox( - height: 4, - ), - Text( - "Recovery Phrase", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, - ), - const SizedBox( - height: 16, - ), - Container( - decoration: BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius), - ), - child: Padding( - padding: const EdgeInsets.all(12), - child: Text( - "Please write down your recovery phrase in the correct order and save it to keep your funds secure. You will also be asked to verify the words on the next screen.", - style: STextStyles.label.copyWith( - color: CFColors.stackAccent, - ), - ), - ), - ), - const SizedBox( - height: 8, - ), - Expanded( - child: SingleChildScrollView( - child: MnemonicTable( - words: _mnemonic, - ), - ), - ), - const SizedBox( - height: 16, - ), - TextButton( - onPressed: () async { - final int next = Random().nextInt(_mnemonic.length); - ref - .read(verifyMnemonicWordIndexStateProvider.state) - .update((state) => next); + ) + : AppBar( + leading: AppBarBackButton( + onPressed: () async { + await delete(); - ref - .read(verifyMnemonicCorrectWordStateProvider.state) - .update((state) => _mnemonic[next]); - - Navigator.of(context).pushNamed( - VerifyRecoveryPhraseView.routeName, - arguments: Tuple2(_manager, _mnemonic), - ); - }, - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, + if (mounted) { + Navigator.of(context).popUntil( + ModalRoute.withName( + NewWalletRecoveryPhraseWarningView.routeName, + ), + ); + } + }, + ), + actions: [ + Padding( + padding: const EdgeInsets.all(10), + child: AspectRatio( + aspectRatio: 1, + child: AppBarIconButton( + color: StackTheme.instance.color.background, + shadows: const [], + icon: SvgPicture.asset( + Assets.svg.copy, + width: 24, + height: 24, + color: StackTheme.instance.color.topNavIconPrimary, + ), + onPressed: () async { + await _copy(); + }, ), ), - child: Text( - "I saved my recovery phrase", - style: STextStyles.button, - ), + ), + ], ), - ], + body: Container( + color: StackTheme.instance.color.background, + width: isDesktop ? 600 : null, + child: Padding( + padding: isDesktop + ? const EdgeInsets.all(0) + : const EdgeInsets.all(16), + child: Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + if (!isDesktop) + const SizedBox( + height: 4, + ), + if (!isDesktop) + Text( + _manager.walletName, + textAlign: TextAlign.center, + style: STextStyles.label.copyWith( + fontSize: 12, + ), + ), + SizedBox( + height: isDesktop ? 24 : 4, + ), + Text( + "Recovery Phrase", + textAlign: TextAlign.center, + style: isDesktop + ? STextStyles.desktopH2 + : STextStyles.pageTitleH1, + ), + const SizedBox( + height: 16, + ), + Container( + decoration: BoxDecoration( + color: isDesktop + ? StackTheme.instance.color.background + : StackTheme.instance.color.popupBG, + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius), + ), + child: Padding( + padding: isDesktop + ? const EdgeInsets.all(0) + : const EdgeInsets.all(12), + child: Text( + "Please write down your recovery phrase in the correct order and save it to keep your funds secure. You will also be asked to verify the words on the next screen.", + textAlign: TextAlign.center, + style: isDesktop + ? STextStyles.desktopSubtitleH2 + : STextStyles.label.copyWith( + color: + StackTheme.instance.color.accentColorDark), + ), + ), + ), + SizedBox( + height: isDesktop ? 21 : 8, + ), + if (!isDesktop) + Expanded( + child: SingleChildScrollView( + child: MnemonicTable( + words: _mnemonic, + isDesktop: isDesktop, + ), + ), + ), + if (isDesktop) + MnemonicTable( + words: _mnemonic, + isDesktop: isDesktop, + ), + SizedBox( + height: isDesktop ? 24 : 16, + ), + if (isDesktop) + SizedBox( + height: 70, + child: TextButton( + onPressed: () async { + await _copy(); + }, + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + SvgPicture.asset( + Assets.svg.copy, + width: 20, + height: 20, + ), + const SizedBox( + width: 10, + ), + Text( + "Copy to clipboard", + style: STextStyles.desktopButtonSecondaryEnabled, + ) + ], + ), + ), + ), + if (isDesktop) + const SizedBox( + height: 16, + ), + ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + ), + child: TextButton( + onPressed: () async { + final int next = Random().nextInt(_mnemonic.length); + ref + .read(verifyMnemonicWordIndexStateProvider.state) + .update((state) => next); + + ref + .read(verifyMnemonicCorrectWordStateProvider.state) + .update((state) => _mnemonic[next]); + + unawaited(Navigator.of(context).pushNamed( + VerifyRecoveryPhraseView.routeName, + arguments: Tuple2(_manager, _mnemonic), + )); + }, + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), + child: Text( + "I saved my recovery phrase", + style: isDesktop + ? STextStyles.desktopButtonEnabled + : STextStyles.button, + ), + ), + ), + ], + ), ), ), - ), - ), - ); + )); } } diff --git a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table.dart b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table.dart index 9b33f5248..946f54d4a 100644 --- a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table.dart +++ b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table.dart @@ -1,19 +1,20 @@ -import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table_item.dart'; class MnemonicTable extends StatelessWidget { const MnemonicTable({ Key? key, required this.words, + required this.isDesktop, }) : super(key: key); final List words; - - static const wordsPerRow = 3; + final bool isDesktop; @override Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); + final wordsPerRow = isDesktop ? 4 : 3; final int rows = words.length ~/ wordsPerRow; @@ -26,51 +27,54 @@ class MnemonicTable extends StatelessWidget { children: [ for (int i = 1; i <= rows; i++) Padding( - padding: const EdgeInsets.symmetric(vertical: 5), + padding: EdgeInsets.symmetric(vertical: isDesktop ? 8 : 5), child: Row( children: [ for (int j = 1; j <= wordsPerRow; j++) ...[ if (j > 1) - const SizedBox( - width: 6, + SizedBox( + width: isDesktop ? 10 : 6, ), Expanded( child: MnemonicTableItem( number: ++index, word: words[index - 1], + isDesktop: isDesktop, ), ), ], ], ), ), - Padding( - padding: const EdgeInsets.symmetric(vertical: 5), - child: Row( - children: [ - for (int i = index; i < words.length; i++) ...[ - if (i > index) + if (index != words.length) + Padding( + padding: EdgeInsets.symmetric(vertical: isDesktop ? 8 : 5), + child: Row( + children: [ + for (int i = index; i < words.length; i++) ...[ + if (i > index) + SizedBox( + width: isDesktop ? 10 : 6, + ), + Expanded( + child: MnemonicTableItem( + number: i + 1, + word: words[i], + isDesktop: isDesktop, + ), + ), + ], + for (int i = remainder; i < wordsPerRow; i++) ...[ const SizedBox( width: 6, ), - Expanded( - child: MnemonicTableItem( - number: i + 1, - word: words[i], + Expanded( + child: Container(), ), - ), + ], ], - for (int i = remainder; i < wordsPerRow; i++) ...[ - const SizedBox( - width: 6, - ), - Expanded( - child: Container(), - ), - ], - ], + ), ), - ), ], ); } diff --git a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table_item.dart b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table_item.dart index dfc8897f8..21e7d2547 100644 --- a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table_item.dart +++ b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table_item.dart @@ -1,49 +1,53 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; -import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/widgets/rounded_white_container.dart'; class MnemonicTableItem extends StatelessWidget { const MnemonicTableItem({ Key? key, required this.number, required this.word, + required this.isDesktop, }) : super(key: key); final int number; final String word; + final bool isDesktop; @override Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); - return Container( - decoration: BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius, - ), - ), - child: Padding( - padding: const EdgeInsets.all(8), - child: Row( - mainAxisAlignment: MainAxisAlignment.start, - children: [ - Text( - number.toString(), - style: STextStyles.baseXS.copyWith( - color: CFColors.gray3, - fontSize: 10, - ), - ), - const SizedBox( - width: 8, - ), - Text( - word, - style: STextStyles.baseXS, - ), - ], - ), + return RoundedWhiteContainer( + padding: isDesktop + ? const EdgeInsets.symmetric(horizontal: 12, vertical: 9) + : const EdgeInsets.all(8), + child: Row( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Text( + number.toString(), + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle2, + ) + : STextStyles.baseXS.copyWith( + color: StackTheme.instance.color.textSubtitle2, + fontSize: 10, + ), + ), + const SizedBox( + width: 8, + ), + Text( + word, + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textDark, + ) + : STextStyles.baseXS, + ), + ], ), ); } diff --git a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart index 4711ff2fd..b04af80c3 100644 --- a/lib/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart +++ b/lib/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart @@ -1,18 +1,25 @@ +import 'dart:async'; + import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/coin_service.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/services/transaction_notification_tracker.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/default_nodes.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; +import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:tuple/tuple.dart'; class NewWalletRecoveryPhraseWarningView extends StatefulWidget { @@ -36,11 +43,13 @@ class _NewWalletRecoveryPhraseWarningViewState extends State { late final Coin coin; late final String walletName; + late final bool isDesktop; @override void initState() { coin = widget.coin; walletName = widget.walletName; + isDesktop = Util.isDesktop; super.initState(); } @@ -52,24 +61,28 @@ class _NewWalletRecoveryPhraseWarningViewState ? Constants.seedPhraseWordCountMonero : Constants.seedPhraseWordCountBip39; - return Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () { - Navigator.of(context).pop(); - }, - ), - ), - body: Container( - color: CFColors.almostWhite, - child: Padding( - padding: const EdgeInsets.all(16), - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - const SizedBox( - height: 4, - ), + return MasterScaffold( + isDesktop: isDesktop, + appBar: isDesktop + ? const DesktopAppBar( + isCompactHeight: false, + leading: AppBarBackButton(), + trailing: ExitToMyStackButton(), + ) + : AppBar( + leading: const AppBarBackButton(), + ), + body: Padding( + padding: EdgeInsets.all(isDesktop ? 0 : 16), + child: Column( + crossAxisAlignment: isDesktop + ? CrossAxisAlignment.center + : CrossAxisAlignment.stretch, + children: [ + const SizedBox( + height: 4, + ), + if (!isDesktop) Text( walletName, textAlign: TextAlign.center, @@ -77,35 +90,42 @@ class _NewWalletRecoveryPhraseWarningViewState fontSize: 12, ), ), + const SizedBox( + height: 4, + ), + Text( + "Recovery Phrase", + textAlign: TextAlign.center, + style: + isDesktop ? STextStyles.desktopH2 : STextStyles.pageTitleH1, + ), + SizedBox( + height: isDesktop ? 32 : 16, + ), + RoundedWhiteContainer( + padding: isDesktop + ? const EdgeInsets.all(32) + : const EdgeInsets.all(12), + width: isDesktop ? 480 : null, + child: Text( + "On the next screen you will see $_numberOfPhraseWords words that make up your recovery phrase.\n\nPlease write it down. Keep it safe and never share it with anyone. Your recovery phrase is the only way you can access your funds if you forget your PIN, lose your phone, etc.\n\nStack Wallet does not keep nor is able to restore your recover phrase. Only you have access to your wallet.", + style: isDesktop + ? STextStyles.desktopTextMediumRegular + : STextStyles.subtitle.copyWith( + fontSize: 12, + ), + ), + ), + if (!isDesktop) const Spacer(), + if (isDesktop) const SizedBox( - height: 4, + height: 32, ), - Text( - "Recovery Phrase", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, + ConstrainedBox( + constraints: BoxConstraints( + maxWidth: isDesktop ? 480 : 0, ), - const SizedBox( - height: 16, - ), - Container( - decoration: BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius), - ), - child: Padding( - padding: const EdgeInsets.all(12), - child: Text( - "On the next screen you will see $_numberOfPhraseWords words that make up your recovery phrase.\n\nPlease write it down. Keep it safe and never share it with anyone. Your recovery phrase is the only way you can access your funds if you forget your PIN, lose your phone, etc.\n\nStack Wallet does not keep nor is able to restore your recover phrase. Only you have access to your wallet.", - style: STextStyles.subtitle.copyWith( - fontSize: 12, - ), - ), - ), - ), - const Spacer(), - Consumer( + child: Consumer( builder: (_, ref, __) { return Column( crossAxisAlignment: CrossAxisAlignment.stretch, @@ -119,6 +139,9 @@ class _NewWalletRecoveryPhraseWarningViewState child: Container( color: Colors.transparent, child: Row( + crossAxisAlignment: isDesktop + ? CrossAxisAlignment.start + : CrossAxisAlignment.center, children: [ Checkbox( materialTapTargetSize: @@ -131,138 +154,141 @@ class _NewWalletRecoveryPhraseWarningViewState newValue!; }, ), - const SizedBox( - width: 4, + SizedBox( + width: isDesktop ? 14 : 4, ), Flexible( child: Text( "I understand that if I lose my recovery phrase, I will not be able to access my funds.", - style: STextStyles.baseXS, + style: isDesktop + ? STextStyles.desktopTextMedium + : STextStyles.baseXS, ), ), ], ), ), ), - const SizedBox( - height: 16, + SizedBox( + height: isDesktop ? 32 : 16, ), - TextButton( - onPressed: ref.read(checkBoxStateProvider.state).state - ? () async { - try { - showDialog( - context: context, - barrierDismissible: false, - useSafeArea: true, - builder: (ctx) { - return const Center( - child: LoadingIndicator( - width: 50, - height: 50, - ), - ); - }, - ); - - final walletsService = ref.read( - walletsServiceChangeNotifierProvider); - - final walletId = - await walletsService.addNewWallet( - name: walletName, - coin: coin, - shouldNotifyListeners: false, - ); - - var node = ref - .read(nodeServiceChangeNotifierProvider) - .getPrimaryNodeFor(coin: coin); - - if (node == null) { - node = DefaultNodes.getNodeFor(coin); - ref - .read(nodeServiceChangeNotifierProvider) - .setPrimaryNodeFor( - coin: coin, - node: node, + ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + ), + child: TextButton( + onPressed: ref.read(checkBoxStateProvider.state).state + ? () async { + try { + unawaited(showDialog( + context: context, + barrierDismissible: false, + useSafeArea: true, + builder: (ctx) { + return const Center( + child: LoadingIndicator( + width: 50, + height: 50, + ), ); - } + }, + )); - final txTracker = - TransactionNotificationTracker( - walletId: walletId!); + final walletsService = ref.read( + walletsServiceChangeNotifierProvider); - final failovers = ref - .read(nodeServiceChangeNotifierProvider) - .failoverNodesFor(coin: widget.coin); - - final wallet = CoinServiceAPI.from( - coin, - walletId, - walletName, - node, - txTracker, - ref.read(prefsChangeNotifierProvider), - failovers, - ); - - final manager = Manager(wallet); - - await manager.initializeNew(); - - // pop progress dialog - if (mounted) { - Navigator.pop(context); - } - // set checkbox back to unchecked to annoy users to agree again :P - ref.read(checkBoxStateProvider.state).state = - false; - - if (mounted) { - Navigator.of(context).pushNamed( - NewWalletRecoveryPhraseView.routeName, - arguments: Tuple2( - manager, - await manager.mnemonic, - ), + final walletId = + await walletsService.addNewWallet( + name: walletName, + coin: coin, + shouldNotifyListeners: false, ); + + var node = ref + .read(nodeServiceChangeNotifierProvider) + .getPrimaryNodeFor(coin: coin); + + if (node == null) { + node = DefaultNodes.getNodeFor(coin); + await ref + .read( + nodeServiceChangeNotifierProvider) + .setPrimaryNodeFor( + coin: coin, + node: node, + ); + } + + final txTracker = + TransactionNotificationTracker( + walletId: walletId!); + + final failovers = ref + .read(nodeServiceChangeNotifierProvider) + .failoverNodesFor(coin: widget.coin); + + final wallet = CoinServiceAPI.from( + coin, + walletId, + walletName, + node, + txTracker, + ref.read(prefsChangeNotifierProvider), + failovers, + ); + + final manager = Manager(wallet); + + await manager.initializeNew(); + + // pop progress dialog + if (mounted) { + Navigator.pop(context); + } + // set checkbox back to unchecked to annoy users to agree again :P + ref + .read(checkBoxStateProvider.state) + .state = false; + + if (mounted) { + unawaited(Navigator.of(context).pushNamed( + NewWalletRecoveryPhraseView.routeName, + arguments: Tuple2( + manager, + await manager.mnemonic, + ), + )); + } + } catch (e, s) { + Logging.instance + .log("$e\n$s", level: LogLevel.Fatal); + // TODO: handle gracefully + // any network/socket exception here will break new wallet creation + rethrow; } - } catch (e, s) { - Logging.instance - .log("$e\n$s", level: LogLevel.Fatal); - // TODO: handle gracefully - // any network/socket exception here will break new wallet creation - rethrow; } - } - : null, - style: ref.read(checkBoxStateProvider.state).state - ? Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ) - : Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent.withOpacity( - 0.25, - ), - ), - ), - child: Text( - "View recovery phrase", - style: STextStyles.button, + : null, + style: ref.read(checkBoxStateProvider.state).state + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), + child: Text( + "View recovery phrase", + style: isDesktop + ? ref.read(checkBoxStateProvider.state).state + ? STextStyles.desktopButtonEnabled + : STextStyles.desktopButtonDisabled + : STextStyles.button, + ), ), ), ], ); }, ), - ], - ), + ), + ], ), ), ); diff --git a/lib/pages/add_wallet_views/restore_wallet_view/confirm_recovery_dialog.dart b/lib/pages/add_wallet_views/restore_wallet_view/confirm_recovery_dialog.dart index 6cf709ac1..ec3185c20 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/confirm_recovery_dialog.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/confirm_recovery_dialog.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class ConfirmRecoveryDialog extends StatelessWidget { @@ -20,11 +20,7 @@ class ConfirmRecoveryDialog extends StatelessWidget { message: "Restoring your wallet may take a while. Please do not exit this screen once the process is started.", leftButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, @@ -34,11 +30,7 @@ class ConfirmRecoveryDialog extends StatelessWidget { }, ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), child: Text( "Restore", style: STextStyles.button, diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view.dart deleted file mode 100644 index d7f78041d..000000000 --- a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view.dart +++ /dev/null @@ -1,409 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:flutter_riverpod/flutter_riverpod.dart'; -import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart'; -import 'package:flutter_svg/svg.dart'; -import 'package:google_fonts/google_fonts.dart'; -import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart'; -import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/sub_widgets/mnemonic_word_count_select_sheet.dart'; -import 'package:stackwallet/providers/ui/verify_recovery_phrase/mnemonic_word_count_state_provider.dart'; -import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; -import 'package:stackwallet/utilities/constants.dart'; -import 'package:stackwallet/utilities/enums/coin_enum.dart'; -import 'package:stackwallet/utilities/format.dart'; -import 'package:stackwallet/utilities/text_styles.dart'; -import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; -import 'package:stackwallet/widgets/rounded_white_container.dart'; -import 'package:tuple/tuple.dart'; - -class RestoreOptionsView extends ConsumerStatefulWidget { - const RestoreOptionsView({ - Key? key, - required this.walletName, - required this.coin, - }) : super(key: key); - - static const routeName = "/restoreOptions"; - - final String walletName; - final Coin coin; - - @override - ConsumerState createState() => _RestoreOptionsViewState(); -} - -class _RestoreOptionsViewState extends ConsumerState { - late final String walletName; - late final Coin coin; - - late TextEditingController _dateController; - late TextEditingController _lengthController; - late FocusNode textFieldFocusNode; - - final bool _nextEnabled = true; - DateTime _restoreFromDate = DateTime.fromMillisecondsSinceEpoch(0); - - @override - void initState() { - walletName = widget.walletName; - coin = widget.coin; - - _dateController = TextEditingController(); - _lengthController = TextEditingController(); - textFieldFocusNode = FocusNode(); - - super.initState(); - } - - @override - void dispose() { - _dateController.dispose(); - _lengthController.dispose(); - textFieldFocusNode.dispose(); - super.dispose(); - } - - final _datePickerTextStyleBase = GoogleFonts.inter( - color: CFColors.gray3, - fontSize: 12, - fontWeight: FontWeight.w400, - letterSpacing: 0.5, - ); - MaterialRoundedDatePickerStyle _buildDatePickerStyle() { - return MaterialRoundedDatePickerStyle( - paddingMonthHeader: const EdgeInsets.only(top: 11), - colorArrowNext: CFColors.neutral60, - colorArrowPrevious: CFColors.neutral60, - textStyleButtonNegative: _datePickerTextStyleBase.copyWith( - fontSize: 16, fontWeight: FontWeight.w600), - textStyleButtonPositive: _datePickerTextStyleBase.copyWith( - fontSize: 16, fontWeight: FontWeight.w600), - textStyleCurrentDayOnCalendar: _datePickerTextStyleBase.copyWith( - color: CFColors.stackAccent, - ), - textStyleDayHeader: _datePickerTextStyleBase.copyWith( - color: CFColors.stackAccent, - fontSize: 16, - fontWeight: FontWeight.w600, - ), - textStyleDayOnCalendar: _datePickerTextStyleBase, - textStyleDayOnCalendarDisabled: _datePickerTextStyleBase.copyWith( - color: CFColors.neutral80, - ), - textStyleDayOnCalendarSelected: _datePickerTextStyleBase.copyWith( - color: CFColors.white, - ), - textStyleMonthYearHeader: _datePickerTextStyleBase.copyWith( - color: CFColors.neutral60, - fontSize: 16, - fontWeight: FontWeight.w600, - ), - textStyleYearButton: _datePickerTextStyleBase.copyWith( - color: CFColors.white, - fontSize: 16, - fontWeight: FontWeight.w600, - ), - textStyleButtonAction: GoogleFonts.inter(), - ); - } - - MaterialRoundedYearPickerStyle _buildYearPickerStyle() { - return MaterialRoundedYearPickerStyle( - textStyleYear: _datePickerTextStyleBase.copyWith( - color: CFColors.gray3, - fontWeight: FontWeight.w600, - fontSize: 16, - ), - textStyleYearSelected: _datePickerTextStyleBase.copyWith( - color: CFColors.stackAccent, - fontWeight: FontWeight.w600, - fontSize: 18, - ), - ); - } - - @override - Widget build(BuildContext context) { - debugPrint("BUILD: $runtimeType with ${coin.name} $walletName"); - - return Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () { - if (textFieldFocusNode.hasFocus) { - textFieldFocusNode.unfocus(); - Future.delayed(const Duration(milliseconds: 100)) - .then((value) => Navigator.of(context).pop()); - } else { - Navigator.of(context).pop(); - } - }, - ), - ), - body: Container( - color: CFColors.almostWhite, - child: Padding( - padding: const EdgeInsets.all(16), - child: LayoutBuilder( - builder: (ctx, constraints) { - return SingleChildScrollView( - child: ConstrainedBox( - constraints: BoxConstraints(minHeight: constraints.maxHeight), - child: IntrinsicHeight( - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - const Spacer( - flex: 1, - ), - Image( - image: AssetImage( - Assets.png.imageFor(coin: coin), - ), - height: 100, - ), - const SizedBox( - height: 16, - ), - Text( - "Restore options", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, - ), - const SizedBox( - height: 24, - ), - if (coin == Coin.monero || coin == Coin.epicCash) - Text( - "Choose start date", - style: STextStyles.smallMed12, - textAlign: TextAlign.left, - ), - if (coin == Coin.monero || coin == Coin.epicCash) - const SizedBox( - height: 8, - ), - if (coin == Coin.monero || coin == Coin.epicCash) - Container( - color: Colors.transparent, - child: TextField( - onTap: () async { - final height = - MediaQuery.of(context).size.height; - // check and hide keyboard - if (FocusScope.of(context).hasFocus) { - FocusScope.of(context).unfocus(); - await Future.delayed( - const Duration(milliseconds: 125)); - } - - final date = await showRoundedDatePicker( - context: context, - initialDate: DateTime.now(), - height: height * 0.5, - theme: ThemeData( - primarySwatch: CFColors.createMaterialColor( - CFColors.stackAccent), - ), - //TODO pick a better initial date - // 2007 chosen as that is just before bitcoin launched - firstDate: DateTime(2007), - lastDate: DateTime.now(), - borderRadius: - Constants.size.circularBorderRadius * 2, - - textPositiveButton: "SELECT", - - styleDatePicker: _buildDatePickerStyle(), - styleYearPicker: _buildYearPickerStyle(), - ); - if (date != null) { - _restoreFromDate = date; - _dateController.text = - Format.formatDate(date); - } - }, - controller: _dateController, - style: STextStyles.field, - decoration: InputDecoration( - hintText: "Restore from...", - suffixIcon: UnconstrainedBox( - child: Row( - children: [ - const SizedBox( - width: 16, - ), - SvgPicture.asset( - Assets.svg.calendar, - color: CFColors.neutral50, - width: 16, - height: 16, - ), - const SizedBox( - width: 12, - ), - ], - ), - ), - ), - key: const Key("restoreOptionsViewDatePickerKey"), - readOnly: true, - toolbarOptions: const ToolbarOptions( - copy: true, - cut: false, - paste: false, - selectAll: false, - ), - onChanged: (newValue) {}, - ), - ), - if (coin == Coin.monero || coin == Coin.epicCash) - const SizedBox( - height: 8, - ), - if (coin == Coin.monero || coin == Coin.epicCash) - RoundedWhiteContainer( - child: Center( - child: Text( - "Choose the date you made the wallet (approximate is fine)", - style: STextStyles.smallMed12.copyWith( - fontSize: 10, - ), - ), - ), - ), - if (coin == Coin.monero || coin == Coin.epicCash) - const SizedBox( - height: 16, - ), - Text( - "Choose recovery phrase length", - style: STextStyles.smallMed12, - textAlign: TextAlign.left, - ), - const SizedBox( - height: 8, - ), - Stack( - children: [ - TextField( - controller: _lengthController, - readOnly: true, - textInputAction: TextInputAction.none, - ), - Padding( - padding: const EdgeInsets.symmetric( - horizontal: 12, - ), - child: RawMaterialButton( - splashColor: CFColors.splashLight, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius, - ), - ), - onPressed: () { - showModalBottomSheet( - backgroundColor: Colors.transparent, - context: context, - shape: const RoundedRectangleBorder( - borderRadius: BorderRadius.vertical( - top: Radius.circular(20), - ), - ), - builder: (_) { - return MnemonicWordCountSelectSheet( - lengthOptions: - Constants.possibleLengthsForCoin( - coin), - ); - }, - ); - }, - child: Row( - mainAxisAlignment: - MainAxisAlignment.spaceBetween, - children: [ - Text( - "${ref.watch(mnemonicWordCountStateProvider.state).state} words", - style: STextStyles.itemSubtitle12, - ), - SvgPicture.asset( - Assets.svg.chevronDown, - width: 8, - height: 4, - color: CFColors.gray3, - ), - ], - ), - ), - ) - ], - ), - const Spacer( - flex: 3, - ), - TextButton( - onPressed: _nextEnabled - ? () async { - // hide keyboard if has focus - if (FocusScope.of(context).hasFocus) { - FocusScope.of(context).unfocus(); - await Future.delayed( - const Duration(milliseconds: 75)); - } - - if (mounted) { - Navigator.of(context).pushNamed( - RestoreWalletView.routeName, - arguments: Tuple4( - walletName, - coin, - ref - .read(mnemonicWordCountStateProvider - .state) - .state, - _restoreFromDate, - ), - ); - } - } - : null, - style: _nextEnabled - ? Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ) - : Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent.withOpacity( - 0.25, - ), - ), - ), - child: Text( - "Next", - style: STextStyles.button, - ), - ), - ], - ), - ), - ), - ); - }, - ), - ), - ), - ); - } -} diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart new file mode 100644 index 000000000..33ca78a46 --- /dev/null +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart @@ -0,0 +1,389 @@ +import 'package:dropdown_button2/dropdown_button2.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:google_fonts/google_fonts.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/mobile_mnemonic_length_selector.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_from_date_picker.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_next_button.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_platform_layout.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/sub_widgets/mnemonic_word_count_select_sheet.dart'; +import 'package:stackwallet/providers/ui/verify_recovery_phrase/mnemonic_word_count_state_provider.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/format.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; +import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; +import 'package:stackwallet/widgets/rounded_white_container.dart'; +import 'package:tuple/tuple.dart'; + +class RestoreOptionsView extends ConsumerStatefulWidget { + const RestoreOptionsView({ + Key? key, + required this.walletName, + required this.coin, + }) : super(key: key); + + static const routeName = "/restoreOptions"; + + final String walletName; + final Coin coin; + + @override + ConsumerState createState() => _RestoreOptionsViewState(); +} + +class _RestoreOptionsViewState extends ConsumerState { + late final String walletName; + late final Coin coin; + late final bool isDesktop; + + late TextEditingController _dateController; + late FocusNode textFieldFocusNode; + + final bool _nextEnabled = true; + DateTime _restoreFromDate = DateTime.fromMillisecondsSinceEpoch(0); + + @override + void initState() { + walletName = widget.walletName; + coin = widget.coin; + isDesktop = Util.isDesktop; + + _dateController = TextEditingController(); + textFieldFocusNode = FocusNode(); + + super.initState(); + } + + @override + void dispose() { + _dateController.dispose(); + textFieldFocusNode.dispose(); + super.dispose(); + } + + final _datePickerTextStyleBase = GoogleFonts.inter( + color: StackTheme.instance.color.textSubtitle2, + fontSize: 12, + fontWeight: FontWeight.w400, + letterSpacing: 0.5, + ); + MaterialRoundedDatePickerStyle _buildDatePickerStyle() { + return MaterialRoundedDatePickerStyle( + paddingMonthHeader: const EdgeInsets.only(top: 11), + colorArrowNext: StackTheme.instance.color.textSubtitle1, + colorArrowPrevious: StackTheme.instance.color.textSubtitle1, + textStyleButtonNegative: _datePickerTextStyleBase.copyWith( + fontSize: 16, fontWeight: FontWeight.w600), + textStyleButtonPositive: _datePickerTextStyleBase.copyWith( + fontSize: 16, fontWeight: FontWeight.w600), + textStyleCurrentDayOnCalendar: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.accentColorDark, + ), + textStyleDayHeader: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.accentColorDark, + fontSize: 16, + fontWeight: FontWeight.w600, + ), + textStyleDayOnCalendar: _datePickerTextStyleBase, + textStyleDayOnCalendarDisabled: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.textSubtitle3, + ), + textStyleDayOnCalendarSelected: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.popupBG, + ), + textStyleMonthYearHeader: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.textSubtitle1, + fontSize: 16, + fontWeight: FontWeight.w600, + ), + textStyleYearButton: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.textWhite, + fontSize: 16, + fontWeight: FontWeight.w600, + ), + textStyleButtonAction: GoogleFonts.inter(), + ); + } + + MaterialRoundedYearPickerStyle _buildYearPickerStyle() { + return MaterialRoundedYearPickerStyle( + textStyleYear: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.textSubtitle2, + fontWeight: FontWeight.w600, + fontSize: 16, + ), + textStyleYearSelected: _datePickerTextStyleBase.copyWith( + color: StackTheme.instance.color.accentColorDark, + fontWeight: FontWeight.w600, + fontSize: 18, + ), + ); + } + + Future nextPressed() async { + if (!isDesktop) { + // hide keyboard if has focus + if (FocusScope.of(context).hasFocus) { + FocusScope.of(context).unfocus(); + await Future.delayed(const Duration(milliseconds: 75)); + } + } + + if (mounted) { + await Navigator.of(context).pushNamed( + RestoreWalletView.routeName, + arguments: Tuple4( + walletName, + coin, + ref.read(mnemonicWordCountStateProvider.state).state, + _restoreFromDate, + ), + ); + } + } + + Future chooseDate() async { + final height = MediaQuery.of(context).size.height; + // check and hide keyboard + if (FocusScope.of(context).hasFocus) { + FocusScope.of(context).unfocus(); + await Future.delayed(const Duration(milliseconds: 125)); + } + + final date = await showRoundedDatePicker( + context: context, + initialDate: DateTime.now(), + height: height * 0.5, + theme: ThemeData( + primarySwatch: + Util.createMaterialColor(StackTheme.instance.color.accentColorDark), + ), + //TODO pick a better initial date + // 2007 chosen as that is just before bitcoin launched + firstDate: DateTime(2007), + lastDate: DateTime.now(), + borderRadius: Constants.size.circularBorderRadius * 2, + + textPositiveButton: "SELECT", + + styleDatePicker: _buildDatePickerStyle(), + styleYearPicker: _buildYearPickerStyle(), + ); + if (date != null) { + _restoreFromDate = date; + _dateController.text = Format.formatDate(date); + } + } + + Future chooseMnemonicLength() async { + await showModalBottomSheet( + backgroundColor: Colors.transparent, + context: context, + shape: const RoundedRectangleBorder( + borderRadius: BorderRadius.vertical( + top: Radius.circular(20), + ), + ), + builder: (_) { + return MnemonicWordCountSelectSheet( + lengthOptions: Constants.possibleLengthsForCoin(coin), + ); + }, + ); + } + + @override + Widget build(BuildContext context) { + debugPrint("BUILD: $runtimeType with ${coin.name} $walletName"); + + final lengths = Constants.possibleLengthsForCoin(coin).toList(); + + return DesktopScaffold( + appBar: isDesktop + ? const DesktopAppBar( + isCompactHeight: false, + leading: AppBarBackButton(), + ) + : AppBar( + leading: AppBarBackButton( + onPressed: () { + if (textFieldFocusNode.hasFocus) { + textFieldFocusNode.unfocus(); + Future.delayed(const Duration(milliseconds: 100)) + .then((value) => Navigator.of(context).pop()); + } else { + Navigator.of(context).pop(); + } + }, + ), + ), + body: RestoreOptionsPlatformLayout( + isDesktop: isDesktop, + child: ConstrainedBox( + constraints: BoxConstraints( + maxWidth: isDesktop ? 480 : double.infinity, + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + if (!isDesktop) + const Spacer( + flex: 1, + ), + if (!isDesktop) + Image( + image: AssetImage( + Assets.png.imageFor(coin: coin), + ), + height: 100, + ), + SizedBox( + height: isDesktop ? 24 : 16, + ), + Text( + "Restore options", + textAlign: TextAlign.center, + style: + isDesktop ? STextStyles.desktopH2 : STextStyles.pageTitleH1, + ), + SizedBox( + height: isDesktop ? 40 : 24, + ), + if (coin == Coin.monero || coin == Coin.epicCash) + Text( + "Choose start date", + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textDark3, + ) + : STextStyles.smallMed12, + textAlign: TextAlign.left, + ), + if (coin == Coin.monero || coin == Coin.epicCash) + SizedBox( + height: isDesktop ? 16 : 8, + ), + if (coin == Coin.monero || coin == Coin.epicCash) + + // if (!isDesktop) + RestoreFromDatePicker( + onTap: chooseDate, + ), + + // if (isDesktop) + // // TODO desktop date picker + if (coin == Coin.monero || coin == Coin.epicCash) + const SizedBox( + height: 8, + ), + if (coin == Coin.monero || coin == Coin.epicCash) + RoundedWhiteContainer( + child: Center( + child: Text( + "Choose the date you made the wallet (approximate is fine)", + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ) + : STextStyles.smallMed12.copyWith( + fontSize: 10, + ), + ), + ), + ), + if (coin == Coin.monero || coin == Coin.epicCash) + SizedBox( + height: isDesktop ? 24 : 16, + ), + Text( + "Choose recovery phrase length", + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textDark3, + ) + : STextStyles.smallMed12, + textAlign: TextAlign.left, + ), + SizedBox( + height: isDesktop ? 16 : 8, + ), + if (isDesktop) + DropdownButtonHideUnderline( + child: DropdownButton2( + value: + ref.watch(mnemonicWordCountStateProvider.state).state, + items: [ + ...lengths.map( + (e) => DropdownMenuItem( + value: e, + child: Text( + "$e words", + style: STextStyles.desktopTextMedium, + ), + ), + ), + ], + onChanged: (value) { + if (value is int) { + ref.read(mnemonicWordCountStateProvider.state).state = + value; + } + }, + isExpanded: true, + icon: SvgPicture.asset( + Assets.svg.chevronDown, + width: 12, + height: 6, + color: StackTheme + .instance.color.textFieldActiveSearchIconRight, + ), + buttonPadding: const EdgeInsets.symmetric( + horizontal: 16, + vertical: 8, + ), + buttonDecoration: BoxDecoration( + color: StackTheme.instance.color.textFieldDefaultBG, + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + dropdownDecoration: BoxDecoration( + color: StackTheme.instance.color.textFieldDefaultBG, + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + ), + ), + if (!isDesktop) + MobileMnemonicLengthSelector( + chooseMnemonicLength: chooseMnemonicLength, + ), + if (!isDesktop) + const Spacer( + flex: 3, + ), + if (isDesktop) + const SizedBox( + height: 32, + ), + RestoreOptionsNextButton( + isDesktop: isDesktop, + onPressed: _nextEnabled ? nextPressed : null, + ), + ], + ), + ), + ), + ); + } +} diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/mobile_mnemonic_length_selector.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/mobile_mnemonic_length_selector.dart new file mode 100644 index 000000000..79fece250 --- /dev/null +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/mobile_mnemonic_length_selector.dart @@ -0,0 +1,59 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/providers/ui/verify_recovery_phrase/mnemonic_word_count_state_provider.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class MobileMnemonicLengthSelector extends ConsumerWidget { + const MobileMnemonicLengthSelector({ + Key? key, + required this.chooseMnemonicLength, + }) : super(key: key); + + final VoidCallback chooseMnemonicLength; + + @override + Widget build(BuildContext context, WidgetRef ref) { + return Stack( + children: [ + const TextField( + // controller: _lengthController, + readOnly: true, + textInputAction: TextInputAction.none, + ), + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 12, + ), + child: RawMaterialButton( + splashColor: StackTheme.instance.color.highlight, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + onPressed: chooseMnemonicLength, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + "${ref.watch(mnemonicWordCountStateProvider.state).state} words", + style: STextStyles.itemSubtitle12, + ), + SvgPicture.asset( + Assets.svg.chevronDown, + width: 8, + height: 4, + color: StackTheme.instance.color.textSubtitle2, + ), + ], + ), + ), + ) + ], + ); + } +} diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_from_date_picker.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_from_date_picker.dart new file mode 100644 index 000000000..e0ab01217 --- /dev/null +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_from_date_picker.dart @@ -0,0 +1,76 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class RestoreFromDatePicker extends StatefulWidget { + const RestoreFromDatePicker({Key? key, required this.onTap}) + : super(key: key); + + final VoidCallback onTap; + + @override + State createState() => _RestoreFromDatePickerState(); +} + +class _RestoreFromDatePickerState extends State { + late final TextEditingController _dateController; + late final VoidCallback onTap; + + @override + void initState() { + onTap = widget.onTap; + _dateController = TextEditingController(); + + super.initState(); + } + + @override + void dispose() { + _dateController.dispose(); + super.dispose(); + } + + @override + Widget build(BuildContext context) { + return Container( + color: Colors.transparent, + child: TextField( + onTap: onTap, + controller: _dateController, + style: STextStyles.field, + decoration: InputDecoration( + hintText: "Restore from...", + suffixIcon: UnconstrainedBox( + child: Row( + children: [ + const SizedBox( + width: 16, + ), + SvgPicture.asset( + Assets.svg.calendar, + color: StackTheme.instance.color.textDark3, + width: 16, + height: 16, + ), + const SizedBox( + width: 12, + ), + ], + ), + ), + ), + key: const Key("restoreOptionsViewDatePickerKey"), + readOnly: true, + toolbarOptions: const ToolbarOptions( + copy: true, + cut: false, + paste: false, + selectAll: false, + ), + onChanged: (newValue) {}, + ), + ); + } +} diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_next_button.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_next_button.dart new file mode 100644 index 000000000..c8810b430 --- /dev/null +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_next_button.dart @@ -0,0 +1,33 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class RestoreOptionsNextButton extends StatelessWidget { + const RestoreOptionsNextButton({ + Key? key, + required this.isDesktop, + this.onPressed, + }) : super(key: key); + + final bool isDesktop; + final VoidCallback? onPressed; + + @override + Widget build(BuildContext context) { + return ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + ), + child: TextButton( + onPressed: onPressed, + style: onPressed != null + ? StackTheme.instance.getPrimaryEnabledButtonColor(context) + : StackTheme.instance.getPrimaryDisabledButtonColor(context), + child: Text( + "Next", + style: STextStyles.button, + ), + ), + ); + } +} diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_platform_layout.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_platform_layout.dart new file mode 100644 index 000000000..df5223c88 --- /dev/null +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_options_platform_layout.dart @@ -0,0 +1,39 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class RestoreOptionsPlatformLayout extends StatelessWidget { + const RestoreOptionsPlatformLayout({ + Key? key, + required this.isDesktop, + required this.child, + }) : super(key: key); + + final bool isDesktop; + final Widget child; + + @override + Widget build(BuildContext context) { + if (isDesktop) { + return child; + } else { + return Container( + color: StackTheme.instance.color.background, + child: Padding( + padding: const EdgeInsets.all(16), + child: LayoutBuilder( + builder: (ctx, constraints) { + return SingleChildScrollView( + child: ConstrainedBox( + constraints: BoxConstraints(minHeight: constraints.maxHeight), + child: IntrinsicHeight( + child: child, + ), + ), + ); + }, + ), + ), + ); + } + } +} diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart index 4e4871bda..59ce94874 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart @@ -16,6 +16,7 @@ import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/sub_widge import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_succeeded_dialog.dart'; import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/sub_widgets/restoring_dialog.dart'; import 'package:stackwallet/pages/home_view/home_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/coin_service.dart'; import 'package:stackwallet/services/coins/manager.dart'; @@ -23,7 +24,6 @@ import 'package:stackwallet/services/transaction_notification_tracker.dart'; import 'package:stackwallet/utilities/address_utils.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/custom_text_selection_controls.dart'; @@ -33,6 +33,8 @@ import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/enums/form_input_status_enum.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/clipboard_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/qrcode_icon.dart'; @@ -66,6 +68,7 @@ class RestoreWalletView extends ConsumerStatefulWidget { class _RestoreWalletViewState extends ConsumerState { final _formKey = GlobalKey(); late final int _seedWordCount; + late final bool isDesktop; final HashSet _wordListHashSet = HashSet.from(bip39wordlist.WORDLIST); final ScrollController controller = ScrollController(); @@ -85,13 +88,13 @@ class _RestoreWalletViewState extends ConsumerState { final text = data!.text!.trim(); if (text.isEmpty || _controllers.isEmpty) { - delegate.pasteText(SelectionChangedCause.toolbar); + unawaited(delegate.pasteText(SelectionChangedCause.toolbar)); return; } final words = text.split(" "); if (words.isEmpty) { - delegate.pasteText(SelectionChangedCause.toolbar); + unawaited(delegate.pasteText(SelectionChangedCause.toolbar)); return; } @@ -115,6 +118,7 @@ class _RestoreWalletViewState extends ConsumerState { @override void initState() { _seedWordCount = widget.seedWordsLength; + isDesktop = Util.isDesktop; textSelectionControls = Platform.isIOS ? CustomCupertinoTextSelectionControls(onPaste: onControlsPaste) @@ -190,13 +194,13 @@ class _RestoreWalletViewState extends ConsumerState { // TODO: do actual check to make sure it is a valid mnemonic for monero if (bip39.validateMnemonic(mnemonic) == false && !(widget.coin == Coin.monero)) { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, message: "Invalid seed phrase!", context: context, - ); + )); } else { - if (!Platform.isLinux) Wakelock.enable(); + if (!Platform.isLinux) await Wakelock.enable(); final walletsService = ref.read(walletsServiceChangeNotifierProvider); final walletId = await walletsService.addNewWallet( @@ -206,7 +210,7 @@ class _RestoreWalletViewState extends ConsumerState { ); bool isRestoring = true; // show restoring in progress - showDialog( + unawaited(showDialog( context: context, useSafeArea: false, barrierDismissible: false, @@ -225,7 +229,7 @@ class _RestoreWalletViewState extends ConsumerState { }, ); }, - ); + )); var node = ref .read(nodeServiceChangeNotifierProvider) @@ -233,7 +237,7 @@ class _RestoreWalletViewState extends ConsumerState { if (node == null) { node = DefaultNodes.getNodeFor(widget.coin); - ref.read(nodeServiceChangeNotifierProvider).setPrimaryNodeFor( + await ref.read(nodeServiceChangeNotifierProvider).setPrimaryNodeFor( coin: widget.coin, node: node, ); @@ -282,26 +286,31 @@ class _RestoreWalletViewState extends ConsumerState { .addWallet(walletId: manager.walletId, manager: manager); if (mounted) { - Navigator.of(context).pushNamedAndRemoveUntil( - HomeView.routeName, (route) => false); + if (isDesktop) { + Navigator.of(context) + .popUntil(ModalRoute.withName(DesktopHomeView.routeName)); + } else { + unawaited(Navigator.of(context).pushNamedAndRemoveUntil( + HomeView.routeName, (route) => false)); + } } - showDialog( + await showDialog( context: context, useSafeArea: false, barrierDismissible: true, builder: (context) { return const RestoreSucceededDialog(); }, - ).then( - (_) { - if (!Platform.isLinux) Wakelock.disable(); - // timer.cancel(); - }, ); + if (!Platform.isLinux && !isDesktop) { + await Wakelock.disable(); + } } } catch (e) { - if (!Platform.isLinux) Wakelock.disable(); + if (!Platform.isLinux && !isDesktop) { + await Wakelock.disable(); + } // if (e is HiveError && // e.message == "Box has already been closed.") { @@ -316,7 +325,7 @@ class _RestoreWalletViewState extends ConsumerState { Navigator.pop(context); // show restoring wallet failed dialog - showDialog( + await showDialog( context: context, useSafeArea: false, barrierDismissible: true, @@ -331,7 +340,9 @@ class _RestoreWalletViewState extends ConsumerState { } } - if (!Platform.isLinux) Wakelock.disable(); + if (!Platform.isLinux && !isDesktop) { + await Wakelock.disable(); + } } } } @@ -343,27 +354,27 @@ class _RestoreWalletViewState extends ConsumerState { Widget? suffixIcon; switch (status) { case FormInputStatus.empty: - color = CFColors.fieldGray; - prefixColor = CFColors.gray3; + color = StackTheme.instance.color.textFieldDefaultBG; + prefixColor = StackTheme.instance.color.textSubtitle2; break; case FormInputStatus.invalid: - color = CFColors.notificationRedBackground; - prefixColor = CFColors.notificationRedForeground; + color = StackTheme.instance.color.textFieldErrorBG; + prefixColor = StackTheme.instance.color.textFieldErrorSearchIconLeft; suffixIcon = SvgPicture.asset( Assets.svg.alertCircle, width: 16, height: 16, - color: CFColors.notificationRedForeground, + color: StackTheme.instance.color.textFieldErrorSearchIconRight, ); break; case FormInputStatus.valid: - color = CFColors.notificationGreenBackground; - prefixColor = CFColors.notificationGreenForeground; + color = StackTheme.instance.color.textFieldSuccessBG; + prefixColor = StackTheme.instance.color.textFieldSuccessSearchIconLeft; suffixIcon = SvgPicture.asset( Assets.svg.checkCircle, width: 16, height: 16, - color: CFColors.notificationGreenForeground, + color: StackTheme.instance.color.textFieldSuccessSearchIconRight, ); break; } @@ -441,8 +452,71 @@ class _RestoreWalletViewState extends ConsumerState { }); } - controller.animateTo(controller.position.maxScrollExtent, - duration: const Duration(milliseconds: 300), curve: Curves.decelerate); + if (!isDesktop) { + controller.animateTo( + controller.position.maxScrollExtent, + duration: const Duration(milliseconds: 300), + curve: Curves.decelerate, + ); + } + } + + Future scanMnemonicQr() async { + try { + final qrResult = await scanner.scan(); + + final results = AddressUtils.decodeQRSeedData(qrResult.rawContent); + + Logging.instance.log("scan parsed: $results", level: LogLevel.Info); + + if (results["mnemonic"] != null) { + final list = (results["mnemonic"] as List) + .map((value) => value as String) + .toList(growable: false); + if (list.isNotEmpty) { + _clearAndPopulateMnemonic(list); + Logging.instance.log("mnemonic populated", level: LogLevel.Info); + } else { + Logging.instance + .log("mnemonic failed to populate", level: LogLevel.Info); + } + } + } on PlatformException catch (e) { + // likely failed to get camera permissions + Logging.instance + .log("Restore wallet qr scan failed: $e", level: LogLevel.Warning); + } + } + + Future pasteMnemonic() async { + debugPrint("restoreWalletPasteButton tapped"); + final ClipboardData? data = + await widget.clipboard.getData(Clipboard.kTextPlain); + + if (data?.text != null && data!.text!.isNotEmpty) { + final content = data.text!.trim(); + final list = content.split(" "); + _clearAndPopulateMnemonic(list); + } + } + + Future requestRestore() async { + // wait for keyboard to disappear + FocusScope.of(context).unfocus(); + await Future.delayed( + const Duration(milliseconds: 100), + ); + + await showDialog( + context: context, + useSafeArea: false, + barrierDismissible: true, + builder: (context) { + return ConfirmRecoveryDialog( + onConfirm: attemptRestore, + ); + }, + ); } @override @@ -473,41 +547,13 @@ class _RestoreWalletViewState extends ConsumerState { key: const Key("restoreWalletViewQrCodeButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, - icon: const QrCodeIcon( + color: StackTheme.instance.color.background, + icon: QrCodeIcon( width: 20, height: 20, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), - onPressed: () async { - try { - final qrResult = await scanner.scan(); - - final results = - AddressUtils.decodeQRSeedData(qrResult.rawContent); - - Logging.instance - .log("scan parsed: $results", level: LogLevel.Info); - - if (results["mnemonic"] != null) { - final list = (results["mnemonic"] as List) - .map((value) => value as String) - .toList(growable: false); - if (list.isNotEmpty) { - _clearAndPopulateMnemonic(list); - Logging.instance - .log("mnemonic populated", level: LogLevel.Info); - } else { - Logging.instance.log("mnemonic failed to populate", - level: LogLevel.Info); - } - } - } on PlatformException catch (e) { - // likely failed to get camera permissions - Logging.instance.log("Restore wallet qr scan failed: $e", - level: LogLevel.Warning); - } - }, + onPressed: scanMnemonicQr, ), ), ), @@ -523,30 +569,20 @@ class _RestoreWalletViewState extends ConsumerState { key: const Key("restoreWalletPasteButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, - icon: const ClipboardIcon( + color: StackTheme.instance.color.background, + icon: ClipboardIcon( width: 20, height: 20, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), - onPressed: () async { - debugPrint("restoreWalletPasteButton tapped"); - final ClipboardData? data = - await widget.clipboard.getData(Clipboard.kTextPlain); - - if (data?.text != null && data!.text!.isNotEmpty) { - final content = data.text!.trim(); - final list = content.split(" "); - _clearAndPopulateMnemonic(list); - } - }, + onPressed: pasteMnemonic, ), ), ), ], ), body: Container( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, child: Padding( padding: const EdgeInsets.all(12.0), child: Column( @@ -633,74 +669,22 @@ class _RestoreWalletViewState extends ConsumerState { "Please check spelling", textAlign: TextAlign.left, style: STextStyles.label.copyWith( - color: CFColors - .notificationRedForeground, + color: StackTheme + .instance.color.textError, ), ), ), ) ], ), - // if (widget.coin == Coin.monero || - // widget.coin == Coin.epicCash) - // Padding( - // padding: const EdgeInsets.only( - // top: 8.0, - // ), - // child: ClipRRect( - // borderRadius: BorderRadius.circular( - // Constants.size.circularBorderRadius, - // ), - // child: TextField( - // key: Key("restoreMnemonicFormField_height"), - // inputFormatters: [ - // FilteringTextInputFormatter.allow( - // RegExp("[0-9]*")), - // ], - // keyboardType: - // TextInputType.numberWithOptions(), - // controller: _heightController, - // focusNode: _heightFocusNode, - // style: STextStyles.field, - // decoration: standardInputDecoration( - // "Height", - // _heightFocusNode, - // ), - // ), - // ), - // ), Padding( padding: const EdgeInsets.only( top: 8.0, ), child: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), - onPressed: () async { - // wait for keyboard to disappear - FocusScope.of(context).unfocus(); - await Future.delayed( - const Duration(milliseconds: 100), - ); - - showDialog( - context: context, - useSafeArea: false, - barrierDismissible: true, - builder: (context) { - return ConfirmRecoveryDialog( - onConfirm: attemptRestore, - ); - }, - ); - }, + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), + onPressed: requestRestore, child: Text( "Restore", style: STextStyles.button, diff --git a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/mnemonic_word_count_select_sheet.dart b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/mnemonic_word_count_select_sheet.dart index 50ab388ff..b14140cd6 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/mnemonic_word_count_select_sheet.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/mnemonic_word_count_select_sheet.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/ui/verify_recovery_phrase/mnemonic_word_count_state_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class MnemonicWordCountSelectSheet extends ConsumerWidget { const MnemonicWordCountSelectSheet({ @@ -22,9 +22,9 @@ class MnemonicWordCountSelectSheet extends ConsumerWidget { return false; }, child: Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -42,7 +42,7 @@ class MnemonicWordCountSelectSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -96,7 +96,8 @@ class MnemonicWordCountSelectSheet extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: lengthOptions[i], groupValue: ref .watch(mnemonicWordCountStateProvider @@ -118,9 +119,7 @@ class MnemonicWordCountSelectSheet extends ConsumerWidget { ), Text( "${lengthOptions[i]} words", - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), ], diff --git a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_failed_dialog.dart b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_failed_dialog.dart index 866223cfe..3d349e7ba 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_failed_dialog.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_failed_dialog.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class RestoreFailedDialog extends ConsumerStatefulWidget { @@ -45,11 +45,7 @@ class _RestoreFailedDialogState extends ConsumerState { title: "Restore failed", message: errorMessage, rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Ok", style: STextStyles.itemSubtitle12, diff --git a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_succeeded_dialog.dart b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_succeeded_dialog.dart index 2cfdaba2a..35c48ef17 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_succeeded_dialog.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restore_succeeded_dialog.dart @@ -1,8 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class RestoreSucceededDialog extends StatelessWidget { @@ -17,14 +18,10 @@ class RestoreSucceededDialog extends StatelessWidget { Assets.svg.checkCircle, width: 24, height: 24, - color: CFColors.stackGreen, + color: StackTheme.instance.color.accentColorGreen, ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Ok", style: STextStyles.itemSubtitle12, diff --git a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restoring_dialog.dart b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restoring_dialog.dart index 59ad53c20..a3971196f 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restoring_dialog.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/sub_widgets/restoring_dialog.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class RestoringDialog extends StatefulWidget { @@ -59,19 +59,13 @@ class _RestoringDialogState extends State message: "This may take a while. Please do not exit this screen.", icon: RotationTransition( turns: _spinAnimation, - child: SvgPicture.asset( - Assets.svg.arrowRotate3, - width: 24, - height: 24, - color: CFColors.stackAccent, - ), + child: SvgPicture.asset(Assets.svg.arrowRotate3, + width: 24, + height: 24, + color: StackTheme.instance.color.accentColorDark), ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, diff --git a/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table.dart b/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table.dart index 0046607c4..768ed05af 100644 --- a/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table.dart +++ b/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table.dart @@ -6,9 +6,11 @@ class WordTable extends ConsumerWidget { const WordTable({ Key? key, required this.words, + required this.isDesktop, }) : super(key: key); final List words; + final bool isDesktop; static const wordsPerRow = 3; static const wordsToShow = 9; @@ -24,18 +26,19 @@ class WordTable extends ConsumerWidget { children: [ for (int i = 1; i <= rows; i++) Padding( - padding: const EdgeInsets.symmetric(vertical: 5), + padding: EdgeInsets.symmetric(vertical: isDesktop ? 8 : 5), child: Row( children: [ for (int j = 1; j <= wordsPerRow; j++) ...[ if (j > 1) - const SizedBox( - width: 6, + SizedBox( + width: isDesktop ? 10 : 6, ), Expanded( child: WordTableItem( number: ++index, word: words[index - 1], + isDesktop: isDesktop, ), ), ], diff --git a/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table_item.dart b/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table_item.dart index 3d7d87d22..a9c86b525 100644 --- a/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table_item.dart +++ b/lib/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table_item.dart @@ -1,19 +1,21 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class WordTableItem extends ConsumerWidget { const WordTableItem({ Key? key, required this.number, required this.word, + required this.isDesktop, }) : super(key: key); final int number; final String word; + final bool isDesktop; @override Widget build(BuildContext context, WidgetRef ref) { @@ -22,15 +24,22 @@ class WordTableItem extends ConsumerWidget { ref.watch(verifyMnemonicSelectedWordStateProvider.state).state; return Container( decoration: BoxDecoration( - color: selectedWord == word ? CFColors.selection : CFColors.white, + color: selectedWord == word + ? StackTheme.instance.color.snackBarBackInfo + : StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), ), child: MaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, key: Key("coinSelectItemButtonKey_$word"), - padding: const EdgeInsets.all(12), + padding: isDesktop + ? const EdgeInsets.symmetric( + vertical: 18, + horizontal: 12, + ) + : const EdgeInsets.all(12), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: @@ -45,7 +54,11 @@ class WordTableItem extends ConsumerWidget { Text( word, textAlign: TextAlign.center, - style: STextStyles.baseXS, + style: isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textDark, + ) + : STextStyles.baseXS, ), ], ), diff --git a/lib/pages/add_wallet_views/verify_recovery_phrase_view/verify_recovery_phrase_view.dart b/lib/pages/add_wallet_views/verify_recovery_phrase_view/verify_recovery_phrase_view.dart index 6e0c1dd2b..ee464bd3e 100644 --- a/lib/pages/add_wallet_views/verify_recovery_phrase_view/verify_recovery_phrase_view.dart +++ b/lib/pages/add_wallet_views/verify_recovery_phrase_view/verify_recovery_phrase_view.dart @@ -1,3 +1,4 @@ +import 'dart:async'; import 'dart:math'; import 'package:flutter/material.dart'; @@ -6,14 +7,20 @@ import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart'; import 'package:stackwallet/pages/add_wallet_views/verify_recovery_phrase_view/sub_widgets/word_table.dart'; import 'package:stackwallet/pages/home_view/home_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; import 'package:tuple/tuple.dart'; class VerifyRecoveryPhraseView extends ConsumerStatefulWidget { @@ -39,11 +46,13 @@ class _VerifyRecoveryPhraseViewState { late Manager _manager; late List _mnemonic; + late final bool isDesktop; @override void initState() { _manager = widget.manager; _mnemonic = widget.mnemonic; + isDesktop = Util.isDesktop; // WidgetsBinding.instance?.addObserver(this); super.initState(); } @@ -75,6 +84,62 @@ class _VerifyRecoveryPhraseViewState // } // } + Future _continue(bool isMatch) async { + if (isMatch) { + await ref.read(walletsServiceChangeNotifierProvider).setMnemonicVerified( + walletId: _manager.walletId, + ); + + ref + .read(walletsChangeNotifierProvider.notifier) + .addWallet(walletId: _manager.walletId, manager: _manager); + + if (mounted) { + if (isDesktop) { + Navigator.of(context).popUntil( + ModalRoute.withName( + DesktopHomeView.routeName, + ), + ); + } else { + unawaited( + Navigator.of(context).pushNamedAndRemoveUntil( + HomeView.routeName, + (route) => false, + ), + ); + } + } + + unawaited(showFloatingFlushBar( + type: FlushBarType.success, + message: "Correct! Your wallet is set up.", + iconAsset: Assets.svg.check, + context: context, + )); + } else { + unawaited(showFloatingFlushBar( + type: FlushBarType.warning, + message: "Incorrect. Please try again.", + iconAsset: Assets.svg.circleX, + context: context, + )); + + final int next = Random().nextInt(_mnemonic.length); + ref + .read(verifyMnemonicWordIndexStateProvider.state) + .update((state) => next); + + ref + .read(verifyMnemonicCorrectWordStateProvider.state) + .update((state) => _mnemonic[next]); + + ref + .read(verifyMnemonicSelectedWordStateProvider.state) + .update((state) => ""); + } + } + Tuple2, String> randomize( List mnemonic, int chosenIndex, int wordsToShow) { final List remaining = []; @@ -113,12 +178,12 @@ class _VerifyRecoveryPhraseViewState return false; } - // Future delete() async { - // await ref - // .read(walletsServiceChangeNotifierProvider) - // .deleteWallet(_manager.walletName, false); - // await _manager.exitCurrentWallet(); - // } + Future delete() async { + await ref + .read(walletsServiceChangeNotifierProvider) + .deleteWallet(_manager.walletName, false); + await _manager.exitCurrentWallet(); + } @override Widget build(BuildContext context) { @@ -128,51 +193,78 @@ class _VerifyRecoveryPhraseViewState return WillPopScope( onWillPop: onWillPop, - child: Scaffold( - appBar: AppBar( - leading: AppBarBackButton( - onPressed: () async { - // await delete(); - Navigator.of(context).popUntil( - ModalRoute.withName( - // NewWalletRecoveryPhraseWarningView.routeName, - NewWalletRecoveryPhraseView.routeName, + child: MasterScaffold( + isDesktop: isDesktop, + appBar: isDesktop + ? DesktopAppBar( + isCompactHeight: false, + leading: AppBarBackButton( + onPressed: () async { + Navigator.of(context).popUntil( + ModalRoute.withName( + NewWalletRecoveryPhraseView.routeName, + ), + ); + }, ), - ); - }, - ), - ), - body: Container( - color: CFColors.almostWhite, + trailing: ExitToMyStackButton( + onPressed: () async { + await delete(); + if (mounted) { + Navigator.of(context).popUntil( + ModalRoute.withName(DesktopHomeView.routeName), + ); + } + }, + ), + ) + : AppBar( + leading: AppBarBackButton( + onPressed: () async { + Navigator.of(context).popUntil( + ModalRoute.withName( + NewWalletRecoveryPhraseView.routeName, + ), + ); + }, + ), + ), + body: SizedBox( + width: isDesktop ? 410 : null, child: Padding( - padding: const EdgeInsets.all(16), + padding: + isDesktop ? const EdgeInsets.all(0) : const EdgeInsets.all(16), child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ - const SizedBox( - height: 4, + SizedBox( + height: isDesktop ? 24 : 4, ), Text( "Verify recovery phrase", textAlign: TextAlign.center, - style: STextStyles.label.copyWith( - fontSize: 12, - ), + style: isDesktop + ? STextStyles.desktopH2 + : STextStyles.label.copyWith( + fontSize: 12, + ), ), - const SizedBox( - height: 4, + SizedBox( + height: isDesktop ? 16 : 4, ), Text( - "Tap word number ", + isDesktop ? "Select word number" : "Tap word number ", textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, + style: isDesktop + ? STextStyles.desktopSubtitleH1 + : STextStyles.pageTitleH1, ), - const SizedBox( - height: 12, + SizedBox( + height: isDesktop ? 16 : 12, ), Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius), ), @@ -192,10 +284,19 @@ class _VerifyRecoveryPhraseViewState ), ), ), + if (isDesktop) + const SizedBox( + height: 40, + ), WordTable( words: randomize(_mnemonic, correctIndex, 9).item1, + isDesktop: isDesktop, ), - const Spacer(), + if (!isDesktop) const Spacer(), + if (isDesktop) + const SizedBox( + height: 40, + ), Row( children: [ Expanded( @@ -210,92 +311,33 @@ class _VerifyRecoveryPhraseViewState verifyMnemonicCorrectWordStateProvider.state) .state; - return TextButton( - onPressed: selectedWord.isNotEmpty - ? () async { - if (correctWord == selectedWord) { - await ref - .read( - walletsServiceChangeNotifierProvider) - .setMnemonicVerified( - walletId: _manager.walletId, - ); - - ref - .read(walletsChangeNotifierProvider - .notifier) - .addWallet( - walletId: _manager.walletId, - manager: _manager); - - if (mounted) { - Navigator.of(context) - .pushNamedAndRemoveUntil( - HomeView.routeName, - (route) => false); - } - - showFloatingFlushBar( - type: FlushBarType.success, - message: - "Correct! Your wallet is set up.", - iconAsset: Assets.svg.check, - context: context, - ); - } else { - showFloatingFlushBar( - type: FlushBarType.warning, - message: "Incorrect. Please try again.", - iconAsset: Assets.svg.circleX, - context: context, - ); - - final int next = - Random().nextInt(_mnemonic.length); - ref - .read( - verifyMnemonicWordIndexStateProvider - .state) - .update((state) => next); - - ref - .read( - verifyMnemonicCorrectWordStateProvider - .state) - .update((state) => _mnemonic[next]); - - ref - .read( - verifyMnemonicSelectedWordStateProvider - .state) - .update((state) => ""); + return ConstrainedBox( + constraints: BoxConstraints( + minHeight: isDesktop ? 70 : 0, + ), + child: TextButton( + onPressed: selectedWord.isNotEmpty + ? () async { + await _continue( + correctWord == selectedWord); } - } - : null, - style: selectedWord.isNotEmpty - ? Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), + : null, + style: selectedWord.isNotEmpty + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), + child: isDesktop + ? Text( + "Verify", + style: selectedWord.isNotEmpty + ? STextStyles.desktopButtonEnabled + : STextStyles.desktopButtonDisabled, ) - : Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent.withOpacity( - 0.25, - ), - ), + : Text( + "Continue", + style: STextStyles.button, ), - child: Text( - "Continue", - style: STextStyles.button, ), ); }, diff --git a/lib/pages/address_book_views/address_book_view.dart b/lib/pages/address_book_views/address_book_view.dart index 3266d5986..286971b97 100644 --- a/lib/pages/address_book_views/address_book_view.dart +++ b/lib/pages/address_book_views/address_book_view.dart @@ -9,10 +9,10 @@ import 'package:stackwallet/providers/global/address_book_service_provider.dart' import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/address_book_providers/address_book_filter_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/address_book_card.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; @@ -102,7 +102,7 @@ class _AddressBookViewState extends ConsumerState { addressBookServiceProvider.select((value) => value.addressBookEntries)); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -126,10 +126,10 @@ class _AddressBookViewState extends ConsumerState { key: const Key("addressBookFilterViewButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.filter, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), @@ -153,10 +153,10 @@ class _AddressBookViewState extends ConsumerState { key: const Key("addressBookAddNewContactViewButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.plus, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), diff --git a/lib/pages/address_book_views/subviews/add_address_book_entry_view.dart b/lib/pages/address_book_views/subviews/add_address_book_entry_view.dart index 9d0eede18..808a3bb48 100644 --- a/lib/pages/address_book_views/subviews/add_address_book_entry_view.dart +++ b/lib/pages/address_book_views/subviews/add_address_book_entry_view.dart @@ -11,10 +11,10 @@ import 'package:stackwallet/providers/ui/address_book_providers/contact_name_is_ import 'package:stackwallet/providers/ui/address_book_providers/valid_contact_state_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/emoji_select_sheet.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; @@ -93,7 +93,7 @@ class _AddAddressBookEntryViewState debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -123,10 +123,12 @@ class _AddAddressBookEntryViewState key: const Key("addAddressBookEntryFavoriteButtonKey"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.star, - color: _isFavorite ? CFColors.link2 : CFColors.buttonGray, + color: _isFavorite + ? StackTheme.instance.color.accentColorRed + : StackTheme.instance.color.buttonBackSecondary, width: 20, height: 20, ), @@ -198,7 +200,8 @@ class _AddAddressBookEntryViewState width: 48, decoration: BoxDecoration( borderRadius: BorderRadius.circular(24), - color: CFColors.textFieldActive, + color: StackTheme + .instance.color.textFieldActiveBG, ), child: Center( child: _selectedEmoji == null @@ -219,20 +222,22 @@ class _AddAddressBookEntryViewState height: 14, width: 14, decoration: BoxDecoration( - borderRadius: BorderRadius.circular(14), - color: CFColors.stackAccent, - ), + borderRadius: BorderRadius.circular(14), + color: StackTheme + .instance.color.accentColorDark), child: Center( child: _selectedEmoji == null ? SvgPicture.asset( Assets.svg.plus, - color: CFColors.white, + color: StackTheme + .instance.color.textWhite, width: 12, height: 12, ) : SvgPicture.asset( Assets.svg.thickX, - color: CFColors.white, + color: StackTheme + .instance.color.textWhite, width: 8, height: 8, ), @@ -336,17 +341,13 @@ class _AddAddressBookEntryViewState children: [ Expanded( child: TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -380,13 +381,12 @@ class _AddAddressBookEntryViewState validForms && nameExists; return TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - shouldEnableSave - ? CFColors.stackAccent - : CFColors.disabledButton, - )), + style: shouldEnableSave + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor( + context), onPressed: shouldEnableSave ? () async { if (FocusScope.of(context).hasFocus) { diff --git a/lib/pages/address_book_views/subviews/add_new_contact_address_view.dart b/lib/pages/address_book_views/subviews/add_new_contact_address_view.dart index 50d03aef7..7c590878b 100644 --- a/lib/pages/address_book_views/subviews/add_new_contact_address_view.dart +++ b/lib/pages/address_book_views/subviews/add_new_contact_address_view.dart @@ -9,9 +9,9 @@ import 'package:stackwallet/providers/ui/address_book_providers/address_entry_da import 'package:stackwallet/providers/ui/address_book_providers/valid_contact_state_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; class AddNewContactAddressView extends ConsumerStatefulWidget { @@ -56,7 +56,7 @@ class _AddNewContactAddressViewState .select((value) => value.getContactById(contactId))); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -99,7 +99,8 @@ class _AddNewContactAddressViewState width: 48, decoration: BoxDecoration( borderRadius: BorderRadius.circular(24), - color: CFColors.textFieldActive, + color: + StackTheme.instance.color.textFieldActiveBG, ), child: Center( child: contact.emojiChar == null @@ -144,17 +145,13 @@ class _AddNewContactAddressViewState children: [ Expanded( child: TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -178,14 +175,13 @@ class _AddNewContactAddressViewState ref.watch(validContactStateProvider([0])); return TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - shouldEnableSave - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: shouldEnableSave + ? StackTheme.instance + .getPrimaryEnabledButtonColor( + context) + : StackTheme.instance + .getPrimaryDisabledButtonColor( + context), onPressed: shouldEnableSave ? () async { if (FocusScope.of(context) diff --git a/lib/pages/address_book_views/subviews/address_book_filter_view.dart b/lib/pages/address_book_views/subviews/address_book_filter_view.dart index e990919de..91e3fcbcb 100644 --- a/lib/pages/address_book_views/subviews/address_book_filter_view.dart +++ b/lib/pages/address_book_views/subviews/address_book_filter_view.dart @@ -2,9 +2,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/providers/ui/address_book_providers/address_book_filter_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -42,9 +42,9 @@ class _AddressBookFilterViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { Navigator.of(context).pop(); diff --git a/lib/pages/address_book_views/subviews/coin_select_sheet.dart b/lib/pages/address_book_views/subviews/coin_select_sheet.dart index 5008a688f..a74bfda8d 100644 --- a/lib/pages/address_book_views/subviews/coin_select_sheet.dart +++ b/lib/pages/address_book_views/subviews/coin_select_sheet.dart @@ -3,10 +3,10 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class CoinSelectSheet extends StatelessWidget { const CoinSelectSheet({Key? key}) : super(key: key); @@ -17,9 +17,9 @@ class CoinSelectSheet extends StatelessWidget { var coins_ = [...Coin.values]; coins_.remove(Coin.firoTestNet); return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -39,7 +39,7 @@ class CoinSelectSheet extends StatelessWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -77,7 +77,7 @@ class CoinSelectSheet extends StatelessWidget { return Padding( padding: const EdgeInsets.symmetric(vertical: 4), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, onPressed: () { Navigator.of(context).pop(coin); }, diff --git a/lib/pages/address_book_views/subviews/contact_details_view.dart b/lib/pages/address_book_views/subviews/contact_details_view.dart index c22b1faa8..b74d9d693 100644 --- a/lib/pages/address_book_views/subviews/contact_details_view.dart +++ b/lib/pages/address_book_views/subviews/contact_details_view.dart @@ -13,11 +13,11 @@ import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/address_book_providers/address_entry_data_provider.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; @@ -105,7 +105,7 @@ class _ContactDetailsViewState extends ConsumerState { .select((value) => value.getContactById(_contactId))); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -129,12 +129,12 @@ class _ContactDetailsViewState extends ConsumerState { key: const Key("contactDetails"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.star, color: _contact.isFavorite - ? CFColors.link2 - : CFColors.buttonGray, + ? StackTheme.instance.color.infoItemIcons + : StackTheme.instance.color.buttonBackSecondary, width: 20, height: 20, ), @@ -160,10 +160,10 @@ class _ContactDetailsViewState extends ConsumerState { key: const Key("contactDetailsViewDeleteContactButtonKey"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.trash, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), @@ -176,14 +176,8 @@ class _ContactDetailsViewState extends ConsumerState { title: "Delete ${_contact.name}?", message: "Contact will be deleted permanently!", leftButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, @@ -193,14 +187,8 @@ class _ContactDetailsViewState extends ConsumerState { }, ), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Delete", style: STextStyles.button, @@ -246,7 +234,7 @@ class _ContactDetailsViewState extends ConsumerState { width: 48, decoration: BoxDecoration( borderRadius: BorderRadius.circular(24), - color: CFColors.textFieldActive, + color: StackTheme.instance.color.textFieldActiveBG, ), child: Center( child: _contact.emojiChar == null @@ -280,23 +268,21 @@ class _ContactDetailsViewState extends ConsumerState { arguments: _contact.id, ); }, - style: ButtonStyle( - minimumSize: - MaterialStateProperty.all(const Size(46, 32)), - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context)! + .copyWith( + minimumSize: MaterialStateProperty.all( + const Size(46, 32)), + ), child: Padding( padding: const EdgeInsets.symmetric(horizontal: 12), child: Row( children: [ - SvgPicture.asset( - Assets.svg.pencil, - width: 10, - height: 10, - color: CFColors.stackAccent, - ), + SvgPicture.asset(Assets.svg.pencil, + width: 10, + height: 10, + color: + StackTheme.instance.color.accentColorDark), const SizedBox( width: 4, ), @@ -391,14 +377,14 @@ class _ContactDetailsViewState extends ConsumerState { ); }, child: RoundedContainer( - color: CFColors.fieldGray, + color: StackTheme + .instance.color.textFieldDefaultBG, padding: const EdgeInsets.all(4), - child: SvgPicture.asset( - Assets.svg.pencil, - width: 12, - height: 12, - color: CFColors.stackAccent, - ), + child: SvgPicture.asset(Assets.svg.pencil, + width: 12, + height: 12, + color: StackTheme + .instance.color.accentColorDark), ), ), const SizedBox( @@ -417,14 +403,14 @@ class _ContactDetailsViewState extends ConsumerState { ); }, child: RoundedContainer( - color: CFColors.fieldGray, + color: StackTheme + .instance.color.textFieldDefaultBG, padding: const EdgeInsets.all(4), - child: SvgPicture.asset( - Assets.svg.copy, - width: 12, - height: 12, - color: CFColors.stackAccent, - ), + child: SvgPicture.asset(Assets.svg.copy, + width: 12, + height: 12, + color: StackTheme + .instance.color.accentColorDark), ), ), ], diff --git a/lib/pages/address_book_views/subviews/contact_popup.dart b/lib/pages/address_book_views/subviews/contact_popup.dart index b1a926e33..b8e1e735a 100644 --- a/lib/pages/address_book_views/subviews/contact_popup.dart +++ b/lib/pages/address_book_views/subviews/contact_popup.dart @@ -10,11 +10,11 @@ import 'package:stackwallet/providers/exchange/exchange_flow_is_active_state_pro import 'package:stackwallet/providers/global/address_book_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:tuple/tuple.dart'; @@ -71,7 +71,7 @@ class ContactPopUp extends ConsumerWidget { ), child: Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( 20, ), @@ -98,7 +98,8 @@ class ContactPopUp extends ConsumerWidget { width: 32, height: 32, decoration: BoxDecoration( - color: CFColors.contactIconBackground, + color: StackTheme + .instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular(32), ), child: contact.id == "default" @@ -138,15 +139,14 @@ class ContactPopUp extends ConsumerWidget { arguments: contact.id, ); }, - style: ButtonStyle( - minimumSize: - MaterialStateProperty.all( - const Size(46, 32)), - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context)! + .copyWith( + minimumSize: + MaterialStateProperty.all< + Size>(const Size(46, 32)), + ), child: Padding( padding: const EdgeInsets.symmetric( horizontal: 18), @@ -162,7 +162,7 @@ class ContactPopUp extends ConsumerWidget { ), Container( height: 1, - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, ), if (addresses.isEmpty) Padding( @@ -254,14 +254,15 @@ class ContactPopUp extends ConsumerWidget { ); }, child: RoundedContainer( - color: CFColors.fieldGray, + color: StackTheme.instance.color + .textFieldDefaultBG, padding: const EdgeInsets.all(4), child: SvgPicture.asset( - Assets.svg.copy, - width: 12, - height: 12, - color: CFColors.stackAccent, - ), + Assets.svg.copy, + width: 12, + height: 12, + color: StackTheme.instance + .color.accentColorDark), ), ), ], @@ -304,15 +305,17 @@ class ContactPopUp extends ConsumerWidget { } }, child: RoundedContainer( - color: CFColors.fieldGray, + color: StackTheme.instance.color + .textFieldDefaultBG, padding: const EdgeInsets.all(4), child: SvgPicture.asset( - Assets.svg.circleArrowUpRight, - width: 12, - height: 12, - color: CFColors.stackAccent, - ), + Assets + .svg.circleArrowUpRight, + width: 12, + height: 12, + color: StackTheme.instance + .color.accentColorDark), ), ), ], diff --git a/lib/pages/address_book_views/subviews/edit_contact_address_view.dart b/lib/pages/address_book_views/subviews/edit_contact_address_view.dart index fc67f064c..fb4527f27 100644 --- a/lib/pages/address_book_views/subviews/edit_contact_address_view.dart +++ b/lib/pages/address_book_views/subviews/edit_contact_address_view.dart @@ -9,9 +9,9 @@ import 'package:stackwallet/providers/ui/address_book_providers/address_entry_da import 'package:stackwallet/providers/ui/address_book_providers/valid_contact_state_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; class EditContactAddressView extends ConsumerStatefulWidget { @@ -60,7 +60,7 @@ class _EditContactAddressViewState .select((value) => value.getContactById(contactId))); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -103,7 +103,8 @@ class _EditContactAddressViewState width: 48, decoration: BoxDecoration( borderRadius: BorderRadius.circular(24), - color: CFColors.textFieldActive, + color: + StackTheme.instance.color.textFieldActiveBG, ), child: Center( child: contact.emojiChar == null @@ -179,17 +180,13 @@ class _EditContactAddressViewState children: [ Expanded( child: TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -213,14 +210,13 @@ class _EditContactAddressViewState ref.watch(validContactStateProvider([0])); return TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - shouldEnableSave - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: shouldEnableSave + ? StackTheme.instance + .getPrimaryEnabledButtonColor( + context) + : StackTheme.instance + .getPrimaryDisabledButtonColor( + context), onPressed: shouldEnableSave ? () async { if (FocusScope.of(context) diff --git a/lib/pages/address_book_views/subviews/edit_contact_name_emoji_view.dart b/lib/pages/address_book_views/subviews/edit_contact_name_emoji_view.dart index d8c4f7708..bc9b2a5b2 100644 --- a/lib/pages/address_book_views/subviews/edit_contact_name_emoji_view.dart +++ b/lib/pages/address_book_views/subviews/edit_contact_name_emoji_view.dart @@ -4,9 +4,9 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/global/address_book_service_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/emoji_select_sheet.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; @@ -68,7 +68,7 @@ class _EditContactNameEmojiViewState .select((value) => value.getContactById(contactId))); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -139,7 +139,8 @@ class _EditContactNameEmojiViewState width: 48, decoration: BoxDecoration( borderRadius: BorderRadius.circular(24), - color: CFColors.textFieldActive, + color: StackTheme + .instance.color.textFieldActiveBG, ), child: Center( child: _selectedEmoji == null @@ -160,20 +161,22 @@ class _EditContactNameEmojiViewState height: 14, width: 14, decoration: BoxDecoration( - borderRadius: BorderRadius.circular(14), - color: CFColors.stackAccent, - ), + borderRadius: BorderRadius.circular(14), + color: StackTheme + .instance.color.accentColorDark), child: Center( child: _selectedEmoji == null ? SvgPicture.asset( Assets.svg.plus, - color: CFColors.white, + color: StackTheme + .instance.color.textWhite, width: 12, height: 12, ) : SvgPicture.asset( Assets.svg.thickX, - color: CFColors.white, + color: StackTheme + .instance.color.textWhite, width: 8, height: 8, ), @@ -230,17 +233,13 @@ class _EditContactNameEmojiViewState children: [ Expanded( child: TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -264,14 +263,13 @@ class _EditContactNameEmojiViewState nameController.text.isNotEmpty; return TextButton( - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - shouldEnableSave - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: shouldEnableSave + ? StackTheme.instance + .getPrimaryEnabledButtonColor( + context) + : StackTheme.instance + .getPrimaryDisabledButtonColor( + context), onPressed: shouldEnableSave ? () async { if (FocusScope.of(context) diff --git a/lib/pages/address_book_views/subviews/new_contact_address_entry_form.dart b/lib/pages/address_book_views/subviews/new_contact_address_entry_form.dart index 568222870..4736b20c5 100644 --- a/lib/pages/address_book_views/subviews/new_contact_address_entry_form.dart +++ b/lib/pages/address_book_views/subviews/new_contact_address_entry_form.dart @@ -8,12 +8,13 @@ import 'package:stackwallet/providers/ui/address_book_providers/address_entry_da import 'package:stackwallet/utilities/address_utils.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/icon_widgets/clipboard_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/qrcode_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; @@ -80,7 +81,7 @@ class _NewContactAddressEntryFormState child: Padding( padding: const EdgeInsets.symmetric(horizontal: 12), child: RawMaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -134,7 +135,7 @@ class _NewContactAddressEntryFormState Assets.svg.chevronDown, width: 8, height: 4, - color: CFColors.gray3, + color: StackTheme.instance.color.textSubtitle2, ), ], ), @@ -352,7 +353,7 @@ class _NewContactAddressEntryFormState "Invalid address", textAlign: TextAlign.left, style: STextStyles.label.copyWith( - color: CFColors.notificationRedForeground, + color: StackTheme.instance.color.textError, ), ), ], diff --git a/lib/pages/exchange_view/confirm_change_now_send.dart b/lib/pages/exchange_view/confirm_change_now_send.dart index dc15457e2..5209d6fd6 100644 --- a/lib/pages/exchange_view/confirm_change_now_send.dart +++ b/lib/pages/exchange_view/confirm_change_now_send.dart @@ -1,3 +1,5 @@ +import 'dart:async'; + import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/models/exchange/change_now/exchange_transaction.dart'; @@ -8,10 +10,10 @@ import 'package:stackwallet/pages/wallet_view/wallet_view.dart'; import 'package:stackwallet/providers/exchange/trade_sent_from_stack_lookup_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/route_generator.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -47,14 +49,14 @@ class _ConfirmChangeNowSendViewState late final ExchangeTransaction trade; Future _attemptSend(BuildContext context) async { - showDialog( + unawaited(showDialog( context: context, useSafeArea: false, barrierDismissible: false, builder: (context) { return const SendingTransactionDialog(); }, - ); + )); final String note = transactionInfo["note"] as String? ?? ""; final manager = @@ -62,10 +64,10 @@ class _ConfirmChangeNowSendViewState try { final txid = await manager.confirmSend(txData: transactionInfo); - manager.refresh(); + unawaited(manager.refresh()); // save note - ref + await ref .read(notesServiceChangeNotifierProvider(walletId)) .editOrAddNote(txid: txid, note: note); @@ -86,7 +88,7 @@ class _ConfirmChangeNowSendViewState // pop sending dialog Navigator.of(context).pop(); - showDialog( + await showDialog( context: context, useSafeArea: false, barrierDismissible: true, @@ -95,15 +97,12 @@ class _ConfirmChangeNowSendViewState title: "Broadcast transaction failed", message: e.toString(), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: + StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Ok", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.buttonTextSecondary, ), ), onPressed: () { @@ -131,7 +130,7 @@ class _ConfirmChangeNowSendViewState .select((value) => value.getManagerProvider(walletId))); return Scaffold( appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { // if (FocusScope.of(context).hasFocus) { @@ -317,7 +316,7 @@ class _ConfirmChangeNowSendViewState height: 12, ), RoundedContainer( - color: CFColors.stackGreen15, + color: StackTheme.instance.color.snackBarBackSuccess, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ @@ -348,13 +347,8 @@ class _ConfirmChangeNowSendViewState ), const Spacer(), TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), onPressed: () async { final unlocked = await Navigator.push( context, @@ -378,7 +372,7 @@ class _ConfirmChangeNowSendViewState ); if (unlocked is bool && unlocked && mounted) { - _attemptSend(context); + await _attemptSend(context); } }, child: Text( diff --git a/lib/pages/exchange_view/edit_trade_note_view.dart b/lib/pages/exchange_view/edit_trade_note_view.dart index 457b0e6bc..db166b01c 100644 --- a/lib/pages/exchange_view/edit_trade_note_view.dart +++ b/lib/pages/exchange_view/edit_trade_note_view.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/exchange/trade_note_service_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/stack_text_field.dart'; @@ -46,9 +46,9 @@ class _EditNoteViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -126,13 +126,8 @@ class _EditNoteViewState extends ConsumerState { Navigator.of(context).pop(); } }, - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Save", style: STextStyles.button, diff --git a/lib/pages/exchange_view/exchange_coin_selection/fixed_rate_pair_coin_selection_view.dart b/lib/pages/exchange_view/exchange_coin_selection/fixed_rate_pair_coin_selection_view.dart index 7741d1d54..f660e362e 100644 --- a/lib/pages/exchange_view/exchange_coin_selection/fixed_rate_pair_coin_selection_view.dart +++ b/lib/pages/exchange_view/exchange_coin_selection/fixed_rate_pair_coin_selection_view.dart @@ -4,10 +4,10 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/models/exchange/change_now/currency.dart'; import 'package:stackwallet/models/exchange/change_now/fixed_rate_market.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; @@ -119,7 +119,7 @@ class _FixedRateMarketPairCoinSelectionViewState @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -232,12 +232,12 @@ class _FixedRateMarketPairCoinSelectionViewState child: Row( children: [ SizedBox( - width: 20, - height: 20, + width: 24, + height: 24, child: SvgPicture.network( tuple.item1, - width: 20, - height: 20, + width: 24, + height: 24, placeholderBuilder: (_) => const LoadingIndicator(), ), @@ -245,9 +245,26 @@ class _FixedRateMarketPairCoinSelectionViewState const SizedBox( width: 10, ), - Text( - "${tuple.item2} / ${ticker.toUpperCase()}", - style: STextStyles.titleBold12, + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + tuple.item2, + style: STextStyles.largeMedium14, + ), + const SizedBox( + height: 2, + ), + Text( + ticker.toUpperCase(), + style: STextStyles.smallMed12.copyWith( + color: StackTheme + .instance.color.textSubtitle1, + ), + ), + ], + ), ), ], ), @@ -289,12 +306,12 @@ class _FixedRateMarketPairCoinSelectionViewState child: Row( children: [ SizedBox( - width: 20, - height: 20, + width: 24, + height: 24, child: SvgPicture.network( tuple.item1, - width: 20, - height: 20, + width: 24, + height: 24, placeholderBuilder: (_) => const LoadingIndicator(), ), @@ -302,9 +319,26 @@ class _FixedRateMarketPairCoinSelectionViewState const SizedBox( width: 10, ), - Text( - "${tuple.item2} / ${ticker.toUpperCase()}", - style: STextStyles.titleBold12, + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + tuple.item2, + style: STextStyles.largeMedium14, + ), + const SizedBox( + height: 2, + ), + Text( + ticker.toUpperCase(), + style: STextStyles.smallMed12.copyWith( + color: StackTheme + .instance.color.textSubtitle1, + ), + ), + ], + ), ), ], ), diff --git a/lib/pages/exchange_view/exchange_coin_selection/floating_rate_currency_selection_view.dart b/lib/pages/exchange_view/exchange_coin_selection/floating_rate_currency_selection_view.dart index 94f7c039b..522e0e041 100644 --- a/lib/pages/exchange_view/exchange_coin_selection/floating_rate_currency_selection_view.dart +++ b/lib/pages/exchange_view/exchange_coin_selection/floating_rate_currency_selection_view.dart @@ -2,10 +2,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/models/exchange/change_now/currency.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; @@ -75,7 +75,7 @@ class _FloatingRateCurrencySelectionViewState @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -139,6 +139,7 @@ class _FloatingRateCurrencySelectionViewState setState(() { _searchController.text = ""; }); + filter(""); }, ), ], @@ -183,12 +184,12 @@ class _FloatingRateCurrencySelectionViewState child: Row( children: [ SizedBox( - width: 20, - height: 20, + width: 24, + height: 24, child: SvgPicture.network( items[index].image, - width: 20, - height: 20, + width: 24, + height: 24, placeholderBuilder: (_) => const LoadingIndicator(), ), @@ -196,9 +197,26 @@ class _FloatingRateCurrencySelectionViewState const SizedBox( width: 10, ), - Text( - "${items[index].name} / ${items[index].ticker.toUpperCase()}", - style: STextStyles.titleBold12, + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + items[index].name, + style: STextStyles.largeMedium14, + ), + const SizedBox( + height: 2, + ), + Text( + items[index].ticker.toUpperCase(), + style: STextStyles.smallMed12.copyWith( + color: StackTheme + .instance.color.textSubtitle1, + ), + ), + ], + ), ), ], ), @@ -236,12 +254,12 @@ class _FloatingRateCurrencySelectionViewState child: Row( children: [ SizedBox( - width: 20, - height: 20, + width: 24, + height: 24, child: SvgPicture.network( _currencies[index].image, - width: 20, - height: 20, + width: 24, + height: 24, placeholderBuilder: (_) => const LoadingIndicator(), ), @@ -249,9 +267,26 @@ class _FloatingRateCurrencySelectionViewState const SizedBox( width: 10, ), - Text( - "${_currencies[index].name} / ${_currencies[index].ticker.toUpperCase()}", - style: STextStyles.titleBold12, + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + _currencies[index].name, + style: STextStyles.largeMedium14, + ), + const SizedBox( + height: 2, + ), + Text( + _currencies[index].ticker.toUpperCase(), + style: STextStyles.smallMed12.copyWith( + color: StackTheme + .instance.color.textSubtitle1, + ), + ), + ], + ), ), ], ), diff --git a/lib/pages/exchange_view/exchange_loading_overlay.dart b/lib/pages/exchange_view/exchange_loading_overlay.dart index 28484022a..ad05fea5a 100644 --- a/lib/pages/exchange_view/exchange_loading_overlay.dart +++ b/lib/pages/exchange_view/exchange_loading_overlay.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/exchange/changenow_initial_load_status.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -65,7 +65,7 @@ class _ExchangeLoadingOverlayViewState if (_statusEst == ChangeNowLoadStatus.loading || (_statusFixed == ChangeNowLoadStatus.loading && userReloaded)) Container( - color: CFColors.stackAccent.withOpacity(0.7), + color: StackTheme.instance.color.overlay.withOpacity(0.7), child: const CustomLoadingOverlay( message: "Loading ChangeNOW data", eventBus: null), ), @@ -74,7 +74,7 @@ class _ExchangeLoadingOverlayViewState _statusEst != ChangeNowLoadStatus.loading && _statusFixed != ChangeNowLoadStatus.loading) Container( - color: CFColors.stackAccent.withOpacity(0.7), + color: StackTheme.instance.color.overlay.withOpacity(0.7), child: Column( mainAxisAlignment: MainAxisAlignment.end, children: [ @@ -83,10 +83,13 @@ class _ExchangeLoadingOverlayViewState message: "ChangeNOW requires a working internet connection. Tap OK to try fetching again.", rightButton: TextButton( + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "OK", - style: STextStyles.button - .copyWith(color: CFColors.stackAccent), + style: STextStyles.button.copyWith( + color: StackTheme.instance.color.buttonTextSecondary, + ), ), onPressed: () { userReloaded = true; diff --git a/lib/pages/exchange_view/exchange_step_views/step_1_view.dart b/lib/pages/exchange_view/exchange_step_views/step_1_view.dart index 32a5a4205..072c4b536 100644 --- a/lib/pages/exchange_view/exchange_step_views/step_1_view.dart +++ b/lib/pages/exchange_view/exchange_step_views/step_1_view.dart @@ -3,9 +3,9 @@ import 'package:stackwallet/models/exchange/incomplete_exchange.dart'; import 'package:stackwallet/pages/exchange_view/exchange_step_views/step_2_view.dart'; import 'package:stackwallet/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart'; import 'package:stackwallet/pages/exchange_view/sub_widgets/step_row.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -40,7 +40,7 @@ class _Step1ViewState extends State { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -102,11 +102,15 @@ class _Step1ViewState extends State { children: [ Text( "You send", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: + StackTheme.instance.color.infoItemText), ), Text( - "${model.sendAmount.toStringAsFixed(8)} ${model.sendTicker}", - style: STextStyles.itemSubtitle12, + "${model.sendAmount.toStringAsFixed(8)} ${model.sendTicker.toUpperCase()}", + style: STextStyles.itemSubtitle12.copyWith( + color: + StackTheme.instance.color.infoItemText), ), ], ), @@ -120,11 +124,15 @@ class _Step1ViewState extends State { children: [ Text( "You receive", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: + StackTheme.instance.color.infoItemText), ), Text( - "~${model.receiveAmount.toStringAsFixed(8)} ${model.receiveTicker}", - style: STextStyles.itemSubtitle12, + "~${model.receiveAmount.toStringAsFixed(8)} ${model.receiveTicker.toUpperCase()}", + style: STextStyles.itemSubtitle12.copyWith( + color: + StackTheme.instance.color.infoItemText), ), ], ), @@ -140,11 +148,16 @@ class _Step1ViewState extends State { model.rateType == ExchangeRateType.estimated ? "Estimated rate" : "Fixed rate", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: + StackTheme.instance.color.infoItemLabel, + ), ), Text( model.rateInfo, - style: STextStyles.itemSubtitle12, + style: STextStyles.itemSubtitle12.copyWith( + color: + StackTheme.instance.color.infoItemText), ), ], ), @@ -158,13 +171,8 @@ class _Step1ViewState extends State { Navigator.of(context).pushNamed(Step2View.routeName, arguments: model); }, - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Next", style: STextStyles.button, diff --git a/lib/pages/exchange_view/exchange_step_views/step_2_view.dart b/lib/pages/exchange_view/exchange_step_views/step_2_view.dart index 57e10f0eb..131242b98 100644 --- a/lib/pages/exchange_view/exchange_step_views/step_2_view.dart +++ b/lib/pages/exchange_view/exchange_step_views/step_2_view.dart @@ -10,12 +10,12 @@ import 'package:stackwallet/providers/exchange/exchange_send_from_wallet_id_prov import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/address_utils.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/addressbook_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/clipboard_icon.dart'; @@ -95,7 +95,7 @@ class _Step2ViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -156,9 +156,7 @@ class _Step2ViewState extends ConsumerState { children: [ Text( "Recipient Wallet", - style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, - ), + style: STextStyles.smallMed12, ), // GestureDetector( // onTap: () { @@ -198,7 +196,7 @@ class _Step2ViewState extends ConsumerState { focusNode: _toFocusNode, style: STextStyles.field, decoration: standardInputDecoration( - "Enter the ${model.receiveTicker} payout address", + "Enter the ${model.receiveTicker.toUpperCase()} payout address", _toFocusNode, ).copyWith( contentPadding: const EdgeInsets.only( @@ -335,7 +333,7 @@ class _Step2ViewState extends ConsumerState { ), RoundedWhiteContainer( child: Text( - "This is the wallet where your ${model.receiveTicker} will be sent to.", + "This is the wallet where your ${model.receiveTicker.toUpperCase()} will be sent to.", style: STextStyles.label, ), ), @@ -386,7 +384,7 @@ class _Step2ViewState extends ConsumerState { focusNode: _refundFocusNode, style: STextStyles.field, decoration: standardInputDecoration( - "Enter ${model.sendTicker} refund address", + "Enter ${model.sendTicker.toUpperCase()} refund address", _refundFocusNode, ).copyWith( contentPadding: const EdgeInsets.only( @@ -537,10 +535,13 @@ class _Step2ViewState extends ConsumerState { onPressed: () { Navigator.of(context).pop(); }, + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Back", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.buttonTextSecondary, ), ), ), @@ -558,15 +559,8 @@ class _Step2ViewState extends ConsumerState { Step3View.routeName, arguments: model); }, - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Next", style: STextStyles.button, diff --git a/lib/pages/exchange_view/exchange_step_views/step_3_view.dart b/lib/pages/exchange_view/exchange_step_views/step_3_view.dart index a0c79343f..a8116dd42 100644 --- a/lib/pages/exchange_view/exchange_step_views/step_3_view.dart +++ b/lib/pages/exchange_view/exchange_step_views/step_3_view.dart @@ -12,9 +12,9 @@ import 'package:stackwallet/providers/exchange/change_now_provider.dart'; import 'package:stackwallet/providers/global/trades_service_provider.dart'; import 'package:stackwallet/services/notifications_api.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -50,7 +50,7 @@ class _Step3ViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -108,7 +108,7 @@ class _Step3ViewState extends ConsumerState { ), const Spacer(), Text( - "${model.sendAmount.toString()} ${model.sendTicker}", + "${model.sendAmount.toString()} ${model.sendTicker.toUpperCase()}", style: STextStyles.itemSubtitle12, ) ], @@ -126,7 +126,7 @@ class _Step3ViewState extends ConsumerState { ), const Spacer(), Text( - "${model.receiveAmount.toString()} ${model.receiveTicker}", + "${model.receiveAmount.toString()} ${model.receiveTicker.toUpperCase()}", style: STextStyles.itemSubtitle12, ) ], @@ -158,7 +158,7 @@ class _Step3ViewState extends ConsumerState { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - "Recipient ${model.receiveTicker} address", + "Recipient ${model.receiveTicker.toUpperCase()} address", style: STextStyles.itemSubtitle, ), const SizedBox( @@ -179,7 +179,7 @@ class _Step3ViewState extends ConsumerState { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - "Refund ${model.sendTicker} address", + "Refund ${model.sendTicker.toUpperCase()} address", style: STextStyles.itemSubtitle, ), const SizedBox( @@ -203,10 +203,13 @@ class _Step3ViewState extends ConsumerState { onPressed: () { Navigator.of(context).pop(); }, + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Back", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.buttonTextSecondary, ), ), ), @@ -303,15 +306,8 @@ class _Step3ViewState extends ConsumerState { )); } }, - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Next", style: STextStyles.button, diff --git a/lib/pages/exchange_view/exchange_step_views/step_4_view.dart b/lib/pages/exchange_view/exchange_step_views/step_4_view.dart index 91c3f1a6d..b94f29cbe 100644 --- a/lib/pages/exchange_view/exchange_step_views/step_4_view.dart +++ b/lib/pages/exchange_view/exchange_step_views/step_4_view.dart @@ -18,13 +18,13 @@ import 'package:stackwallet/providers/exchange/exchange_send_from_wallet_id_prov import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/fee_rate_type_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -114,7 +114,7 @@ class _Step4ViewState extends ConsumerState { final bool isWalletCoin = _isWalletCoinAndHasWallet(model.trade!.fromCurrency, ref); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -157,27 +157,27 @@ class _Step4ViewState extends ConsumerState { height: 14, ), Text( - "Send ${model.sendTicker} to the address below", + "Send ${model.sendTicker.toUpperCase()} to the address below", style: STextStyles.pageTitleH1, ), const SizedBox( height: 8, ), Text( - "Send ${model.sendTicker} to the address below. Once it is received, ChangeNOW will send the ${model.receiveTicker} to the recipient address you provided. You can find this trade details and check its status in the list of trades.", + "Send ${model.sendTicker.toUpperCase()} to the address below. Once it is received, ChangeNOW will send the ${model.receiveTicker.toUpperCase()} to the recipient address you provided. You can find this trade details and check its status in the list of trades.", style: STextStyles.itemSubtitle, ), const SizedBox( height: 12, ), RoundedContainer( - color: CFColors.warningBackground, + color: StackTheme.instance.color.warningBackground, child: RichText( text: TextSpan( text: "You must send at least ${model.sendAmount.toString()} ${model.sendTicker}. ", style: STextStyles.label.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w700, ), children: [ @@ -185,7 +185,7 @@ class _Step4ViewState extends ConsumerState { text: "If you send less than ${model.sendAmount.toString()} ${model.sendTicker}, your transaction may not be converted and it may not be refunded.", style: STextStyles.label.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w500, ), ), @@ -206,9 +206,7 @@ class _Step4ViewState extends ConsumerState { children: [ Text( "Amount", - style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, - ), + style: STextStyles.itemSubtitle, ), GestureDetector( onTap: () async { @@ -225,7 +223,8 @@ class _Step4ViewState extends ConsumerState { children: [ SvgPicture.asset( Assets.svg.copy, - color: CFColors.link2, + color: StackTheme + .instance.color.infoItemIcons, width: 10, ), const SizedBox( @@ -244,7 +243,7 @@ class _Step4ViewState extends ConsumerState { height: 4, ), Text( - "${model.sendAmount.toString()} ${model.sendTicker}", + "${model.sendAmount.toString()} ${model.sendTicker.toUpperCase()}", style: STextStyles.itemSubtitle12, ), ], @@ -262,10 +261,8 @@ class _Step4ViewState extends ConsumerState { MainAxisAlignment.spaceBetween, children: [ Text( - "Send ${model.sendTicker} to this address", - style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, - ), + "Send ${model.sendTicker.toUpperCase()} to this address", + style: STextStyles.itemSubtitle, ), GestureDetector( onTap: () async { @@ -282,7 +279,8 @@ class _Step4ViewState extends ConsumerState { children: [ SvgPicture.asset( Assets.svg.copy, - color: CFColors.link2, + color: StackTheme + .instance.color.infoItemIcons, width: 10, ), const SizedBox( @@ -340,7 +338,8 @@ class _Step4ViewState extends ConsumerState { }, child: SvgPicture.asset( Assets.svg.copy, - color: CFColors.link2, + color: StackTheme + .instance.color.infoItemIcons, width: 12, ), ) @@ -358,14 +357,13 @@ class _Step4ViewState extends ConsumerState { children: [ Text( "Status", - style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, - ), + style: STextStyles.itemSubtitle, ), Text( _statusString, style: STextStyles.itemSubtitle.copyWith( - color: CFColors.status.forStatus(_status), + color: StackTheme.instance + .colorForStatus(_status), ), ), ], @@ -405,7 +403,8 @@ class _Step4ViewState extends ConsumerState { .size .width / 2, - foregroundColor: CFColors.stackAccent, + foregroundColor: StackTheme + .instance.color.accentColorDark, ), ), const SizedBox( @@ -418,11 +417,17 @@ class _Step4ViewState extends ConsumerState { child: TextButton( onPressed: () => Navigator.of(context).pop(), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance + .color + .buttonTextSecondary, ), ), ), @@ -435,13 +440,8 @@ class _Step4ViewState extends ConsumerState { }, ); }, - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Show QR Code", style: STextStyles.button, @@ -562,22 +562,17 @@ class _Step4ViewState extends ConsumerState { title: "Transaction failed", message: e.toString(), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty - .all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Ok", style: STextStyles.button .copyWith( - color: - CFColors.stackAccent, + color: StackTheme + .instance + .color + .buttonTextSecondary, ), ), onPressed: () { @@ -614,10 +609,13 @@ class _Step4ViewState extends ConsumerState { ), ); }, + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( buttonTitle, style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.buttonTextSecondary, ), ), ); diff --git a/lib/pages/exchange_view/exchange_view.dart b/lib/pages/exchange_view/exchange_view.dart index b95315359..4222fa665 100644 --- a/lib/pages/exchange_view/exchange_view.dart +++ b/lib/pages/exchange_view/exchange_view.dart @@ -29,10 +29,10 @@ import 'package:stackwallet/providers/exchange/trade_sent_from_stack_lookup_prov import 'package:stackwallet/providers/global/trades_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -66,7 +66,7 @@ class _ExchangeViewState extends ConsumerState { builder: (_) => WillPopScope( onWillPop: () async => false, child: Container( - color: CFColors.stackAccent.withOpacity(0.8), + color: StackTheme.instance.color.overlay.withOpacity(0.8), child: const CustomLoadingOverlay( message: "Updating exchange rate", eventBus: null, @@ -367,7 +367,7 @@ class _ExchangeViewState extends ConsumerState { Text( "You will send", style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), const SizedBox( @@ -561,7 +561,10 @@ class _ExchangeViewState extends ConsumerState { width: 18, height: 18, decoration: BoxDecoration( - color: CFColors.gray3, + color: StackTheme + .instance + .color + .textFieldDefaultBG, borderRadius: BorderRadius.circular( 18, @@ -583,7 +586,7 @@ class _ExchangeViewState extends ConsumerState { width: 18, height: 18, decoration: BoxDecoration( - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark borderRadius: BorderRadius.circular(18), ), @@ -591,7 +594,8 @@ class _ExchangeViewState extends ConsumerState { Assets.svg.circleQuestion, width: 18, height: 18, - color: CFColors.gray3, + color: StackTheme.instance + .color.textFieldDefaultBG, ), ); } @@ -616,7 +620,8 @@ class _ExchangeViewState extends ConsumerState { .toUpperCase())) ?? "-", style: STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.textDark, ), ), const SizedBox( @@ -626,7 +631,8 @@ class _ExchangeViewState extends ConsumerState { Assets.svg.chevronDown, width: 5, height: 2.5, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.textDark, ), ], ), @@ -647,7 +653,7 @@ class _ExchangeViewState extends ConsumerState { child: Text( "You will receive", style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), ), @@ -663,6 +669,8 @@ class _ExchangeViewState extends ConsumerState { Assets.svg.swap, width: 20, height: 20, + color: + StackTheme.instance.color.accentColorDark, ), ), ), @@ -874,7 +882,10 @@ class _ExchangeViewState extends ConsumerState { width: 18, height: 18, decoration: BoxDecoration( - color: CFColors.gray3, + color: StackTheme + .instance + .color + .textFieldDefaultBG, borderRadius: BorderRadius.circular( 18), @@ -895,7 +906,7 @@ class _ExchangeViewState extends ConsumerState { width: 18, height: 18, decoration: BoxDecoration( - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark borderRadius: BorderRadius.circular(18), ), @@ -903,7 +914,8 @@ class _ExchangeViewState extends ConsumerState { Assets.svg.circleQuestion, width: 18, height: 18, - color: CFColors.gray3, + color: StackTheme.instance + .color.textFieldDefaultBG, ), ); } @@ -928,7 +940,8 @@ class _ExchangeViewState extends ConsumerState { .toUpperCase())) ?? "-", style: STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.textDark, ), ), const SizedBox( @@ -938,7 +951,8 @@ class _ExchangeViewState extends ConsumerState { Assets.svg.chevronDown, width: 5, height: 2.5, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.textDark, ), ], ), @@ -1117,28 +1131,18 @@ class _ExchangeViewState extends ConsumerState { height: 12, ), TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - ((ref - .read( - prefsChangeNotifierProvider) - .exchangeRateType == - ExchangeRateType.estimated) - ? ref.watch( - estimatedRateExchangeFormProvider - .select((value) => - value.canExchange)) - : ref.watch( - fixedRateExchangeFormProvider - .select((value) => - value.canExchange))) - ? CFColors.stackAccent - : CFColors.buttonGray, - ), - ), + style: ((ref + .read(prefsChangeNotifierProvider) + .exchangeRateType == + ExchangeRateType.estimated) + ? ref.watch(estimatedRateExchangeFormProvider + .select((value) => value.canExchange)) + : ref.watch(fixedRateExchangeFormProvider + .select((value) => value.canExchange))) + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: ((ref .read(prefsChangeNotifierProvider) .exchangeRateType == @@ -1303,16 +1307,9 @@ class _ExchangeViewState extends ConsumerState { message: "${response.value!.warningMessage!}\n\nDo you want to attempt trade anyways?", leftButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, @@ -1323,16 +1320,9 @@ class _ExchangeViewState extends ConsumerState { }, ), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor( + context), child: Text( "Attempt", style: STextStyles.button, @@ -1351,7 +1341,7 @@ class _ExchangeViewState extends ConsumerState { } String rate = - "1 $fromTicker ~${ref.read(fixedRateExchangeFormProvider).rate!.toStringAsFixed(8)} $toTicker"; + "1 ${fromTicker.toUpperCase()} ~${ref.read(fixedRateExchangeFormProvider).rate!.toStringAsFixed(8)} ${toTicker.toUpperCase()}"; final model = IncompleteExchangeModel( sendTicker: fromTicker, @@ -1388,7 +1378,7 @@ class _ExchangeViewState extends ConsumerState { // Text( // "Trades", // style: STextStyles.itemSubtitle.copyWith( - // color: CFColors.neutral50, + // color: StackTheme.instance.color.textDark3, // ), // ), // SizedBox( @@ -1428,7 +1418,7 @@ class _ExchangeViewState extends ConsumerState { Text( "Trades", style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), const SizedBox( @@ -1471,6 +1461,7 @@ class _ExchangeViewState extends ConsumerState { debugPrint("name: ${manager.walletName}"); + // TODO store tx data completely locally in isar so we don't lock up ui here when querying txData final txData = await manager.transactionData; final tx = txData.getAllTransactions()[txid]; @@ -1500,7 +1491,7 @@ class _ExchangeViewState extends ConsumerState { padding: const EdgeInsets.symmetric(horizontal: 4), child: Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -1542,7 +1533,7 @@ class RateInfo extends ConsumerWidget { return Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -1630,7 +1621,7 @@ class RateInfo extends ConsumerWidget { Assets.svg.chevronDown, width: 5, height: 2.5, - color: CFColors.neutral60, + color: StackTheme.instance.color.infoItemLabel, ), ], ), diff --git a/lib/pages/exchange_view/send_from_view.dart b/lib/pages/exchange_view/send_from_view.dart index e50796e75..9bc42e174 100644 --- a/lib/pages/exchange_view/send_from_view.dart +++ b/lib/pages/exchange_view/send_from_view.dart @@ -1,3 +1,5 @@ +import 'dart:async'; + import 'package:decimal/decimal.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; @@ -9,12 +11,12 @@ import 'package:stackwallet/pages/send_view/sub_widgets/building_transaction_dia import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/fee_rate_type_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -58,7 +60,7 @@ class _SendFromViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -159,7 +161,7 @@ class _SendFromCardState extends ConsumerState { return RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: MaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, key: Key("walletsSheetItemButtonKey_$walletId"), padding: const EdgeInsets.all(5), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, @@ -174,7 +176,7 @@ class _SendFromCardState extends ConsumerState { try { bool wasCancelled = false; - showDialog( + unawaited(showDialog( context: context, useSafeArea: false, barrierDismissible: false, @@ -187,7 +189,7 @@ class _SendFromCardState extends ConsumerState { }, ); }, - ); + )); final txData = await manager.prepareSend( address: address, @@ -210,7 +212,7 @@ class _SendFromCardState extends ConsumerState { txData["address"] = address; if (mounted) { - Navigator.of(context).push( + await Navigator.of(context).push( RouteGenerator.getRoute( shouldUseMaterialRoute: RouteGenerator.useMaterialPageRoute, builder: (_) => ConfirmChangeNowSendView( @@ -231,7 +233,7 @@ class _SendFromCardState extends ConsumerState { // pop building dialog Navigator.of(context).pop(); - showDialog( + await showDialog( context: context, useSafeArea: false, barrierDismissible: true, @@ -240,15 +242,12 @@ class _SendFromCardState extends ConsumerState { title: "Transaction failed", message: e.toString(), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Ok", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.buttonTextSecondary, ), ), onPressed: () { @@ -265,7 +264,9 @@ class _SendFromCardState extends ConsumerState { children: [ Container( decoration: BoxDecoration( - color: CFColors.coin.forCoin(manager.coin).withOpacity(0.5), + color: StackTheme.instance + .colorForCoin(manager.coin) + .withOpacity(0.5), borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), diff --git a/lib/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart b/lib/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart index 4a96a6074..9926b2eab 100644 --- a/lib/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart +++ b/lib/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; enum ExchangeRateType { estimated, fixed } @@ -15,9 +15,9 @@ class ExchangeRateSheet extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -35,7 +35,7 @@ class ExchangeRateSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textSubtitle4, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -76,7 +76,8 @@ class ExchangeRateSheet extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: ExchangeRateType.estimated, groupValue: ref.watch(prefsChangeNotifierProvider .select((value) => value.exchangeRateType)), @@ -102,9 +103,7 @@ class ExchangeRateSheet extends ConsumerWidget { children: [ Text( "Estimated rate", - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( @@ -112,7 +111,9 @@ class ExchangeRateSheet extends ConsumerWidget { ), Text( "ChangeNOW will pick the best rate for you during the moment of the exchange.", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ), textAlign: TextAlign.left, ), ], @@ -146,7 +147,8 @@ class ExchangeRateSheet extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: ExchangeRateType.fixed, groupValue: ref.watch(prefsChangeNotifierProvider .select((value) => value.exchangeRateType)), @@ -169,9 +171,7 @@ class ExchangeRateSheet extends ConsumerWidget { children: [ Text( "Fixed rate", - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( @@ -179,7 +179,9 @@ class ExchangeRateSheet extends ConsumerWidget { ), Text( "You will get the exact exchange amount displayed - ChangeNOW takes all the rate risks.", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ), textAlign: TextAlign.left, ) ], diff --git a/lib/pages/exchange_view/sub_widgets/step_indicator.dart b/lib/pages/exchange_view/sub_widgets/step_indicator.dart index c4923a379..9e8cd4dca 100644 --- a/lib/pages/exchange_view/sub_widgets/step_indicator.dart +++ b/lib/pages/exchange_view/sub_widgets/step_indicator.dart @@ -2,7 +2,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter_svg/svg.dart'; import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; enum StepIndicatorStatus { current, completed, incomplete } @@ -22,11 +22,11 @@ class StepIndicator extends StatelessWidget { Color get background { switch (status) { case StepIndicatorStatus.current: - return CFColors.selection; + return StackTheme.instance.color.stepIndicatorBGNumber; case StepIndicatorStatus.completed: - return CFColors.selection; + return StackTheme.instance.color.stepIndicatorBGCheck; case StepIndicatorStatus.incomplete: - return CFColors.stackAccent.withOpacity(0.2); + return StackTheme.instance.color.stepIndicatorBGInactive; } } @@ -38,13 +38,13 @@ class StepIndicator extends StatelessWidget { style: GoogleFonts.roboto( fontWeight: FontWeight.w600, fontSize: 8, - color: CFColors.link2, + color: StackTheme.instance.color.stepIndicatorIconNumber, ), ); case StepIndicatorStatus.completed: return SvgPicture.asset( Assets.svg.check, - color: CFColors.link2, + color: StackTheme.instance.color.stepIndicatorIconText, width: 10, ); case StepIndicatorStatus.incomplete: @@ -53,7 +53,7 @@ class StepIndicator extends StatelessWidget { style: GoogleFonts.roboto( fontWeight: FontWeight.w600, fontSize: 8, - color: CFColors.white, + color: StackTheme.instance.color.stepIndicatorIconInactive, ), ); } diff --git a/lib/pages/exchange_view/sub_widgets/step_row.dart b/lib/pages/exchange_view/sub_widgets/step_row.dart index 5404eb98b..9d2b09451 100644 --- a/lib/pages/exchange_view/sub_widgets/step_row.dart +++ b/lib/pages/exchange_view/sub_widgets/step_row.dart @@ -1,6 +1,6 @@ import 'package:flutter/cupertino.dart'; import 'package:stackwallet/pages/exchange_view/sub_widgets/step_indicator.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class StepRow extends StatelessWidget { const StepRow({ @@ -20,13 +20,13 @@ class StepRow extends StatelessWidget { Color getColor(int index) { if (current >= count - 1) { - return CFColors.stackAccent; + return StackTheme.instance.color.accentColorDark; } if (current <= index) { - return CFColors.stackAccent.withOpacity(0.2); + return StackTheme.instance.color.stepIndicatorBGLinesInactive; } else { - return CFColors.link2; + return StackTheme.instance.color.stepIndicatorBGLines; } } diff --git a/lib/pages/exchange_view/trade_details_view.dart b/lib/pages/exchange_view/trade_details_view.dart index 68b1f49a6..2f293b95e 100644 --- a/lib/pages/exchange_view/trade_details_view.dart +++ b/lib/pages/exchange_view/trade_details_view.dart @@ -17,12 +17,12 @@ import 'package:stackwallet/providers/exchange/trade_note_service_provider.dart' import 'package:stackwallet/providers/global/trades_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -140,9 +140,9 @@ class _TradeDetailsViewState extends ConsumerState { Decimal.parse("-1"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { Navigator.of(context).pop(); @@ -221,9 +221,9 @@ class _TradeDetailsViewState extends ConsumerState { trade.statusObject?.status.name ?? trade.statusString, style: STextStyles.itemSubtitle.copyWith( color: trade.statusObject != null - ? CFColors.status - .forStatus(trade.statusObject!.status) - : CFColors.stackAccent, + ? StackTheme.instance + .colorForStatus(trade.statusObject!.status) + : StackTheme.instance.color.accentColorDark, ), ), // ), @@ -237,7 +237,7 @@ class _TradeDetailsViewState extends ConsumerState { ), if (!sentFromStack && !hasTx) RoundedContainer( - color: CFColors.warningBackground, + color: StackTheme.instance.color.warningBackground, child: RichText( text: TextSpan( text: @@ -245,7 +245,7 @@ class _TradeDetailsViewState extends ConsumerState { trade.fromCurrency.toLowerCase() == "xmr" ? 12 : 8, )} ${trade.fromCurrency.toUpperCase()}. ", style: STextStyles.label.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, fontWeight: FontWeight.w700, ), children: [ @@ -257,7 +257,8 @@ class _TradeDetailsViewState extends ConsumerState { : 8, )} ${trade.fromCurrency.toUpperCase()}, your transaction may not be converted and it may not be refunded.", style: STextStyles.label.copyWith( - color: CFColors.stackAccent, + color: + StackTheme.instance.color.accentColorDark, fontWeight: FontWeight.w500, ), ), @@ -382,12 +383,14 @@ class _TradeDetailsViewState extends ConsumerState { width: width + 20, height: width + 20, child: QrImage( - data: trade.payinAddress, - size: width, - backgroundColor: CFColors.white, - foregroundColor: - CFColors.stackAccent, - ), + data: trade.payinAddress, + size: width, + backgroundColor: StackTheme + .instance.color.popupBG, + foregroundColor: StackTheme + .instance + .color + .accentColorDark), ), ), ), @@ -402,19 +405,17 @@ class _TradeDetailsViewState extends ConsumerState { // await _capturePng(true); Navigator.of(context).pop(); }, - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Cancel", - style: - STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith( + color: StackTheme + .instance + .color + .accentColorDark), ), ), ), @@ -431,7 +432,7 @@ class _TradeDetailsViewState extends ConsumerState { Assets.svg.pencil, width: 10, height: 10, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, ), const SizedBox( width: 4, @@ -478,7 +479,8 @@ class _TradeDetailsViewState extends ConsumerState { Assets.svg.pencil, width: 10, height: 10, - color: CFColors.link2, + color: + StackTheme.instance.color.infoItemIcons, ), const SizedBox( width: 4, @@ -536,7 +538,8 @@ class _TradeDetailsViewState extends ConsumerState { Assets.svg.pencil, width: 10, height: 10, - color: CFColors.link2, + color: + StackTheme.instance.color.infoItemIcons, ), const SizedBox( width: 4, @@ -655,7 +658,7 @@ class _TradeDetailsViewState extends ConsumerState { }, child: SvgPicture.asset( Assets.svg.copy, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, width: 12, ), ) diff --git a/lib/pages/exchange_view/wallet_initiated_exchange_view.dart b/lib/pages/exchange_view/wallet_initiated_exchange_view.dart index 551f8b5d9..126e1e0ec 100644 --- a/lib/pages/exchange_view/wallet_initiated_exchange_view.dart +++ b/lib/pages/exchange_view/wallet_initiated_exchange_view.dart @@ -26,10 +26,10 @@ import 'package:stackwallet/providers/exchange/fixed_rate_exchange_form_provider import 'package:stackwallet/providers/exchange/fixed_rate_market_pairs_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; @@ -81,7 +81,7 @@ class _WalletInitiatedExchangeViewState builder: (_) => WillPopScope( onWillPop: () async => false, child: Container( - color: CFColors.stackAccent.withOpacity(0.8), + color: StackTheme.instance.color.accentColorDark.withOpacity(0.8), child: const CustomLoadingOverlay( message: "Updating exchange rate", eventBus: null, @@ -353,7 +353,7 @@ class _WalletInitiatedExchangeViewState }); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -412,7 +412,7 @@ class _WalletInitiatedExchangeViewState Text( "You will send", style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), const SizedBox( @@ -621,7 +621,10 @@ class _WalletInitiatedExchangeViewState width: 18, height: 18, decoration: BoxDecoration( - color: CFColors.gray3, + color: StackTheme + .instance + .color + .textSubtitle2, borderRadius: BorderRadius .circular( @@ -645,7 +648,7 @@ class _WalletInitiatedExchangeViewState width: 18, height: 18, decoration: BoxDecoration( - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark borderRadius: BorderRadius.circular( 18), @@ -654,7 +657,8 @@ class _WalletInitiatedExchangeViewState Assets.svg.circleQuestion, width: 18, height: 18, - color: CFColors.gray3, + color: StackTheme.instance + .color.textSubtitle2, ), ); } @@ -678,10 +682,10 @@ class _WalletInitiatedExchangeViewState .market?.from .toUpperCase())) ?? "-", - style: - STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.smallMed14 + .copyWith( + color: StackTheme.instance + .color.accentColorDark), ), const SizedBox( width: 6, @@ -705,11 +709,11 @@ class _WalletInitiatedExchangeViewState return Container(); } return SvgPicture.asset( - Assets.svg.chevronDown, - width: 5, - height: 2.5, - color: CFColors.stackAccent, - ); + Assets.svg.chevronDown, + width: 5, + height: 2.5, + color: StackTheme.instance.color + .accentColorDark); }), ], ), @@ -730,7 +734,7 @@ class _WalletInitiatedExchangeViewState child: Text( "You will receive", style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), ), @@ -980,7 +984,10 @@ class _WalletInitiatedExchangeViewState width: 18, height: 18, decoration: BoxDecoration( - color: CFColors.gray3, + color: StackTheme + .instance + .color + .textSubtitle2, borderRadius: BorderRadius .circular(18), @@ -1002,7 +1009,7 @@ class _WalletInitiatedExchangeViewState width: 18, height: 18, decoration: BoxDecoration( - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark borderRadius: BorderRadius.circular( 18), @@ -1011,7 +1018,8 @@ class _WalletInitiatedExchangeViewState Assets.svg.circleQuestion, width: 18, height: 18, - color: CFColors.gray3, + color: StackTheme.instance + .color.textSubtitle2, ), ); } @@ -1035,10 +1043,10 @@ class _WalletInitiatedExchangeViewState .market?.to .toUpperCase())) ?? "-", - style: - STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.smallMed14 + .copyWith( + color: StackTheme.instance + .color.accentColorDark), ), const SizedBox( width: 6, @@ -1062,11 +1070,11 @@ class _WalletInitiatedExchangeViewState return Container(); } return SvgPicture.asset( - Assets.svg.chevronDown, - width: 5, - height: 2.5, - color: CFColors.stackAccent, - ); + Assets.svg.chevronDown, + width: 5, + height: 2.5, + color: StackTheme.instance.color + .accentColorDark); }), ], ), @@ -1215,27 +1223,18 @@ class _WalletInitiatedExchangeViewState ), const Spacer(), TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - ((ref - .read( - prefsChangeNotifierProvider) - .exchangeRateType == - ExchangeRateType.estimated) - ? ref.watch( - estimatedRateExchangeFormProvider - .select((value) => - value.canExchange)) - : ref.watch( - fixedRateExchangeFormProvider - .select((value) => - value.canExchange))) - ? CFColors.stackAccent - : CFColors.buttonGray, - ), - ), + style: ((ref + .read(prefsChangeNotifierProvider) + .exchangeRateType == + ExchangeRateType.estimated) + ? ref.watch(estimatedRateExchangeFormProvider + .select((value) => value.canExchange)) + : ref.watch(fixedRateExchangeFormProvider + .select((value) => value.canExchange))) + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getSecondaryEnabledButtonColor(context), onPressed: ((ref .read(prefsChangeNotifierProvider) .exchangeRateType == @@ -1471,16 +1470,9 @@ class _WalletInitiatedExchangeViewState message: "${response.value!.warningMessage!}\n\nDo you want to attempt trade anyways?", leftButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, @@ -1491,16 +1483,9 @@ class _WalletInitiatedExchangeViewState }, ), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor( + context), child: Text( "Attempt", style: STextStyles.button, diff --git a/lib/pages/home_view/home_view.dart b/lib/pages/home_view/home_view.dart index 669561adf..ecb6c49a0 100644 --- a/lib/pages/home_view/home_view.dart +++ b/lib/pages/home_view/home_view.dart @@ -15,9 +15,9 @@ import 'package:stackwallet/providers/ui/home_view_index_provider.dart'; import 'package:stackwallet/providers/ui/unread_notifications_provider.dart'; import 'package:stackwallet/services/change_now/change_now_loading_service.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -44,7 +44,6 @@ class _HomeViewState extends ConsumerState { final _cnLoadingService = ChangeNowLoadingService(); Future _onWillPop() async { - // go to home view when tapping back on the main exchange view if (ref.read(homeViewPageIndexStateProvider.state).state == 1) { ref.read(homeViewPageIndexStateProvider.state).state = 0; @@ -145,7 +144,6 @@ class _HomeViewState extends ConsumerState { onTap: _hiddenOptions, child: SvgPicture.asset( Assets.svg.stackIcon, - // color: CFColors.stackAccent, width: 24, height: 24, ), @@ -172,7 +170,7 @@ class _HomeViewState extends ConsumerState { key: const Key("walletsViewAlertsButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( ref.watch(notificationsProvider .select((value) => value.hasUnreadNotifications)) @@ -180,6 +178,10 @@ class _HomeViewState extends ConsumerState { : Assets.svg.bell, width: 20, height: 20, + color: ref.watch(notificationsProvider + .select((value) => value.hasUnreadNotifications)) + ? null + : StackTheme.instance.color.topNavIconPrimary, ), onPressed: () { // reset unread state @@ -225,10 +227,10 @@ class _HomeViewState extends ConsumerState { key: const Key("walletsViewSettingsButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.gear, - color: CFColors.stackAccent, + color: StackTheme.instance.color.topNavIconPrimary, width: 20, height: 20, ), @@ -243,15 +245,15 @@ class _HomeViewState extends ConsumerState { ], ), body: Container( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, child: Column( children: [ if (Constants.enableExchange) Container( - decoration: const BoxDecoration( - color: CFColors.almostWhite, + decoration: BoxDecoration( + color: StackTheme.instance.color.background, boxShadow: [ - CFColors.standardBoxShadow, + StackTheme.instance.standardBoxShadow, ], ), child: const Padding( diff --git a/lib/pages/home_view/sub_widgets/home_view_button_bar.dart b/lib/pages/home_view/sub_widgets/home_view_button_bar.dart index ca7133a0f..967c23236 100644 --- a/lib/pages/home_view/sub_widgets/home_view_button_bar.dart +++ b/lib/pages/home_view/sub_widgets/home_view_button_bar.dart @@ -10,9 +10,9 @@ import 'package:stackwallet/providers/exchange/estimate_rate_exchange_form_provi import 'package:stackwallet/providers/exchange/fixed_rate_exchange_form_provider.dart'; import 'package:stackwallet/providers/exchange/fixed_rate_market_pairs_provider.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class HomeViewButtonBar extends ConsumerStatefulWidget { @@ -147,14 +147,19 @@ class _HomeViewButtonBarState extends ConsumerState { children: [ Expanded( child: TextButton( - style: ButtonStyle( - minimumSize: MaterialStateProperty.all(const Size(46, 36)), - backgroundColor: MaterialStateProperty.all( - selectedIndex == 0 - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: selectedIndex == 0 + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context)! + .copyWith( + minimumSize: + MaterialStateProperty.all(const Size(46, 36)), + ) + : StackTheme.instance + .getSecondaryEnabledButtonColor(context)! + .copyWith( + minimumSize: + MaterialStateProperty.all(const Size(46, 36)), + ), onPressed: () { FocusScope.of(context).unfocus(); if (selectedIndex != 0) { @@ -165,8 +170,9 @@ class _HomeViewButtonBarState extends ConsumerState { "Wallets", style: STextStyles.button.copyWith( fontSize: 14, - color: - selectedIndex == 0 ? CFColors.light1 : CFColors.stackAccent, + color: selectedIndex == 0 + ? StackTheme.instance.color.buttonTextPrimary + : StackTheme.instance.color.textDark, ), ), ), @@ -176,14 +182,19 @@ class _HomeViewButtonBarState extends ConsumerState { ), Expanded( child: TextButton( - style: ButtonStyle( - minimumSize: MaterialStateProperty.all(const Size(46, 36)), - backgroundColor: MaterialStateProperty.all( - selectedIndex == 1 - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: selectedIndex == 1 + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context)! + .copyWith( + minimumSize: + MaterialStateProperty.all(const Size(46, 36)), + ) + : StackTheme.instance + .getSecondaryEnabledButtonColor(context)! + .copyWith( + minimumSize: + MaterialStateProperty.all(const Size(46, 36)), + ), onPressed: () async { FocusScope.of(context).unfocus(); if (selectedIndex != 1) { @@ -217,8 +228,9 @@ class _HomeViewButtonBarState extends ConsumerState { "Exchange", style: STextStyles.button.copyWith( fontSize: 14, - color: - selectedIndex == 1 ? CFColors.light1 : CFColors.stackAccent, + color: selectedIndex == 1 + ? StackTheme.instance.color.buttonTextPrimary + : StackTheme.instance.color.textDark, ), ), ), @@ -249,7 +261,7 @@ class _HomeViewButtonBarState extends ConsumerState { // style: STextStyles.button.copyWith( // fontSize: 14, // color: - // selectedIndex == 2 ? CFColors.light1 : CFColors.stackAccent, + // selectedIndex == 2 ? CFColors.light1 : StackTheme.instance.color.accentColorDark // ), // ), // ), diff --git a/lib/pages/intro_view.dart b/lib/pages/intro_view.dart index 0b2101a1a..ff2f56538 100644 --- a/lib/pages/intro_view.dart +++ b/lib/pages/intro_view.dart @@ -1,9 +1,12 @@ import 'package:flutter/gestures.dart'; import 'package:flutter/material.dart'; +import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/pinpad_views/create_pin_view.dart'; +import 'package:stackwallet/pages_desktop_specific/create_password/create_password_view.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:url_launcher/url_launcher.dart'; class IntroView extends StatefulWidget { @@ -14,8 +17,11 @@ class IntroView extends StatefulWidget { } class _IntroViewState extends State { + late final bool isDesktop; + @override void initState() { + isDesktop = Util.isDesktop; super.initState(); } @@ -23,28 +29,22 @@ class _IntroViewState extends State { Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType "); return Scaffold( - body: Container( - color: CFColors.almostWhite, - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - Expanded( - child: Padding( - padding: const EdgeInsets.only( - left: 47, - right: 47, - top: 67, - bottom: 4, - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - const Spacer( - flex: 2, + backgroundColor: StackTheme.instance.color.background, + body: Center( + child: !isDesktop + ? Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + const Spacer( + flex: 2, + ), + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 16, ), - ConstrainedBox( + child: ConstrainedBox( constraints: const BoxConstraints( - maxWidth: 400, + maxWidth: 300, ), child: Image( image: AssetImage( @@ -52,91 +52,212 @@ class _IntroViewState extends State { ), ), ), - const Spacer( - flex: 1, + ), + const Spacer( + flex: 1, + ), + AppNameText( + isDesktop: isDesktop, + ), + const SizedBox( + height: 8, + ), + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 48, ), - Text( - "Stack Wallet", - textAlign: TextAlign.center, - style: STextStyles.pageTitleH1, + child: IntroAboutText( + isDesktop: isDesktop, ), - const SizedBox( - height: 8, + ), + const Spacer( + flex: 4, + ), + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 32, ), - Text( - "An open-source, multicoin wallet for everyone", - textAlign: TextAlign.center, - style: STextStyles.subtitle, + child: PrivacyAndTOSText( + isDesktop: isDesktop, ), - // Center(child: Text("for everyone")), - const Spacer( - flex: 4, + ), + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 16, + vertical: 16, ), - RichText( - textAlign: TextAlign.center, - text: TextSpan( - style: STextStyles.label, - children: [ - const TextSpan( - text: "By using Stack Wallet, you agree to the "), - TextSpan( - text: "Terms of service", - style: STextStyles.richLink, - recognizer: TapGestureRecognizer() - ..onTap = () { - launchUrl( - Uri.parse( - "https://stackwallet.com/terms-of-service.html"), - mode: LaunchMode.externalApplication, - ); - }, + child: Row( + children: [ + Expanded( + child: GetStartedButton( + isDesktop: isDesktop, ), - const TextSpan(text: " and "), - TextSpan( - text: "Privacy policy", - style: STextStyles.richLink, - recognizer: TapGestureRecognizer() - ..onTap = () { - launchUrl( - Uri.parse( - "https://stackwallet.com/privacy-policy.html"), - mode: LaunchMode.externalApplication, - ); - }, - ), - ], + ), + ], + ), + ), + ], + ) + : SizedBox( + width: 350, + height: 540, + child: Column( + children: [ + const Spacer( + flex: 2, + ), + SizedBox( + width: 130, + height: 130, + child: SvgPicture.asset( + Assets.svg.stackIcon, ), ), + const Spacer( + flex: 42, + ), + AppNameText( + isDesktop: isDesktop, + ), + const Spacer( + flex: 24, + ), + IntroAboutText( + isDesktop: isDesktop, + ), + const Spacer( + flex: 42, + ), + GetStartedButton( + isDesktop: isDesktop, + ), + const Spacer( + flex: 65, + ), + PrivacyAndTOSText( + isDesktop: isDesktop, + ), ], ), ), - ), - Padding( - padding: const EdgeInsets.symmetric( - horizontal: 16, - vertical: 16, - ), - child: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), - onPressed: () { - // // TODO do global password/pin creation - // Navigator.of(context).pushNamed(HomeView.routeName); - - Navigator.of(context).pushNamed(CreatePinView.routeName); - }, - child: Text( - "Get started", - style: STextStyles.button, - ), - ), - ), - ], - ), ), ); } } + +class AppNameText extends StatelessWidget { + const AppNameText({Key? key, required this.isDesktop}) : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Text( + "Stack Wallet", + textAlign: TextAlign.center, + style: !isDesktop + ? STextStyles.pageTitleH1 + : STextStyles.pageTitleH1.copyWith( + fontSize: 40, + ), + ); + } +} + +class IntroAboutText extends StatelessWidget { + const IntroAboutText({Key? key, required this.isDesktop}) : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return Text( + "An open-source, multicoin wallet for everyone", + textAlign: TextAlign.center, + style: !isDesktop + ? STextStyles.subtitle + : STextStyles.subtitle.copyWith( + fontSize: 24, + ), + ); + } +} + +class PrivacyAndTOSText extends StatelessWidget { + const PrivacyAndTOSText({Key? key, required this.isDesktop}) + : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + final fontSize = isDesktop ? 18.0 : 12.0; + return RichText( + textAlign: TextAlign.center, + text: TextSpan( + style: STextStyles.label.copyWith(fontSize: fontSize), + children: [ + const TextSpan(text: "By using Stack Wallet, you agree to the "), + TextSpan( + text: "Terms of service", + style: STextStyles.richLink.copyWith(fontSize: fontSize), + recognizer: TapGestureRecognizer() + ..onTap = () { + launchUrl( + Uri.parse("https://stackwallet.com/terms-of-service.html"), + mode: LaunchMode.externalApplication, + ); + }, + ), + const TextSpan(text: " and "), + TextSpan( + text: "Privacy policy", + style: STextStyles.richLink.copyWith(fontSize: fontSize), + recognizer: TapGestureRecognizer() + ..onTap = () { + launchUrl( + Uri.parse("https://stackwallet.com/privacy-policy.html"), + mode: LaunchMode.externalApplication, + ); + }, + ), + ], + ), + ); + } +} + +class GetStartedButton extends StatelessWidget { + const GetStartedButton({Key? key, required this.isDesktop}) : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return !isDesktop + ? TextButton( + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), + onPressed: () { + Navigator.of(context).pushNamed(CreatePinView.routeName); + }, + child: Text( + "Get started", + style: STextStyles.button, + ), + ) + : SizedBox( + width: 328, + height: 70, + child: TextButton( + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), + onPressed: () { + Navigator.of(context).pushNamed(CreatePasswordView.routeName); + }, + child: Text( + "Get started", + style: STextStyles.button.copyWith(fontSize: 20), + ), + ), + ); + } +} diff --git a/lib/pages/loading_view.dart b/lib/pages/loading_view.dart index 30ef87fa4..c57ff36ba 100644 --- a/lib/pages/loading_view.dart +++ b/lib/pages/loading_view.dart @@ -3,7 +3,8 @@ import 'dart:math'; import 'package:flutter/material.dart'; import 'package:lottie/lottie.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class LoadingView extends StatelessWidget { const LoadingView({Key? key}) : super(key: key); @@ -12,9 +13,9 @@ class LoadingView extends StatelessWidget { Widget build(BuildContext context) { final size = MediaQuery.of(context).size; return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, body: Container( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, child: Center( child: SizedBox( width: min(size.width, size.height) * 0.5, diff --git a/lib/pages/manage_favorites_view/manage_favorites_view.dart b/lib/pages/manage_favorites_view/manage_favorites_view.dart index e1810626f..a8027f05c 100644 --- a/lib/pages/manage_favorites_view/manage_favorites_view.dart +++ b/lib/pages/manage_favorites_view/manage_favorites_view.dart @@ -1,10 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/services/coins/manager.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/managed_favorite.dart'; @@ -29,7 +28,7 @@ class ManageFavoritesView extends StatelessWidget { ), ), body: Container( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, child: Padding( padding: const EdgeInsets.only( left: 12, @@ -43,7 +42,7 @@ class ManageFavoritesView extends StatelessWidget { padding: const EdgeInsets.symmetric(horizontal: 4), child: Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -68,10 +67,7 @@ class ManageFavoritesView extends StatelessWidget { key: key, itemCount: favorites.length, itemBuilder: (builderContext, index) { - final walletId = ref - .read(favorites[index] - as ChangeNotifierProvider) - .walletId; + final walletId = ref.read(favorites[index]).walletId; return Padding( key: Key( "manageFavoriteWalletsItem_$walletId", @@ -121,7 +117,7 @@ class ManageFavoritesView extends StatelessWidget { child: Text( "Add to favorites", style: STextStyles.itemSubtitle12.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), ), @@ -135,10 +131,7 @@ class ManageFavoritesView extends StatelessWidget { itemBuilder: (buildContext, index) { // final walletId = ref.watch( // nonFavorites[index].select((value) => value.walletId)); - final walletId = ref - .read(nonFavorites[index] - as ChangeNotifierProvider) - .walletId; + final walletId = ref.read(nonFavorites[index]).walletId; return Padding( key: Key( "manageNonFavoriteWalletsItem_$walletId", diff --git a/lib/pages/notification_views/notifications_view.dart b/lib/pages/notification_views/notifications_view.dart index c562c72b6..e1482eaca 100644 --- a/lib/pages/notification_views/notifications_view.dart +++ b/lib/pages/notification_views/notifications_view.dart @@ -3,8 +3,8 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/notifications/notification_card.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/unread_notifications_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -44,7 +44,7 @@ class _NotificationsViewState extends ConsumerState { .toList(growable: false); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( title: Text( "Notifications", diff --git a/lib/pages/pinpad_views/create_pin_view.dart b/lib/pages/pinpad_views/create_pin_view.dart index df9c0c8eb..e1d0ab7f2 100644 --- a/lib/pages/pinpad_views/create_pin_view.dart +++ b/lib/pages/pinpad_views/create_pin_view.dart @@ -1,6 +1,5 @@ import 'dart:io'; -import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_secure_storage/flutter_secure_storage.dart'; @@ -10,11 +9,11 @@ import 'package:stackwallet/pages/home_view/home_view.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/biometrics.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_pin_put/custom_pin_put.dart'; @@ -41,8 +40,9 @@ class CreatePinView extends ConsumerStatefulWidget { class _CreatePinViewState extends ConsumerState { BoxDecoration get _pinPutDecoration { return BoxDecoration( - color: CFColors.gray3, - border: Border.all(width: 1, color: CFColors.gray3), + color: StackTheme.instance.color.textSubtitle3, + border: + Border.all(width: 1, color: StackTheme.instance.color.textSubtitle3), borderRadius: BorderRadius.circular(6), ); } @@ -81,7 +81,7 @@ class _CreatePinViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -129,21 +129,21 @@ class _CreatePinViewState extends ConsumerState { controller: _pinPutController1, useNativeKeyboard: false, obscureText: "", - inputDecoration: const InputDecoration( + inputDecoration: InputDecoration( border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none, disabledBorder: InputBorder.none, errorBorder: InputBorder.none, focusedErrorBorder: InputBorder.none, - fillColor: CFColors.almostWhite, + fillColor: StackTheme.instance.color.background, counterText: "", ), submittedFieldDecoration: _pinPutDecoration.copyWith( - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, border: Border.all( width: 1, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, ), ), selectedFieldDecoration: _pinPutDecoration, @@ -189,21 +189,21 @@ class _CreatePinViewState extends ConsumerState { controller: _pinPutController2, useNativeKeyboard: false, obscureText: "", - inputDecoration: const InputDecoration( + inputDecoration: InputDecoration( border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none, disabledBorder: InputBorder.none, errorBorder: InputBorder.none, focusedErrorBorder: InputBorder.none, - fillColor: CFColors.almostWhite, + fillColor: StackTheme.instance.color.background, counterText: "", ), submittedFieldDecoration: _pinPutDecoration.copyWith( - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, border: Border.all( width: 1, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, ), ), selectedFieldDecoration: _pinPutDecoration, diff --git a/lib/pages/pinpad_views/lock_screen_view.dart b/lib/pages/pinpad_views/lock_screen_view.dart index 03dd5bb26..9854d1e4e 100644 --- a/lib/pages/pinpad_views/lock_screen_view.dart +++ b/lib/pages/pinpad_views/lock_screen_view.dart @@ -12,11 +12,11 @@ import 'package:stackwallet/providers/global/wallets_provider.dart'; // import 'package:stackwallet/providers/global/should_show_lockscreen_on_resume_state_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/biometrics.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_pin_put/custom_pin_put.dart'; import 'package:stackwallet/widgets/shake/shake.dart'; @@ -151,8 +151,9 @@ class _LockscreenViewState extends ConsumerState { BoxDecoration get _pinPutDecoration { return BoxDecoration( - color: CFColors.gray3, - border: Border.all(width: 1, color: CFColors.gray3), + color: StackTheme.instance.color.textSubtitle2, + border: + Border.all(width: 1, color: StackTheme.instance.color.textSubtitle2), borderRadius: BorderRadius.circular(6), ); } @@ -164,7 +165,7 @@ class _LockscreenViewState extends ConsumerState { late Biometrics biometrics; Scaffold get _body => Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: widget.showBackButton ? AppBarBackButton( @@ -213,21 +214,21 @@ class _LockscreenViewState extends ConsumerState { controller: _pinTextController, useNativeKeyboard: false, obscureText: "", - inputDecoration: const InputDecoration( + inputDecoration: InputDecoration( border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none, disabledBorder: InputBorder.none, errorBorder: InputBorder.none, focusedErrorBorder: InputBorder.none, - fillColor: CFColors.almostWhite, + fillColor: StackTheme.instance.color.background, counterText: "", ), submittedFieldDecoration: _pinPutDecoration.copyWith( - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, border: Border.all( width: 1, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, ), ), selectedFieldDecoration: _pinPutDecoration, diff --git a/lib/pages/receive_view/generate_receiving_uri_qr_code_view.dart b/lib/pages/receive_view/generate_receiving_uri_qr_code_view.dart index 037677a40..c91506c68 100644 --- a/lib/pages/receive_view/generate_receiving_uri_qr_code_view.dart +++ b/lib/pages/receive_view/generate_receiving_uri_qr_code_view.dart @@ -12,13 +12,13 @@ import 'package:qr_flutter/qr_flutter.dart'; import 'package:share_plus/share_plus.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -101,7 +101,7 @@ class _GenerateUriQrCodeViewState extends State { Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -244,13 +244,8 @@ class _GenerateUriQrCodeViewState extends State { height: 8, ), TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), onPressed: () { final amountString = amountController.text; final noteString = noteController.text; @@ -318,12 +313,14 @@ class _GenerateUriQrCodeViewState extends State { width: width + 20, height: width + 20, child: QrImage( - data: uriString, - size: width, - backgroundColor: CFColors.white, - foregroundColor: - CFColors.stackAccent, - ), + data: uriString, + size: width, + backgroundColor: StackTheme + .instance.color.popupBG, + foregroundColor: StackTheme + .instance + .color + .accentColorDark), ), ), ), @@ -338,13 +335,9 @@ class _GenerateUriQrCodeViewState extends State { // TODO: add save button as well await _capturePng(true); }, - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Row( mainAxisAlignment: MainAxisAlignment.center, @@ -367,11 +360,7 @@ class _GenerateUriQrCodeViewState extends State { "Share", textAlign: TextAlign.center, - style: STextStyles.button - .copyWith( - color: CFColors - .stackAccent, - ), + style: STextStyles.button, ), const SizedBox( height: 2, diff --git a/lib/pages/receive_view/receive_view.dart b/lib/pages/receive_view/receive_view.dart index b0f49682b..0c3993e19 100644 --- a/lib/pages/receive_view/receive_view.dart +++ b/lib/pages/receive_view/receive_view.dart @@ -10,11 +10,11 @@ import 'package:stackwallet/pages/receive_view/generate_receiving_uri_qr_code_vi import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart'; @@ -110,7 +110,7 @@ class _ReceiveViewState extends ConsumerState { }); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -158,7 +158,8 @@ class _ReceiveViewState extends ConsumerState { Assets.svg.copy, width: 10, height: 10, - color: CFColors.link2, + color: + StackTheme.instance.color.infoItemIcons, ), const SizedBox( width: 4, @@ -195,16 +196,12 @@ class _ReceiveViewState extends ConsumerState { if (coin != Coin.epicCash) TextButton( onPressed: generateNewAddress, - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Generate new address", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color.accentColorDark), ), ), const SizedBox( @@ -217,10 +214,10 @@ class _ReceiveViewState extends ConsumerState { child: Column( children: [ QrImage( - data: "${coin.uriScheme}:$receivingAddress", - size: MediaQuery.of(context).size.width / 2, - foregroundColor: CFColors.stackAccent, - ), + data: "${coin.uriScheme}:$receivingAddress", + size: MediaQuery.of(context).size.width / 2, + foregroundColor: + StackTheme.instance.color.accentColorDark), const SizedBox( height: 20, ), diff --git a/lib/pages/send_view/confirm_transaction_view.dart b/lib/pages/send_view/confirm_transaction_view.dart index 5d28619aa..831530780 100644 --- a/lib/pages/send_view/confirm_transaction_view.dart +++ b/lib/pages/send_view/confirm_transaction_view.dart @@ -7,21 +7,20 @@ import 'package:stackwallet/pages/pinpad_views/lock_screen_view.dart'; import 'package:stackwallet/pages/send_view/sub_widgets/sending_transaction_dialog.dart'; import 'package:stackwallet/pages/wallet_view/wallet_view.dart'; import 'package:stackwallet/providers/providers.dart'; +import 'package:stackwallet/providers/wallet/public_private_balance_state_provider.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/services/coins/epiccash/epiccash_wallet.dart'; import 'package:stackwallet/services/coins/firo/firo_wallet.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; -import '../../providers/wallet/public_private_balance_state_provider.dart'; - class ConfirmTransactionView extends ConsumerStatefulWidget { const ConfirmTransactionView({ Key? key, @@ -112,16 +111,12 @@ class _ConfirmTransactionViewState title: "Broadcast transaction failed", message: e.toString(), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: + StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Ok", - style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith(color: StackTheme.instance.color.accentColorDark), ), onPressed: () { Navigator.of(context).pop(); @@ -147,7 +142,7 @@ class _ConfirmTransactionViewState .select((value) => value.getManagerProvider(walletId))); return Scaffold( appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { // if (FocusScope.of(context).hasFocus) { @@ -288,7 +283,7 @@ class _ConfirmTransactionViewState height: 12, ), RoundedContainer( - color: CFColors.stackGreen15, + color: StackTheme.instance.color.snackBarBackSuccess, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ @@ -318,13 +313,7 @@ class _ConfirmTransactionViewState height: 16, ), TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), onPressed: () async { final unlocked = await Navigator.push( context, diff --git a/lib/pages/send_view/send_view.dart b/lib/pages/send_view/send_view.dart index 6dc274464..53955efbd 100644 --- a/lib/pages/send_view/send_view.dart +++ b/lib/pages/send_view/send_view.dart @@ -20,7 +20,6 @@ import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/address_utils.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/barcode_scanner_interface.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; @@ -28,6 +27,7 @@ import 'package:stackwallet/utilities/enums/fee_rate_type_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; @@ -360,7 +360,7 @@ class _SendViewState extends ConsumerState { } return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -400,7 +400,7 @@ class _SendViewState extends ConsumerState { children: [ Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -840,7 +840,8 @@ class _SendViewState extends ConsumerState { error, textAlign: TextAlign.left, style: STextStyles.label.copyWith( - color: CFColors.notificationRedForeground, + color: + StackTheme.instance.color.textError, ), ), ), @@ -874,7 +875,8 @@ class _SendViewState extends ConsumerState { horizontal: 12, ), child: RawMaterialButton( - splashColor: CFColors.splashLight, + splashColor: + StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -975,7 +977,8 @@ class _SendViewState extends ConsumerState { Assets.svg.chevronDown, width: 8, height: 4, - color: CFColors.gray3, + color: StackTheme + .instance.color.textSubtitle2, ), ], ), @@ -1066,8 +1069,8 @@ class _SendViewState extends ConsumerState { child: Text( coin.ticker, style: STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ), ), @@ -1168,8 +1171,8 @@ class _SendViewState extends ConsumerState { ref.watch(prefsChangeNotifierProvider .select((value) => value.currency)), style: STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ), ), @@ -1244,7 +1247,8 @@ class _SendViewState extends ConsumerState { horizontal: 12, ), child: RawMaterialButton( - splashColor: CFColors.splashLight, + splashColor: + StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -1366,7 +1370,8 @@ class _SendViewState extends ConsumerState { Assets.svg.chevronDown, width: 8, height: 4, - color: CFColors.gray3, + color: StackTheme + .instance.color.textSubtitle2, ), ], ), @@ -1406,22 +1411,17 @@ class _SendViewState extends ConsumerState { message: "Sending to self is currently disabled", rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Ok", - style: - STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith( + color: StackTheme + .instance + .color + .accentColorDark), ), onPressed: () { Navigator.of(context).pop(); @@ -1475,38 +1475,26 @@ class _SendViewState extends ConsumerState { message: "You are about to send your entire balance. Would you like to continue?", leftButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Cancel", - style: - STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith( + color: StackTheme + .instance + .color + .accentColorDark), ), onPressed: () { Navigator.of(context).pop(false); }, ), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor( + context), child: Text( "Yes", style: STextStyles.button, @@ -1611,22 +1599,17 @@ class _SendViewState extends ConsumerState { title: "Transaction failed", message: e.toString(), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty - .all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor( + context), child: Text( "Ok", - style: - STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith( + color: StackTheme + .instance + .color + .accentColorDark), ), onPressed: () { Navigator.of(context).pop(); @@ -1642,26 +1625,10 @@ class _SendViewState extends ConsumerState { style: ref .watch(previewTxButtonStateProvider.state) .state - ? Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ) - : Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent.withOpacity( - 0.25, - ), - ), - ), + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), child: Text( "Preview", style: STextStyles.button, diff --git a/lib/pages/send_view/sub_widgets/building_transaction_dialog.dart b/lib/pages/send_view/sub_widgets/building_transaction_dialog.dart index 226a28323..783614f3a 100644 --- a/lib/pages/send_view/sub_widgets/building_transaction_dialog.dart +++ b/lib/pages/send_view/sub_widgets/building_transaction_dialog.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class BuildingTransactionDialog extends StatefulWidget { @@ -62,17 +62,13 @@ class _RestoringDialogState extends State turns: _spinAnimation, child: SvgPicture.asset( Assets.svg.arrowRotate, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 24, height: 24, ), ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, diff --git a/lib/pages/send_view/sub_widgets/firo_balance_selection_sheet.dart b/lib/pages/send_view/sub_widgets/firo_balance_selection_sheet.dart index 8cb1e64dd..60741c8fa 100644 --- a/lib/pages/send_view/sub_widgets/firo_balance_selection_sheet.dart +++ b/lib/pages/send_view/sub_widgets/firo_balance_selection_sheet.dart @@ -4,10 +4,10 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/wallet/public_private_balance_state_provider.dart'; import 'package:stackwallet/services/coins/firo/firo_wallet.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; class FiroBalanceSelectionSheet extends ConsumerStatefulWidget { @@ -49,9 +49,9 @@ class _FiroBalanceSelectionSheetState final firoWallet = manager.wallet as FiroWallet; return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -69,7 +69,7 @@ class _FiroBalanceSelectionSheetState Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -114,7 +114,8 @@ class _FiroBalanceSelectionSheetState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: "Private", groupValue: ref .watch( @@ -143,9 +144,7 @@ class _FiroBalanceSelectionSheetState // children: [ Text( "Private balance", - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( @@ -205,7 +204,8 @@ class _FiroBalanceSelectionSheetState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: "Public", groupValue: ref .watch( @@ -233,9 +233,7 @@ class _FiroBalanceSelectionSheetState // children: [ Text( "Public balance", - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( diff --git a/lib/pages/send_view/sub_widgets/sending_transaction_dialog.dart b/lib/pages/send_view/sub_widgets/sending_transaction_dialog.dart index df04fb32a..cd4044ae6 100644 --- a/lib/pages/send_view/sub_widgets/sending_transaction_dialog.dart +++ b/lib/pages/send_view/sub_widgets/sending_transaction_dialog.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class SendingTransactionDialog extends StatefulWidget { @@ -55,7 +55,7 @@ class _RestoringDialogState extends State turns: _spinAnimation, child: SvgPicture.asset( Assets.svg.arrowRotate, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 24, height: 24, ), diff --git a/lib/pages/send_view/sub_widgets/transaction_fee_selection_sheet.dart b/lib/pages/send_view/sub_widgets/transaction_fee_selection_sheet.dart index 4eca34f3d..f537c2213 100644 --- a/lib/pages/send_view/sub_widgets/transaction_fee_selection_sheet.dart +++ b/lib/pages/send_view/sub_widgets/transaction_fee_selection_sheet.dart @@ -6,12 +6,12 @@ import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/fee_rate_type_state_provider.dart'; import 'package:stackwallet/providers/wallet/public_private_balance_state_provider.dart'; import 'package:stackwallet/services/coins/firo/firo_wallet.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/fee_rate_type_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; final feeSheetSessionCacheProvider = @@ -162,9 +162,9 @@ class _TransactionFeeSelectionSheetState .select((value) => value.getManager(walletId))); return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -182,7 +182,7 @@ class _TransactionFeeSelectionSheetState Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -235,7 +235,8 @@ class _TransactionFeeSelectionSheetState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: FeeRateType.fast, groupValue: ref .watch(feeRateTypeStateProvider.state) @@ -262,9 +263,7 @@ class _TransactionFeeSelectionSheetState children: [ Text( FeeRateType.fast.prettyName, - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( @@ -360,7 +359,8 @@ class _TransactionFeeSelectionSheetState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: FeeRateType.average, groupValue: ref .watch(feeRateTypeStateProvider.state) @@ -386,9 +386,7 @@ class _TransactionFeeSelectionSheetState children: [ Text( FeeRateType.average.prettyName, - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( @@ -484,7 +482,8 @@ class _TransactionFeeSelectionSheetState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: FeeRateType.slow, groupValue: ref .watch(feeRateTypeStateProvider.state) @@ -511,9 +510,7 @@ class _TransactionFeeSelectionSheetState children: [ Text( FeeRateType.slow.prettyName, - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), - ), + style: STextStyles.titleBold12, textAlign: TextAlign.left, ), const SizedBox( diff --git a/lib/pages/settings_views/global_settings_view/about_view.dart b/lib/pages/settings_views/global_settings_view/about_view.dart index f1043866d..c7d3af196 100644 --- a/lib/pages/settings_views/global_settings_view/about_view.dart +++ b/lib/pages/settings_views/global_settings_view/about_view.dart @@ -1,21 +1,20 @@ import 'dart:convert'; -import 'package:http/http.dart'; import 'package:flutter/gestures.dart'; import 'package:flutter/material.dart'; +import 'package:flutter_libepiccash/git_versions.dart' as EPIC_VERSIONS; +import 'package:flutter_libmonero/git_versions.dart' as MONERO_VERSIONS; import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:http/http.dart'; +import 'package:lelantus/git_versions.dart' as FIRO_VERSIONS; import 'package:package_info_plus/package_info_plus.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:url_launcher/url_launcher.dart'; -import 'package:flutter_libepiccash/git_versions.dart' as EPIC_VERSIONS; -import 'package:flutter_libmonero/git_versions.dart' as MONERO_VERSIONS; -import 'package:lelantus/git_versions.dart' as FIRO_VERSIONS; - -import 'package:stackwallet/utilities/logger.dart'; const kGithubAPI = "https://api.github.com"; const kGithubSearch = "/search/commits"; @@ -119,7 +118,7 @@ class AboutView extends ConsumerWidget { Future commitMoneroFuture = Future.wait(futureMoneroList); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -269,15 +268,21 @@ class AboutView extends ConsumerWidget { switch (stateOfCommit) { case CommitStatus.isHead: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackGreen); + .copyWith( + color: StackTheme + .instance.color.accentColorGreen); break; case CommitStatus.isOldCommit: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackYellow); + .copyWith( + color: StackTheme + .instance.color.accentColorYellow); break; case CommitStatus.notACommit: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackRed); + .copyWith( + color: StackTheme + .instance.color.accentColorRed); break; default: break; @@ -329,15 +334,21 @@ class AboutView extends ConsumerWidget { switch (stateOfCommit) { case CommitStatus.isHead: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackGreen); + .copyWith( + color: StackTheme + .instance.color.accentColorGreen); break; case CommitStatus.isOldCommit: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackYellow); + .copyWith( + color: StackTheme + .instance.color.accentColorYellow); break; case CommitStatus.notACommit: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackRed); + .copyWith( + color: StackTheme + .instance.color.accentColorRed); break; default: break; @@ -389,15 +400,21 @@ class AboutView extends ConsumerWidget { switch (stateOfCommit) { case CommitStatus.isHead: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackGreen); + .copyWith( + color: StackTheme + .instance.color.accentColorGreen); break; case CommitStatus.isOldCommit: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackYellow); + .copyWith( + color: StackTheme + .instance.color.accentColorYellow); break; case CommitStatus.notACommit: indicationStyle = STextStyles.itemSubtitle - .copyWith(color: CFColors.stackRed); + .copyWith( + color: StackTheme + .instance.color.accentColorRed); break; default: break; diff --git a/lib/pages/settings_views/global_settings_view/advanced_views/advanced_settings_view.dart b/lib/pages/settings_views/global_settings_view/advanced_views/advanced_settings_view.dart index 833e6c9ef..c47f56de9 100644 --- a/lib/pages/settings_views/global_settings_view/advanced_views/advanced_settings_view.dart +++ b/lib/pages/settings_views/global_settings_view/advanced_views/advanced_settings_view.dart @@ -2,9 +2,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/advanced_views/debug_view.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -21,7 +21,7 @@ class AdvancedSettingsView extends StatelessWidget { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -41,7 +41,7 @@ class AdvancedSettingsView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -75,7 +75,7 @@ class AdvancedSettingsView extends StatelessWidget { child: Consumer( builder: (_, ref, __) { return RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( diff --git a/lib/pages/settings_views/global_settings_view/advanced_views/debug_view.dart b/lib/pages/settings_views/global_settings_view/advanced_views/debug_view.dart index 73129bfda..abd6ccfce 100644 --- a/lib/pages/settings_views/global_settings_view/advanced_views/debug_view.dart +++ b/lib/pages/settings_views/global_settings_view/advanced_views/debug_view.dart @@ -1,3 +1,4 @@ +import 'dart:async'; import 'dart:io'; import 'package:event_bus/event_bus.dart'; @@ -10,11 +11,11 @@ import 'package:stackwallet/models/isar/models/log.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/providers/global/debug_service_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart'; @@ -89,7 +90,7 @@ class _DebugViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -113,29 +114,23 @@ class _DebugViewState extends ConsumerState { key: const Key("deleteLogsAppBarButtonKey"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.trash, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), onPressed: () async { - showDialog( + await showDialog( context: context, builder: (_) => StackDialog( title: "Delete logs?", message: "You are about to delete all logs permanently. Are you sure?", leftButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, @@ -145,14 +140,8 @@ class _DebugViewState extends ConsumerState { }, ), rightButton: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Delete logs", style: STextStyles.button, @@ -161,7 +150,7 @@ class _DebugViewState extends ConsumerState { Navigator.of(context).pop(); bool shouldPop = false; - showDialog( + unawaited(showDialog( barrierDismissible: false, context: context, builder: (_) => WillPopScope( @@ -169,11 +158,11 @@ class _DebugViewState extends ConsumerState { return shouldPop; }, child: const CustomLoadingOverlay( - message: "Generating Stack logs file", + message: "Deleting logs...", eventBus: null, ), ), - ); + )); await ref .read(debugServiceProvider) @@ -183,10 +172,10 @@ class _DebugViewState extends ConsumerState { if (mounted) { Navigator.pop(context); - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.info, context: context, - message: 'Logs cleared!'); + message: 'Logs cleared!')); } }, ), @@ -317,7 +306,7 @@ class _DebugViewState extends ConsumerState { if (path != null) { final eventBus = EventBus(); bool shouldPop = false; - showDialog( + unawaited(showDialog( barrierDismissible: false, context: context, builder: (_) => WillPopScope( @@ -329,7 +318,7 @@ class _DebugViewState extends ConsumerState { eventBus: eventBus, ), ), - ); + )); await ref .read(debugServiceProvider) @@ -339,10 +328,10 @@ class _DebugViewState extends ConsumerState { if (mounted) { Navigator.pop(context); - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.info, context: context, - message: 'Logs file saved'); + message: 'Logs file saved')); } } }, @@ -383,14 +372,14 @@ class _DebugViewState extends ConsumerState { return Container( key: Key("log_${log.id}_${log.timestampInMillisUTC}"), decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: _borderRadius(index, logs.length), ), child: Padding( padding: const EdgeInsets.all(4), child: RoundedContainer( padding: const EdgeInsets.all(0), - color: CFColors.white, + color: StackTheme.instance.color.popupBG, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ @@ -401,21 +390,27 @@ class _DebugViewState extends ConsumerState { style: STextStyles.baseXS.copyWith( fontSize: 8, color: (log.logLevel == LogLevel.Info - ? CFColors.stackGreen + ? StackTheme.instance.color + .accentColorGreen : (log.logLevel == LogLevel.Warning - ? CFColors.stackYellow + ? StackTheme.instance.color + .accentColorYellow : (log.logLevel == LogLevel.Error ? Colors.orange - : CFColors.stackRed))), + : StackTheme + .instance + .color + .accentColorRed))), ), ), Text( "[${DateTime.fromMillisecondsSinceEpoch(log.timestampInMillisUTC, isUtc: true)}]: ", style: STextStyles.baseXS.copyWith( fontSize: 8, - color: CFColors.neutral50, + color: StackTheme + .instance.color.textDark3, ), ), ], diff --git a/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart b/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart index 4bb213972..fccf3f0e4 100644 --- a/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart +++ b/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart @@ -1,9 +1,11 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/hive/db.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/color_theme.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -16,7 +18,7 @@ class AppearanceSettingsView extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -45,7 +47,7 @@ class AppearanceSettingsView extends ConsumerWidget { child: Consumer( builder: (_, ref, __) { return RawMaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -89,6 +91,73 @@ class AppearanceSettingsView extends ConsumerWidget { }, ), ), + const SizedBox( + height: 10, + ), + RoundedWhiteContainer( + child: Consumer( + builder: (_, ref, __) { + return RawMaterialButton( + splashColor: StackTheme.instance.color.highlight, + materialTapTargetSize: + MaterialTapTargetSize.shrinkWrap, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + onPressed: null, + child: Padding( + padding: + const EdgeInsets.symmetric(vertical: 2), + child: Row( + mainAxisAlignment: + MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: + CrossAxisAlignment.start, + children: [ + Text( + "Enabled dark mode", + style: STextStyles.titleBold12, + textAlign: TextAlign.left, + ), + Text( + "Requires restart", + style: STextStyles.itemSubtitle, + textAlign: TextAlign.left, + ), + ], + ), + SizedBox( + height: 20, + width: 40, + child: DraggableSwitchButton( + isOn: (DB.instance.get( + boxName: DB.boxNameTheme, + key: "colorScheme") + as String?) == + "dark", + onValueChanged: (newValue) { + DB.instance.put( + boxName: DB.boxNameTheme, + key: "colorScheme", + value: (newValue + ? ThemeType.dark + : ThemeType.light) + .name, + ); + }, + ), + ) + ], + ), + ), + ); + }, + ), + ), ], ), ), diff --git a/lib/pages/settings_views/global_settings_view/currency_view.dart b/lib/pages/settings_views/global_settings_view/currency_view.dart index 7cb3c51e2..b5f620ef4 100644 --- a/lib/pages/settings_views/global_settings_view/currency_view.dart +++ b/lib/pages/settings_views/global_settings_view/currency_view.dart @@ -4,9 +4,9 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/global/base_currencies_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; @@ -101,7 +101,7 @@ class _CurrencyViewState extends ConsumerState { } currenciesWithoutSelected = _filtered(); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -203,7 +203,7 @@ class _CurrencyViewState extends ConsumerState { (context, index) { return Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: _borderRadius(index), ), child: Padding( @@ -213,8 +213,8 @@ class _CurrencyViewState extends ConsumerState { child: RoundedContainer( padding: const EdgeInsets.all(0), color: currenciesWithoutSelected[index] == current - ? CFColors.selected - : CFColors.white, + ? StackTheme.instance.color.currencyListItemBG + : StackTheme.instance.color.popupBG, child: RawMaterialButton( onPressed: () async { onTap(index); @@ -234,7 +234,8 @@ class _CurrencyViewState extends ConsumerState { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance.color + .radioButtonIconEnabled, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, value: true, diff --git a/lib/pages/settings_views/global_settings_view/global_settings_view.dart b/lib/pages/settings_views/global_settings_view/global_settings_view.dart index 2f52b9c37..822a558fa 100644 --- a/lib/pages/settings_views/global_settings_view/global_settings_view.dart +++ b/lib/pages/settings_views/global_settings_view/global_settings_view.dart @@ -15,8 +15,8 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/syncing_pr import 'package:stackwallet/pages/settings_views/sub_widgets/settings_list_button.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -31,7 +31,7 @@ class GlobalSettingsView extends StatelessWidget { Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -231,7 +231,7 @@ class GlobalSettingsView extends StatelessWidget { // ?.copyWith( // backgroundColor: // MaterialStateProperty.all( - // CFColors.stackAccent, + // StackTheme.instance.color.accentColorDark // ), // ), // child: Text( diff --git a/lib/pages/settings_views/global_settings_view/hidden_settings.dart b/lib/pages/settings_views/global_settings_view/hidden_settings.dart index 43929b94f..d79d77e08 100644 --- a/lib/pages/settings_views/global_settings_view/hidden_settings.dart +++ b/lib/pages/settings_views/global_settings_view/hidden_settings.dart @@ -5,9 +5,9 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/providers/global/debug_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; class HiddenSettings extends StatelessWidget { @@ -18,7 +18,7 @@ class HiddenSettings extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: Container(), title: Text( @@ -64,8 +64,8 @@ class HiddenSettings extends StatelessWidget { child: Text( "Delete notifications", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ), ); @@ -92,7 +92,7 @@ class HiddenSettings extends StatelessWidget { // child: Text( // "Delete trade history", // style: STextStyles.button.copyWith( - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark // ), // ), // ), @@ -118,8 +118,8 @@ class HiddenSettings extends StatelessWidget { child: Text( "Delete Debug Logs", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ), ); @@ -147,7 +147,7 @@ class HiddenSettings extends StatelessWidget { // child: Text( // "Lottie test", // style: STextStyles.button.copyWith( - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark // ), // ), // ), diff --git a/lib/pages/settings_views/global_settings_view/language_view.dart b/lib/pages/settings_views/global_settings_view/language_view.dart index e9941b82a..15a823a57 100644 --- a/lib/pages/settings_views/global_settings_view/language_view.dart +++ b/lib/pages/settings_views/global_settings_view/language_view.dart @@ -3,10 +3,10 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/languages_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; @@ -99,7 +99,7 @@ class _LanguageViewState extends ConsumerState { } listWithoutSelected = _filtered(); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -201,7 +201,7 @@ class _LanguageViewState extends ConsumerState { (context, index) { return Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: _borderRadius(index), ), child: Padding( @@ -211,8 +211,8 @@ class _LanguageViewState extends ConsumerState { child: RoundedContainer( padding: const EdgeInsets.all(0), color: index == 0 - ? CFColors.selected - : CFColors.white, + ? StackTheme.instance.color.currencyListItemBG + : StackTheme.instance.color.popupBG, child: RawMaterialButton( onPressed: () async { onTap(index); @@ -232,7 +232,8 @@ class _LanguageViewState extends ConsumerState { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance.color + .radioButtonIconEnabled, value: true, groupValue: index == 0, onChanged: (_) { diff --git a/lib/pages/settings_views/global_settings_view/manage_nodes_views/add_edit_node_view.dart b/lib/pages/settings_views/global_settings_view/manage_nodes_views/add_edit_node_view.dart index def35b800..7a588c895 100644 --- a/lib/pages/settings_views/global_settings_view/manage_nodes_views/add_edit_node_view.dart +++ b/lib/pages/settings_views/global_settings_view/manage_nodes_views/add_edit_node_view.dart @@ -11,7 +11,6 @@ import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/providers/global/node_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; @@ -20,6 +19,7 @@ import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/test_epic_box_connection.dart'; import 'package:stackwallet/utilities/test_monero_node_connection.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -118,6 +118,7 @@ class _AddEditNodeViewState extends ConsumerState { case Coin.firo: case Coin.namecoin: case Coin.bitcoinTestNet: + case Coin.bitcoincashTestnet: case Coin.firoTestNet: case Coin.dogecoinTestNet: final client = ElectrumX( @@ -139,17 +140,17 @@ class _AddEditNodeViewState extends ConsumerState { if (showFlushBar) { if (testPassed) { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.success, message: "Server ping success", context: context, - ); + )); } else { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, message: "Server unreachable", context: context, - ); + )); } } @@ -191,7 +192,7 @@ class _AddEditNodeViewState extends ConsumerState { : null; return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -222,10 +223,10 @@ class _AddEditNodeViewState extends ConsumerState { key: const Key("deleteNodeAppBarButtonKey"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.trash, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), @@ -292,31 +293,24 @@ class _AddEditNodeViewState extends ConsumerState { await _testConnection(); } : null, - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Test connection", style: STextStyles.button.copyWith( color: testConnectionEnabled - ? CFColors.stackAccent - : CFColors.white, + ? StackTheme.instance.color.textDark + : StackTheme.instance.color.textWhite, ), ), ), const SizedBox(height: 16), TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - saveEnabled - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: saveEnabled + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: saveEnabled ? () async { final canConnect = await _testConnection( @@ -340,24 +334,17 @@ class _AddEditNodeViewState extends ConsumerState { child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color + .accentColorDark), ), ), rightButton: TextButton( onPressed: () async { Navigator.of(context).pop(true); }, - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all< - Color>( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor( + context), child: Text( "Save", style: STextStyles.button, @@ -897,7 +884,7 @@ class _NodeFormState extends ConsumerState { child: Checkbox( fillColor: widget.readOnly ? MaterialStateProperty.all( - CFColors.disabledButton) + StackTheme.instance.color.checkboxBGDisabled) : null, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, diff --git a/lib/pages/settings_views/global_settings_view/manage_nodes_views/coin_nodes_view.dart b/lib/pages/settings_views/global_settings_view/manage_nodes_views/coin_nodes_view.dart index e4b28db78..6fc990cb1 100644 --- a/lib/pages/settings_views/global_settings_view/manage_nodes_views/coin_nodes_view.dart +++ b/lib/pages/settings_views/global_settings_view/manage_nodes_views/coin_nodes_view.dart @@ -4,9 +4,9 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/manage_nodes_views/add_edit_node_view.dart'; import 'package:stackwallet/pages/settings_views/sub_widgets/nodes_list.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:tuple/tuple.dart'; @@ -38,7 +38,7 @@ class _CoinNodesViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -62,10 +62,10 @@ class _CoinNodesViewState extends ConsumerState { key: const Key("manageNodesAddNewNodeButtonKey"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.plus, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), diff --git a/lib/pages/settings_views/global_settings_view/manage_nodes_views/manage_nodes_view.dart b/lib/pages/settings_views/global_settings_view/manage_nodes_views/manage_nodes_view.dart index 140be8724..7ea1a48a9 100644 --- a/lib/pages/settings_views/global_settings_view/manage_nodes_views/manage_nodes_view.dart +++ b/lib/pages/settings_views/global_settings_view/manage_nodes_views/manage_nodes_view.dart @@ -4,10 +4,10 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/manage_nodes_views/coin_nodes_view.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -48,7 +48,7 @@ class _ManageNodesViewState extends ConsumerState { : _coins.sublist(0, _coins.length - kTestNetCoinCount); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -82,7 +82,7 @@ class _ManageNodesViewState extends ConsumerState { child: RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, diff --git a/lib/pages/settings_views/global_settings_view/manage_nodes_views/node_details_view.dart b/lib/pages/settings_views/global_settings_view/manage_nodes_views/node_details_view.dart index a188acc01..4756e30b7 100644 --- a/lib/pages/settings_views/global_settings_view/manage_nodes_views/node_details_view.dart +++ b/lib/pages/settings_views/global_settings_view/manage_nodes_views/node_details_view.dart @@ -7,10 +7,8 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/electrumx_rpc/electrumx.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/manage_nodes_views/add_edit_node_view.dart'; -import 'package:stackwallet/providers/global/node_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; @@ -18,6 +16,7 @@ import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/test_epic_box_connection.dart'; import 'package:stackwallet/utilities/test_monero_node_connection.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:tuple/tuple.dart'; @@ -103,6 +102,9 @@ class _NodeDetailsViewState extends ConsumerState { case Coin.bitcoinTestNet: case Coin.firoTestNet: case Coin.dogecoinTestNet: + case Coin.bitcoincash: + case Coin.namecoin: + case Coin.bitcoincashTestnet: final client = ElectrumX( host: node!.host, port: node.port, @@ -138,7 +140,7 @@ class _NodeDetailsViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -169,10 +171,10 @@ class _NodeDetailsViewState extends ConsumerState { key: const Key("nodeDetailsEditNodeAppBarButtonKey"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.pencil, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), @@ -221,19 +223,16 @@ class _NodeDetailsViewState extends ConsumerState { ), const Spacer(), TextButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), onPressed: () async { await _testConnection(ref, context); }, child: Text( "Test connection", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: + StackTheme.instance.color.accentColorDark), ), ), const SizedBox(height: 16), diff --git a/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart b/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart index abb372f8c..31cf2f9c9 100644 --- a/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart +++ b/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart @@ -4,11 +4,11 @@ import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/security_views/security_view.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_pin_put/custom_pin_put.dart'; @@ -31,8 +31,9 @@ class ChangePinView extends StatefulWidget { class _ChangePinViewState extends State { BoxDecoration get _pinPutDecoration { return BoxDecoration( - color: CFColors.gray3, - border: Border.all(width: 1, color: CFColors.gray3), + color: StackTheme.instance.color.textSubtitle2, + border: + Border.all(width: 1, color: StackTheme.instance.color.textSubtitle2), borderRadius: BorderRadius.circular(6), ); } @@ -69,7 +70,7 @@ class _ChangePinViewState extends State { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -112,21 +113,21 @@ class _ChangePinViewState extends State { controller: _pinPutController1, useNativeKeyboard: false, obscureText: "", - inputDecoration: const InputDecoration( + inputDecoration: InputDecoration( border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none, disabledBorder: InputBorder.none, errorBorder: InputBorder.none, focusedErrorBorder: InputBorder.none, - fillColor: CFColors.almostWhite, + fillColor: StackTheme.instance.color.background, counterText: "", ), submittedFieldDecoration: _pinPutDecoration.copyWith( - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, border: Border.all( width: 1, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, ), ), selectedFieldDecoration: _pinPutDecoration, @@ -168,21 +169,21 @@ class _ChangePinViewState extends State { controller: _pinPutController2, useNativeKeyboard: false, obscureText: "", - inputDecoration: const InputDecoration( + inputDecoration: InputDecoration( border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none, disabledBorder: InputBorder.none, errorBorder: InputBorder.none, focusedErrorBorder: InputBorder.none, - fillColor: CFColors.almostWhite, + fillColor: StackTheme.instance.color.background, counterText: "", ), submittedFieldDecoration: _pinPutDecoration.copyWith( - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, border: Border.all( width: 1, - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, ), ), selectedFieldDecoration: _pinPutDecoration, diff --git a/lib/pages/settings_views/global_settings_view/security_views/security_view.dart b/lib/pages/settings_views/global_settings_view/security_views/security_view.dart index 1cb1a6a92..7e2ca290e 100644 --- a/lib/pages/settings_views/global_settings_view/security_views/security_view.dart +++ b/lib/pages/settings_views/global_settings_view/security_views/security_view.dart @@ -4,9 +4,9 @@ import 'package:stackwallet/pages/pinpad_views/lock_screen_view.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/route_generator.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -23,7 +23,7 @@ class SecurityView extends StatelessWidget { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -43,7 +43,7 @@ class SecurityView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -92,7 +92,7 @@ class SecurityView extends StatelessWidget { child: Consumer( builder: (_, ref, __) { return RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/auto_backup_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/auto_backup_view.dart index 0b97c5582..c334bdaf9 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/auto_backup_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/auto_backup_view.dart @@ -6,11 +6,11 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/edit_auto_backup_view.dart'; import 'package:stackwallet/providers/global/auto_swb_service_provider.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/backup_frequency_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; @@ -81,15 +81,11 @@ class _AutoBackupViewState extends ConsumerState { title: "Enable Auto Backup", message: "To enable Auto Backup, you need to create a backup file.", leftButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Back", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), onPressed: () { @@ -97,11 +93,7 @@ class _AutoBackupViewState extends ConsumerState { }, ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), child: Text( "Continue", style: STextStyles.button, @@ -141,15 +133,11 @@ class _AutoBackupViewState extends ConsumerState { message: "You are turning off Auto Backup. You can turn it back on at any time. Your previous Auto Backup file will not be deleted. Remember to backup your wallets manually so you don't lose important information.", leftButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Back", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), onPressed: () { @@ -157,11 +145,7 @@ class _AutoBackupViewState extends ConsumerState { }, ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), child: Text( "Disable", style: STextStyles.button, @@ -230,7 +214,7 @@ class _AutoBackupViewState extends ConsumerState { }); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -250,7 +234,7 @@ class _AutoBackupViewState extends ConsumerState { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -363,7 +347,8 @@ class _AutoBackupViewState extends ConsumerState { controller: fileLocationController, enabled: false, style: STextStyles.field.copyWith( - color: CFColors.stackAccent.withOpacity(0.5), + color: + StackTheme.instance.color.textDark.withOpacity(0.5), ), readOnly: true, enableSuggestions: false, @@ -393,7 +378,8 @@ class _AutoBackupViewState extends ConsumerState { controller: passwordController, enabled: false, style: STextStyles.field.copyWith( - color: CFColors.stackAccent.withOpacity(0.5), + color: + StackTheme.instance.color.textDark.withOpacity(0.5), ), obscureText: true, enableSuggestions: false, @@ -425,7 +411,8 @@ class _AutoBackupViewState extends ConsumerState { controller: frequencyController, enabled: false, style: STextStyles.field.copyWith( - color: CFColors.stackAccent.withOpacity(0.5), + color: + StackTheme.instance.color.textDark.withOpacity(0.5), ), toolbarOptions: const ToolbarOptions( copy: true, diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/create_auto_backup_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/create_auto_backup_view.dart index c711137a1..dc180d37a 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/create_auto_backup_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/create_auto_backup_view.dart @@ -14,13 +14,13 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_views/backup_frequency_type_select_sheet.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/progress_bar.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -102,7 +102,7 @@ class _EnableAutoBackupViewState extends ConsumerState { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -164,7 +164,7 @@ class _EnableAutoBackupViewState extends ConsumerState { ), SvgPicture.asset( Assets.svg.folder, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -223,7 +223,7 @@ class _EnableAutoBackupViewState extends ConsumerState { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -302,11 +302,12 @@ class _EnableAutoBackupViewState extends ConsumerState { width: MediaQuery.of(context).size.width - 32 - 24, height: 5, fillColor: passwordStrength < 0.51 - ? CFColors.stackRed + ? StackTheme.instance.color.accentColorRed : passwordStrength < 1 - ? CFColors.stackYellow - : CFColors.stackGreen, - backgroundColor: CFColors.buttonGray, + ? StackTheme.instance.color.accentColorYellow + : StackTheme.instance.color.accentColorGreen, + backgroundColor: + StackTheme.instance.color.buttonBackSecondary, percent: passwordStrength < 0.25 ? 0.03 : passwordStrength, ), @@ -348,7 +349,7 @@ class _EnableAutoBackupViewState extends ConsumerState { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -384,7 +385,7 @@ class _EnableAutoBackupViewState extends ConsumerState { ), Positioned.fill( child: RawMaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -421,7 +422,8 @@ class _EnableAutoBackupViewState extends ConsumerState { padding: const EdgeInsets.only(right: 4.0), child: SvgPicture.asset( Assets.svg.chevronDown, - color: CFColors.gray3, + color: StackTheme + .instance.color.textSubtitle2, width: 12, height: 6, ), @@ -438,13 +440,11 @@ class _EnableAutoBackupViewState extends ConsumerState { height: 10, ), TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - shouldEnableCreate - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: shouldEnableCreate + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: !shouldEnableCreate ? null : () async { diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_information_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_information_view.dart index 4b0a1aaac..04e3223f2 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_information_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_information_view.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/create_backup_view.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -13,7 +13,7 @@ class CreateBackupInfoView extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -63,14 +63,8 @@ class CreateBackupInfoView extends StatelessWidget { ), const Spacer(), TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), onPressed: () { Navigator.of(context) .pushNamed(CreateBackupView.routeName); diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_view.dart index c22e71651..40db27635 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/create_backup_view.dart @@ -1,3 +1,4 @@ +import 'dart:async'; import 'dart:convert'; import 'dart:io'; @@ -8,11 +9,11 @@ import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/helpers/restore_create_backup.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/helpers/stack_file_system.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/progress_bar.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -81,7 +82,7 @@ class _RestoreFromFileViewState extends State { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -163,7 +164,8 @@ class _RestoreFromFileViewState extends State { ), SvgPicture.asset( Assets.svg.folder, - color: CFColors.neutral50, + color: + StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -226,7 +228,8 @@ class _RestoreFromFileViewState extends State { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: + StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -305,11 +308,14 @@ class _RestoreFromFileViewState extends State { width: MediaQuery.of(context).size.width - 32 - 24, height: 5, fillColor: passwordStrength < 0.51 - ? CFColors.stackRed + ? StackTheme.instance.color.accentColorRed : passwordStrength < 1 - ? CFColors.stackYellow - : CFColors.stackGreen, - backgroundColor: CFColors.buttonGray, + ? StackTheme + .instance.color.accentColorYellow + : StackTheme + .instance.color.accentColorGreen, + backgroundColor: + StackTheme.instance.color.buttonBackSecondary, percent: passwordStrength < 0.25 ? 0.03 : passwordStrength, @@ -352,7 +358,8 @@ class _RestoreFromFileViewState extends State { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: + StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -375,16 +382,11 @@ class _RestoreFromFileViewState extends State { ), const Spacer(), TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - shouldEnableCreate - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: shouldEnableCreate + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: !shouldEnableCreate ? null : () async { @@ -396,46 +398,46 @@ class _RestoreFromFileViewState extends State { passwordRepeatController.text; if (pathToSave.isEmpty) { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, message: "Directory not chosen", context: context, - ); + )); return; } if (!(await Directory(pathToSave).exists())) { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, message: "Directory does not exist", context: context, - ); + )); return; } if (passphrase.isEmpty) { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, message: "A passphrase is required", context: context, - ); + )); return; } if (passphrase != repeatPassphrase) { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, message: "Passphrase does not match", context: context, - ); + )); return; } - showDialog( + unawaited(showDialog( context: context, barrierDismissible: false, builder: (_) => const StackDialog( title: "Encrypting backup", message: "This shouldn't take long", ), - ); + )); // make sure the dialog is able to be displayed for at least 1 second await Future.delayed( const Duration(seconds: 1)); diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/dialogs/cancel_stack_restore_dialog.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/dialogs/cancel_stack_restore_dialog.dart index 9dc0b23d3..2f6accef4 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/dialogs/cancel_stack_restore_dialog.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/dialogs/cancel_stack_restore_dialog.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class CancelStackRestoreDialog extends StatelessWidget { @@ -19,11 +19,7 @@ class CancelStackRestoreDialog extends StatelessWidget { message: "Cancelling will revert any changes that may have been applied", leftButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Back", style: STextStyles.itemSubtitle12, @@ -33,15 +29,11 @@ class CancelStackRestoreDialog extends StatelessWidget { }, ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), child: Text( "Yes, cancel", style: STextStyles.itemSubtitle12.copyWith( - color: CFColors.white, + color: StackTheme.instance.color.buttonTextPrimary, ), ), onPressed: () { diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/edit_auto_backup_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/edit_auto_backup_view.dart index 6a3bed03e..44ca028e6 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/edit_auto_backup_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/edit_auto_backup_view.dart @@ -14,13 +14,13 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_views/backup_frequency_type_select_sheet.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/progress_bar.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -104,7 +104,7 @@ class _EditAutoBackupViewState extends ConsumerState { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -166,7 +166,7 @@ class _EditAutoBackupViewState extends ConsumerState { ), SvgPicture.asset( Assets.svg.folder, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -225,7 +225,7 @@ class _EditAutoBackupViewState extends ConsumerState { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -304,11 +304,12 @@ class _EditAutoBackupViewState extends ConsumerState { width: MediaQuery.of(context).size.width - 32 - 24, height: 5, fillColor: passwordStrength < 0.51 - ? CFColors.stackRed + ? StackTheme.instance.color.accentColorRed : passwordStrength < 1 - ? CFColors.stackYellow - : CFColors.stackGreen, - backgroundColor: CFColors.buttonGray, + ? StackTheme.instance.color.accentColorYellow + : StackTheme.instance.color.accentColorGreen, + backgroundColor: + StackTheme.instance.color.buttonBackSecondary, percent: passwordStrength < 0.25 ? 0.03 : passwordStrength, ), @@ -350,7 +351,7 @@ class _EditAutoBackupViewState extends ConsumerState { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -386,7 +387,7 @@ class _EditAutoBackupViewState extends ConsumerState { ), Positioned.fill( child: RawMaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -423,7 +424,8 @@ class _EditAutoBackupViewState extends ConsumerState { padding: const EdgeInsets.only(right: 4.0), child: SvgPicture.asset( Assets.svg.chevronDown, - color: CFColors.gray3, + color: StackTheme + .instance.color.textSubtitle2, width: 12, height: 6, ), @@ -440,13 +442,11 @@ class _EditAutoBackupViewState extends ConsumerState { height: 10, ), TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - shouldEnableCreate - ? CFColors.stackAccent - : CFColors.disabledButton, - ), - ), + style: shouldEnableCreate + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: !shouldEnableCreate ? null : () async { diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_encrypted_string_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_encrypted_string_view.dart index 639f1e34a..f38438f2b 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_encrypted_string_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_encrypted_string_view.dart @@ -8,10 +8,10 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_views/stack_restore_progress_view.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; import 'package:stackwallet/widgets/stack_text_field.dart'; @@ -63,7 +63,7 @@ class _RestoreFromEncryptedStringViewState return WillPopScope( onWillPop: _onWillPop, child: Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -128,7 +128,8 @@ class _RestoreFromEncryptedStringViewState hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: + StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -150,15 +151,11 @@ class _RestoreFromEncryptedStringViewState ), const Spacer(), TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - passwordController.text.isEmpty - ? CFColors.disabledButton - : CFColors.stackAccent, - ), - ), + style: passwordController.text.isEmpty + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: passwordController.text.isEmpty ? null : () async { @@ -192,7 +189,8 @@ class _RestoreFromEncryptedStringViewState "Decrypting Stack backup file", style: STextStyles.pageTitleH2 .copyWith( - color: CFColors.white, + color: StackTheme + .instance.color.textWhite, ), ), ), diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_file_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_file_view.dart index 261a16361..a8a17fd61 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_file_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/restore_from_file_view.dart @@ -10,11 +10,11 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_views/stack_restore_progress_view.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; import 'package:stackwallet/widgets/stack_text_field.dart'; @@ -64,7 +64,7 @@ class _RestoreFromFileViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -138,7 +138,7 @@ class _RestoreFromFileViewState extends ConsumerState { ), SvgPicture.asset( Assets.svg.folder, - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -196,7 +196,8 @@ class _RestoreFromFileViewState extends ConsumerState { hidePassword ? Assets.svg.eye : Assets.svg.eyeSlash, - color: CFColors.neutral50, + color: + StackTheme.instance.color.textDark3, width: 16, height: 16, ), @@ -218,17 +219,12 @@ class _RestoreFromFileViewState extends ConsumerState { ), const Spacer(), TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: MaterialStateProperty.all( - passwordController.text.isEmpty || - fileLocationController.text.isEmpty - ? CFColors.disabledButton - : CFColors.stackAccent, - ), - ), + style: passwordController.text.isEmpty || + fileLocationController.text.isEmpty + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: passwordController.text.isEmpty || fileLocationController.text.isEmpty ? null @@ -274,7 +270,8 @@ class _RestoreFromFileViewState extends ConsumerState { "Decrypting Stack backup file", style: STextStyles.pageTitleH2 .copyWith( - color: CFColors.white, + color: StackTheme + .instance.color.textWhite, ), ), ), diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/stack_backup_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/stack_backup_view.dart index b7e299816..a60c19acd 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/stack_backup_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/stack_backup_view.dart @@ -4,9 +4,9 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/create_backup_view.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/restore_from_file_view.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -22,7 +22,7 @@ class StackBackupView extends StatelessWidget { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -42,7 +42,7 @@ class StackBackupView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -83,7 +83,7 @@ class StackBackupView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -125,7 +125,7 @@ class StackBackupView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/backup_frequency_type_select_sheet.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/backup_frequency_type_select_sheet.dart index 6bc049ce1..1b20c11dd 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/backup_frequency_type_select_sheet.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/backup_frequency_type_select_sheet.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/backup_frequency_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class BackupFrequencyTypeSelectSheet extends ConsumerWidget { const BackupFrequencyTypeSelectSheet({ @@ -31,9 +31,9 @@ class BackupFrequencyTypeSelectSheet extends ConsumerWidget { return false; }, child: Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -51,7 +51,7 @@ class BackupFrequencyTypeSelectSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -94,13 +94,14 @@ class BackupFrequencyTypeSelectSheet extends ConsumerWidget { child: Container( color: Colors.transparent, child: Row( - crossAxisAlignment: CrossAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.start, children: [ SizedBox( width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme + .instance.color.radioButtonIconEnabled, value: BackupFrequencyType.values[i], groupValue: ref.watch( prefsChangeNotifierProvider.select( @@ -118,17 +119,17 @@ class BackupFrequencyTypeSelectSheet extends ConsumerWidget { const SizedBox( width: 12, ), - Column( - children: [ - Text( - prettyFrequencyType( - BackupFrequencyType.values[i]), - style: STextStyles.titleBold12.copyWith( - color: const Color(0xFF44464E), + Flexible( + child: Column( + children: [ + Text( + prettyFrequencyType( + BackupFrequencyType.values[i]), + style: STextStyles.titleBold12, + textAlign: TextAlign.left, ), - textAlign: TextAlign.left, - ), - ], + ], + ), ), ], ), diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/recovery_phrase_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/recovery_phrase_view.dart index 90b5a2c32..cbb504703 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/recovery_phrase_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/recovery_phrase_view.dart @@ -4,10 +4,10 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_view/sub_widgets/mnemonic_table.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; class RecoverPhraseView extends StatelessWidget { @@ -28,7 +28,7 @@ class RecoverPhraseView extends StatelessWidget { Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -41,7 +41,7 @@ class RecoverPhraseView extends StatelessWidget { child: AspectRatio( aspectRatio: 1, child: AppBarIconButton( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, shadows: const [], icon: SvgPicture.asset( Assets.svg.copy, @@ -93,6 +93,7 @@ class RecoverPhraseView extends StatelessWidget { child: SingleChildScrollView( child: MnemonicTable( words: mnemonic, + isDesktop: false, ), ), ), diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/stack_restore_progress_view.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/stack_restore_progress_view.dart index 81760a73e..7dfd1be13 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/stack_restore_progress_view.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_views/stack_restore_progress_view.dart @@ -1,3 +1,5 @@ +import 'dart:async'; + import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; @@ -11,10 +13,10 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/stack_restore/stack_restoring_ui_state_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/stack_restoring_status.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/addressbook_icon.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; @@ -39,7 +41,7 @@ class _StackRestoreProgressViewState extends ConsumerState { Future _cancel() async { bool shouldPop = false; - showDialog( + unawaited(showDialog( barrierDismissible: false, context: context, builder: (_) => WillPopScope( @@ -56,7 +58,7 @@ class _StackRestoreProgressViewState child: Text( "Cancelling restore. Please wait.", style: STextStyles.pageTitleH2.copyWith( - color: CFColors.white, + color: StackTheme.instance.color.textWhite, ), ), ), @@ -72,7 +74,7 @@ class _StackRestoreProgressViewState ], ), ), - ); + )); await SWB.cancelRestore(); shouldPop = true; @@ -138,22 +140,22 @@ class _StackRestoreProgressViewState case StackRestoringStatus.waiting: return SvgPicture.asset( Assets.svg.loader, - color: CFColors.buttonGray, + color: StackTheme.instance.color.buttonBackSecondary, ); case StackRestoringStatus.restoring: return SvgPicture.asset( Assets.svg.loader, - color: CFColors.stackGreen, + color: StackTheme.instance.color.accentColorGreen, ); case StackRestoringStatus.success: return SvgPicture.asset( Assets.svg.checkCircle, - color: CFColors.stackGreen, + color: StackTheme.instance.color.accentColorGreen, ); case StackRestoringStatus.failed: return SvgPicture.asset( Assets.svg.circleAlert, - color: CFColors.error, + color: StackTheme.instance.color.textError, ); } } @@ -178,7 +180,7 @@ class _StackRestoreProgressViewState return WillPopScope( onWillPop: _onWillPop, child: Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -237,13 +239,15 @@ class _StackRestoreProgressViewState height: 32, child: RoundedContainer( padding: const EdgeInsets.all(0), - color: CFColors.buttonGray, + color: + StackTheme.instance.color.buttonBackSecondary, child: Center( child: SvgPicture.asset( Assets.svg.gear, width: 16, height: 16, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.accentColorDark, ), ), ), @@ -271,17 +275,19 @@ class _StackRestoreProgressViewState final state = ref.watch(stackRestoringUIStateProvider .select((value) => value.addressBook)); return RestoringItemCard( - left: const SizedBox( + left: SizedBox( width: 32, height: 32, child: RoundedContainer( - padding: EdgeInsets.all(0), - color: CFColors.buttonGray, + padding: const EdgeInsets.all(0), + color: + StackTheme.instance.color.buttonBackSecondary, child: Center( child: AddressBookIcon( width: 16, height: 16, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.accentColorDark, ), ), ), @@ -314,13 +320,15 @@ class _StackRestoreProgressViewState height: 32, child: RoundedContainer( padding: const EdgeInsets.all(0), - color: CFColors.buttonGray, + color: + StackTheme.instance.color.buttonBackSecondary, child: Center( child: SvgPicture.asset( Assets.svg.node, width: 16, height: 16, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.accentColorDark, ), ), ), @@ -353,13 +361,15 @@ class _StackRestoreProgressViewState height: 32, child: RoundedContainer( padding: const EdgeInsets.all(0), - color: CFColors.buttonGray, + color: + StackTheme.instance.color.buttonBackSecondary, child: Center( child: SvgPicture.asset( Assets.svg.arrowRotate2, width: 16, height: 16, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.accentColorDark, ), ), ), @@ -423,10 +433,11 @@ class _StackRestoreProgressViewState } } }, + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( _success ? "OK" : "Cancel restore process", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.buttonTextPrimary, ), ), ), diff --git a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_wallet_card.dart b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_wallet_card.dart index 67e96947b..1c2019348 100644 --- a/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_wallet_card.dart +++ b/lib/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_wallet_card.dart @@ -7,10 +7,10 @@ import 'package:stackwallet/pages/settings_views/global_settings_view/stack_back import 'package:stackwallet/providers/stack_restore/stack_restoring_ui_state_provider.dart'; import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/stack_restoring_status.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; @@ -35,23 +35,23 @@ class _RestoringWalletCardState extends ConsumerState { case StackRestoringStatus.waiting: return SvgPicture.asset( Assets.svg.loader, - color: CFColors.buttonGray, + color: StackTheme.instance.color.buttonBackSecondary, ); case StackRestoringStatus.restoring: return const LoadingIndicator(); // return SvgPicture.asset( // Assets.svg.loader, - // color: CFColors.stackGreen, + // color: StackTheme.instance.color.accentColorGreen, // ); case StackRestoringStatus.success: return SvgPicture.asset( Assets.svg.checkCircle, - color: CFColors.stackGreen, + color: StackTheme.instance.color.accentColorGreen, ); case StackRestoringStatus.failed: return SvgPicture.asset( Assets.svg.circleAlert, - color: CFColors.error, + color: StackTheme.instance.color.textError, ); } } @@ -73,7 +73,7 @@ class _RestoringWalletCardState extends ConsumerState { height: 32, child: RoundedContainer( padding: const EdgeInsets.all(0), - color: CFColors.coin.forCoin(coin), + color: StackTheme.instance.colorForCoin(coin), child: Center( child: SvgPicture.asset( Assets.svg.iconFor( @@ -155,14 +155,14 @@ class _RestoringWalletCardState extends ConsumerState { ? Container( height: 20, decoration: BoxDecoration( - color: CFColors.buttonGray, + color: StackTheme.instance.color.buttonBackSecondary, borderRadius: BorderRadius.circular( 1000, ), ), child: RawMaterialButton( materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( 1000, @@ -187,8 +187,7 @@ class _RestoringWalletCardState extends ConsumerState { child: Text( "Show recovery phrase", style: STextStyles.infoSmall.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color.accentColorDark), ), ), ), diff --git a/lib/pages/settings_views/global_settings_view/startup_preferences/startup_preferences_view.dart b/lib/pages/settings_views/global_settings_view/startup_preferences/startup_preferences_view.dart index 861886625..56950d0fc 100644 --- a/lib/pages/settings_views/global_settings_view/startup_preferences/startup_preferences_view.dart +++ b/lib/pages/settings_views/global_settings_view/startup_preferences/startup_preferences_view.dart @@ -2,9 +2,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/startup_preferences/startup_wallet_selection_view.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -23,7 +23,7 @@ class _StartupPreferencesViewState @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -56,7 +56,7 @@ class _StartupPreferencesViewState Padding( padding: const EdgeInsets.all(4.0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -81,7 +81,8 @@ class _StartupPreferencesViewState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance + .color.radioButtonIconEnabled, value: false, groupValue: ref.watch( prefsChangeNotifierProvider @@ -128,7 +129,7 @@ class _StartupPreferencesViewState Padding( padding: const EdgeInsets.all(4), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -153,7 +154,8 @@ class _StartupPreferencesViewState width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance + .color.radioButtonIconEnabled, value: true, groupValue: ref.watch( prefsChangeNotifierProvider @@ -222,7 +224,7 @@ class _StartupPreferencesViewState ), Flexible( child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( diff --git a/lib/pages/settings_views/global_settings_view/startup_preferences/startup_wallet_selection_view.dart b/lib/pages/settings_views/global_settings_view/startup_preferences/startup_wallet_selection_view.dart index 9569419e5..f39b95367 100644 --- a/lib/pages/settings_views/global_settings_view/startup_preferences/startup_wallet_selection_view.dart +++ b/lib/pages/settings_views/global_settings_view/startup_preferences/startup_wallet_selection_view.dart @@ -3,9 +3,9 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -34,7 +34,7 @@ class _StartupWalletSelectionViewState } return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -90,8 +90,8 @@ class _StartupWalletSelectionViewState children: [ Container( decoration: BoxDecoration( - color: CFColors.coin - .forCoin(manager.coin) + color: StackTheme.instance + .colorForCoin(manager.coin) .withOpacity(0.5), borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -161,7 +161,8 @@ class _StartupWalletSelectionViewState height: 20, width: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance.color + .radioButtonIconEnabled, value: manager.walletId, groupValue: ref.watch( prefsChangeNotifierProvider.select( diff --git a/lib/pages/settings_views/global_settings_view/support_view.dart b/lib/pages/settings_views/global_settings_view/support_view.dart index 3b62e0fb8..a820b9220 100644 --- a/lib/pages/settings_views/global_settings_view/support_view.dart +++ b/lib/pages/settings_views/global_settings_view/support_view.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:url_launcher/url_launcher.dart'; @@ -21,7 +21,7 @@ class SupportView extends StatelessWidget { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -50,7 +50,7 @@ class SupportView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -94,7 +94,7 @@ class SupportView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -138,7 +138,7 @@ class SupportView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -182,7 +182,7 @@ class SupportView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( @@ -226,7 +226,7 @@ class SupportView extends StatelessWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( diff --git a/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_options_view.dart b/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_options_view.dart index 5bf9f5275..4e4562f59 100644 --- a/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_options_view.dart +++ b/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_options_view.dart @@ -2,10 +2,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/syncing_preferences_views/wallet_syncing_options_view.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/sync_type_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -17,7 +17,7 @@ class SyncingOptionsView extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -49,7 +49,7 @@ class SyncingOptionsView extends ConsumerWidget { Padding( padding: const EdgeInsets.all(4), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -90,7 +90,8 @@ class SyncingOptionsView extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance + .color.radioButtonIconEnabled, value: SyncingType.currentWalletOnly, groupValue: ref.watch( @@ -138,7 +139,7 @@ class SyncingOptionsView extends ConsumerWidget { Padding( padding: const EdgeInsets.all(4.0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -177,7 +178,8 @@ class SyncingOptionsView extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance + .color.radioButtonIconEnabled, value: SyncingType.allWalletsOnStartup, groupValue: ref.watch( @@ -225,7 +227,7 @@ class SyncingOptionsView extends ConsumerWidget { Padding( padding: const EdgeInsets.all(4), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -268,7 +270,8 @@ class SyncingOptionsView extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: StackTheme.instance + .color.radioButtonIconEnabled, value: SyncingType .selectedWalletsAtStartup, groupValue: ref.watch( @@ -340,7 +343,7 @@ class SyncingOptionsView extends ConsumerWidget { ), Flexible( child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( diff --git a/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_preferences_view.dart b/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_preferences_view.dart index 82f723623..3f60cd9c3 100644 --- a/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_preferences_view.dart +++ b/lib/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_preferences_view.dart @@ -2,10 +2,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/syncing_preferences_views/syncing_options_view.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/sync_type_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -29,7 +29,7 @@ class SyncingPreferencesView extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -57,7 +57,7 @@ class SyncingPreferencesView extends ConsumerWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, padding: const EdgeInsets.all(0), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, @@ -104,7 +104,7 @@ class SyncingPreferencesView extends ConsumerWidget { child: Consumer( builder: (_, ref, __) { return RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( diff --git a/lib/pages/settings_views/global_settings_view/syncing_preferences_views/wallet_syncing_options_view.dart b/lib/pages/settings_views/global_settings_view/syncing_preferences_views/wallet_syncing_options_view.dart index 29fc3a4c8..12d69225c 100644 --- a/lib/pages/settings_views/global_settings_view/syncing_preferences_views/wallet_syncing_options_view.dart +++ b/lib/pages/settings_views/global_settings_view/syncing_preferences_views/wallet_syncing_options_view.dart @@ -4,12 +4,12 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/sync_type_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart'; @@ -26,7 +26,7 @@ class WalletSyncingOptionsView extends ConsumerWidget { .watch(walletsChangeNotifierProvider.select((value) => value.managers)); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () async { @@ -82,8 +82,8 @@ class WalletSyncingOptionsView extends ConsumerWidget { children: [ Container( decoration: BoxDecoration( - color: CFColors.coin - .forCoin(manager.coin) + color: StackTheme.instance + .colorForCoin(manager.coin) .withOpacity(0.5), borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, diff --git a/lib/pages/settings_views/sub_widgets/settings_list_button.dart b/lib/pages/settings_views/sub_widgets/settings_list_button.dart index eb25a8e1b..33b463d1f 100644 --- a/lib/pages/settings_views/sub_widgets/settings_list_button.dart +++ b/lib/pages/settings_views/sub_widgets/settings_list_button.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class SettingsListButton extends StatelessWidget { const SettingsListButton({ @@ -21,7 +21,7 @@ class SettingsListButton extends StatelessWidget { @override Widget build(BuildContext context) { return RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, constraints: const BoxConstraints( minHeight: 32, minWidth: 32, @@ -41,7 +41,7 @@ class SettingsListButton extends StatelessWidget { width: 32, height: 32, decoration: BoxDecoration( - color: CFColors.buttonGray, + color: StackTheme.instance.color.buttonBackSecondary, borderRadius: BorderRadius.circular(100), ), child: Center( @@ -51,7 +51,7 @@ class SettingsListButton extends StatelessWidget { child: Center( child: SvgPicture.asset( iconAssetName, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: iconSize, height: iconSize, ), @@ -66,7 +66,7 @@ class SettingsListButton extends StatelessWidget { child: Text( title, style: STextStyles.smallMed14.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), ), diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_backup_views/wallet_backup_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_backup_views/wallet_backup_view.dart index ad46137ba..1ac496507 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_backup_views/wallet_backup_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_backup_views/wallet_backup_view.dart @@ -8,11 +8,11 @@ import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_vi import 'package:stackwallet/providers/global/wallets_provider.dart'; import 'package:stackwallet/utilities/address_utils.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -34,7 +34,7 @@ class WalletBackupView extends ConsumerWidget { Widget build(BuildContext context, WidgetRef ref) { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -51,7 +51,7 @@ class WalletBackupView extends ConsumerWidget { child: AspectRatio( aspectRatio: 1, child: AppBarIconButton( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, shadows: const [], icon: SvgPicture.asset( Assets.svg.copy, @@ -104,7 +104,7 @@ class WalletBackupView extends ConsumerWidget { ), Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular(Constants.size.circularBorderRadius), ), @@ -123,6 +123,7 @@ class WalletBackupView extends ConsumerWidget { child: SingleChildScrollView( child: MnemonicTable( words: mnemonic, + isDesktop: false, ), ), ), @@ -130,11 +131,7 @@ class WalletBackupView extends ConsumerWidget { height: 12, ), TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), onPressed: () { String data = AddressUtils.encodeQRSeedData(mnemonic); @@ -164,11 +161,12 @@ class WalletBackupView extends ConsumerWidget { width: width + 20, height: width + 20, child: QrImage( - data: data, - size: width, - backgroundColor: CFColors.white, - foregroundColor: CFColors.stackAccent, - ), + data: data, + size: width, + backgroundColor: + StackTheme.instance.color.popupBG, + foregroundColor: StackTheme + .instance.color.accentColorDark), ), ), ), @@ -183,17 +181,13 @@ class WalletBackupView extends ConsumerWidget { // await _capturePng(true); Navigator.of(context).pop(); }, - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ), ), diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/confirm_full_rescan.dart b/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/confirm_full_rescan.dart index 90d1ed8a2..7f41bed7e 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/confirm_full_rescan.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/confirm_full_rescan.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class ConfirmFullRescanDialog extends StatelessWidget { @@ -20,11 +20,7 @@ class ConfirmFullRescanDialog extends StatelessWidget { message: "Warning! It may take a while. If you exit before completion, you will have to redo the process.", leftButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.itemSubtitle12, @@ -34,11 +30,7 @@ class ConfirmFullRescanDialog extends StatelessWidget { }, ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), child: Text( "Rescan", style: STextStyles.button, diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/rescanning_dialog.dart b/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/rescanning_dialog.dart index 85f5bbf92..6f713b8fb 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/rescanning_dialog.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/sub_widgets/rescanning_dialog.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class RescanningDialog extends StatefulWidget { @@ -62,7 +62,7 @@ class _RescanningDialogState extends State Assets.svg.arrowRotate3, width: 24, height: 24, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), // rightButton: TextButton( diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart index 479ef9716..cede8e4f6 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart @@ -18,10 +18,10 @@ import 'package:stackwallet/services/event_bus/events/global/refresh_percent_cha import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/global_event_bus.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; @@ -107,11 +107,8 @@ class _WalletNetworkSettingsViewState builder: (context) => StackDialog( title: "Rescan completed", rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: + StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Ok", style: STextStyles.itemSubtitle12, @@ -139,11 +136,8 @@ class _WalletNetworkSettingsViewState title: "Rescan failed", message: e.toString(), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: + StackTheme.instance.getSecondaryEnabledButtonColor(context), child: Text( "Ok", style: STextStyles.itemSubtitle12, @@ -287,7 +281,7 @@ class _WalletNetworkSettingsViewState } return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -311,10 +305,10 @@ class _WalletNetworkSettingsViewState key: const Key("walletNetworkSettingsAddNewNodeViewButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.verticalEllipsis, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), @@ -331,7 +325,7 @@ class _WalletNetworkSettingsViewState right: 10, child: Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius), // boxShadow: [CFColors.standardBoxShadow], @@ -424,7 +418,8 @@ class _WalletNetworkSettingsViewState width: _iconSize, height: _iconSize, decoration: BoxDecoration( - color: CFColors.stackGreen.withOpacity(0.2), + color: StackTheme.instance.color.accentColorGreen + .withOpacity(0.2), borderRadius: BorderRadius.circular(_iconSize), ), child: Center( @@ -432,7 +427,8 @@ class _WalletNetworkSettingsViewState Assets.svg.radio, height: 14, width: 14, - color: CFColors.stackGreen, + color: + StackTheme.instance.color.accentColorGreen, ), ), ), @@ -454,7 +450,8 @@ class _WalletNetworkSettingsViewState Text( "100%", style: STextStyles.syncPercent.copyWith( - color: CFColors.stackGreen, + color: StackTheme + .instance.color.accentColorGreen, ), ), ], @@ -466,8 +463,10 @@ class _WalletNetworkSettingsViewState ProgressBar( width: progressLength, height: 5, - fillColor: CFColors.stackGreen, - backgroundColor: CFColors.fieldGray, + fillColor: + StackTheme.instance.color.accentColorGreen, + backgroundColor: StackTheme + .instance.color.textFieldDefaultBG, percent: 1, ), ], @@ -483,7 +482,8 @@ class _WalletNetworkSettingsViewState width: _iconSize, height: _iconSize, decoration: BoxDecoration( - color: CFColors.stackYellow.withOpacity(0.2), + color: StackTheme.instance.color.accentColorYellow + .withOpacity(0.2), borderRadius: BorderRadius.circular(_iconSize), ), child: Center( @@ -491,7 +491,8 @@ class _WalletNetworkSettingsViewState Assets.svg.radioSyncing, height: 14, width: 14, - color: CFColors.stackYellow, + color: + StackTheme.instance.color.accentColorYellow, ), ), ), @@ -521,7 +522,8 @@ class _WalletNetworkSettingsViewState _percentString(_percent), style: STextStyles.syncPercent.copyWith( - color: CFColors.stackYellow, + color: StackTheme.instance.color + .accentColorYellow, ), ), if (coin == Coin.monero || @@ -530,7 +532,8 @@ class _WalletNetworkSettingsViewState " (Blocks to go: ${_blocksRemaining == -1 ? "?" : _blocksRemaining})", style: STextStyles.syncPercent .copyWith( - color: CFColors.stackYellow, + color: StackTheme.instance.color + .accentColorYellow, ), ), ], @@ -544,8 +547,10 @@ class _WalletNetworkSettingsViewState ProgressBar( width: progressLength, height: 5, - fillColor: CFColors.stackYellow, - backgroundColor: CFColors.fieldGray, + fillColor: + StackTheme.instance.color.accentColorYellow, + backgroundColor: StackTheme + .instance.color.textFieldDefaultBG, percent: _percent, ), ], @@ -561,7 +566,8 @@ class _WalletNetworkSettingsViewState width: _iconSize, height: _iconSize, decoration: BoxDecoration( - color: CFColors.link.withOpacity(0.2), + color: StackTheme.instance.color.accentColorRed + .withOpacity(0.2), borderRadius: BorderRadius.circular(_iconSize), ), child: Center( @@ -569,7 +575,7 @@ class _WalletNetworkSettingsViewState Assets.svg.radioProblem, height: 14, width: 14, - color: CFColors.link, + color: StackTheme.instance.color.accentColorRed, ), ), ), @@ -587,13 +593,15 @@ class _WalletNetworkSettingsViewState Text( "Unable to synchronize", style: STextStyles.w600_10.copyWith( - color: CFColors.link, + color: StackTheme + .instance.color.accentColorRed, ), ), Text( "0%", style: STextStyles.syncPercent.copyWith( - color: CFColors.link, + color: StackTheme + .instance.color.accentColorRed, ), ), ], @@ -605,8 +613,10 @@ class _WalletNetworkSettingsViewState ProgressBar( width: progressLength, height: 5, - fillColor: CFColors.link, - backgroundColor: CFColors.fieldGray, + fillColor: + StackTheme.instance.color.accentColorRed, + backgroundColor: StackTheme + .instance.color.textFieldDefaultBG, percent: 0, ), ], @@ -620,7 +630,7 @@ class _WalletNetworkSettingsViewState top: 12, ), child: RoundedContainer( - color: CFColors.warningBackground, + color: StackTheme.instance.color.warningBackground, child: Text( "Please check your internet connection and make sure your current node is not having issues.", style: STextStyles.baseXS, diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_settings_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_settings_view.dart index 99f8c0214..ba55644dc 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_settings_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_settings_view.dart @@ -22,10 +22,10 @@ import 'package:stackwallet/services/event_bus/events/global/node_connection_sta import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/global_event_bus.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:tuple/tuple.dart'; @@ -133,7 +133,7 @@ class _WalletSettingsViewState extends State { Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -297,17 +297,13 @@ class _WalletSettingsViewState extends State { ModalRoute.withName(HomeView.routeName), ); }, - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Log out", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ); }, @@ -409,9 +405,8 @@ class _EpiBoxInfoFormState extends ConsumerState { }, child: Text( "Save", - style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith(color: StackTheme.instance.color.accentColorDark), ), ), ], diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_recovery_phrase_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_recovery_phrase_view.dart index 2ad55ae68..a28f1ea16 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_recovery_phrase_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_recovery_phrase_view.dart @@ -8,11 +8,11 @@ import 'package:stackwallet/pages/home_view/home_view.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -55,7 +55,7 @@ class _DeleteWalletRecoveryPhraseViewState debugPrint("BUILD: $runtimeType"); return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -68,7 +68,7 @@ class _DeleteWalletRecoveryPhraseViewState child: AspectRatio( aspectRatio: 1, child: AppBarIconButton( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, shadows: const [], icon: SvgPicture.asset( Assets.svg.copy, @@ -119,7 +119,7 @@ class _DeleteWalletRecoveryPhraseViewState ), Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular(Constants.size.circularBorderRadius), ), @@ -128,8 +128,7 @@ class _DeleteWalletRecoveryPhraseViewState child: Text( "Please write down your recovery phrase in the correct order and save it to keep your funds secure. You will also be asked to verify the words on the next screen.", style: STextStyles.label.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color.accentColorDark), ), ), ), @@ -140,6 +139,7 @@ class _DeleteWalletRecoveryPhraseViewState child: SingleChildScrollView( child: MnemonicTable( words: _mnemonic, + isDesktop: false, ), ), ), @@ -147,11 +147,7 @@ class _DeleteWalletRecoveryPhraseViewState height: 16, ), TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), onPressed: () { showDialog( barrierDismissible: true, @@ -159,27 +155,20 @@ class _DeleteWalletRecoveryPhraseViewState builder: (_) => StackDialog( title: "Thanks! Your wallet will be deleted.", leftButton: TextButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), onPressed: () { Navigator.pop(context); }, child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color.accentColorDark), ), ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), onPressed: () async { final walletId = _manager.walletId; final walletsInstance = diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_warning_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_warning_view.dart index ea4013917..7c5fd3720 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_warning_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_warning_view.dart @@ -2,8 +2,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/delete_wallet_recovery_phrase_view.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; import 'package:tuple/tuple.dart'; @@ -21,7 +21,7 @@ class DeleteWalletWarningView extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -51,7 +51,7 @@ class DeleteWalletWarningView extends ConsumerWidget { height: 16, ), RoundedContainer( - color: CFColors.warningBackground, + color: StackTheme.instance.color.warningBackground, child: Text( "You are going to permanently delete you wallet.\n\nIf you delete your wallet, the only way you can have access to your funds is by using your backup key.\n\nStack Wallet does not keep nor is able to restore your backup key or your wallet.\n\nPLEASE SAVE YOUR BACKUP KEY.", style: STextStyles.baseXS, @@ -59,30 +59,22 @@ class DeleteWalletWarningView extends ConsumerWidget { ), const Spacer(), TextButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: + StackTheme.instance.getSecondaryEnabledButtonColor(context), onPressed: () { Navigator.pop(context); }, child: Text( "Cancel", - style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith(color: StackTheme.instance.color.accentColorDark), ), ), const SizedBox( height: 12, ), TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), onPressed: () async { final manager = ref .read(walletsChangeNotifierProvider) diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/rename_wallet_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/rename_wallet_view.dart index 1a474e75e..44aec8145 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/rename_wallet_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/rename_wallet_view.dart @@ -2,10 +2,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/stack_text_field.dart'; @@ -52,7 +52,7 @@ class _RenameWalletViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -77,7 +77,7 @@ class _RenameWalletViewState extends ConsumerState { controller: _controller, focusNode: _focusNode, style: STextStyles.field, - onChanged: (_) => setState((){}), + onChanged: (_) => setState(() {}), decoration: standardInputDecoration( "Wallet name", _focusNode, @@ -106,11 +106,7 @@ class _RenameWalletViewState extends ConsumerState { ), const Spacer(), TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), onPressed: () async { final newName = _controller.text; final success = await ref diff --git a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/wallet_settings_wallet_settings_view.dart b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/wallet_settings_wallet_settings_view.dart index cca82f688..3465604e1 100644 --- a/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/wallet_settings_wallet_settings_view.dart +++ b/lib/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/wallet_settings_wallet_settings_view.dart @@ -5,9 +5,9 @@ import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_set import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_settings_wallet_settings/rename_wallet_view.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/route_generator.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; @@ -25,7 +25,7 @@ class WalletSettingsWalletSettingsView extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( leading: AppBarBackButton( onPressed: () { @@ -50,7 +50,7 @@ class WalletSettingsWalletSettingsView extends ConsumerWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -85,7 +85,7 @@ class WalletSettingsWalletSettingsView extends ConsumerWidget { RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, @@ -101,29 +101,21 @@ class WalletSettingsWalletSettingsView extends ConsumerWidget { title: "Do you want to delete ${ref.read(walletsChangeNotifierProvider).getManager(walletId).walletName}?", leftButton: TextButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), onPressed: () { Navigator.pop(context); }, child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: + StackTheme.instance.color.accentColorDark), ), ), rightButton: TextButton( - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), onPressed: () { Navigator.pop(context); Navigator.push( diff --git a/lib/pages/wallet_view/sub_widgets/transactions_list.dart b/lib/pages/wallet_view/sub_widgets/transactions_list.dart index efc3e74e5..1af56c8d8 100644 --- a/lib/pages/wallet_view/sub_widgets/transactions_list.dart +++ b/lib/pages/wallet_view/sub_widgets/transactions_list.dart @@ -6,8 +6,8 @@ import 'package:stackwallet/models/paymint/transactions_model.dart'; import 'package:stackwallet/pages/wallet_view/sub_widgets/no_transactions_found.dart'; import 'package:stackwallet/providers/global/wallets_provider.dart'; import 'package:stackwallet/services/coins/manager.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; import 'package:stackwallet/widgets/transaction_card.dart'; @@ -127,7 +127,7 @@ class _TransactionsListState extends ConsumerState { final tx = list[index]; return Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: radius, ), child: TransactionCard( diff --git a/lib/pages/wallet_view/sub_widgets/wallet_balance_toggle_sheet.dart b/lib/pages/wallet_view/sub_widgets/wallet_balance_toggle_sheet.dart index 1d51aa74d..5e7b61ba0 100644 --- a/lib/pages/wallet_view/sub_widgets/wallet_balance_toggle_sheet.dart +++ b/lib/pages/wallet_view/sub_widgets/wallet_balance_toggle_sheet.dart @@ -2,11 +2,11 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/wallet/wallet_balance_toggle_state_provider.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/wallet_balance_toggle_state.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class WalletBalanceToggleSheet extends ConsumerWidget { const WalletBalanceToggleSheet({ @@ -24,9 +24,9 @@ class WalletBalanceToggleSheet extends ConsumerWidget { .select((value) => value.getManager(walletId).coin)); return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -46,7 +46,7 @@ class WalletBalanceToggleSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -94,7 +94,8 @@ class WalletBalanceToggleSheet extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: + StackTheme.instance.color.radioButtonIconEnabled, value: WalletBalanceToggleState.available, groupValue: ref .watch(walletBalanceToggleStateProvider.state) @@ -124,7 +125,7 @@ class WalletBalanceToggleSheet extends ConsumerWidget { Text( "Current spendable (unlocked) balance", style: STextStyles.itemSubtitle12.copyWith( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, ), ), ], @@ -143,7 +144,7 @@ class WalletBalanceToggleSheet extends ConsumerWidget { Text( "Current private spendable (unlocked) balance", style: STextStyles.itemSubtitle12.copyWith( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, ), ), ], @@ -180,7 +181,8 @@ class WalletBalanceToggleSheet extends ConsumerWidget { width: 20, height: 20, child: Radio( - activeColor: CFColors.link2, + activeColor: + StackTheme.instance.color.radioButtonIconEnabled, value: WalletBalanceToggleState.full, groupValue: ref .watch(walletBalanceToggleStateProvider.state) @@ -210,7 +212,7 @@ class WalletBalanceToggleSheet extends ConsumerWidget { Text( "Total wallet balance", style: STextStyles.itemSubtitle12.copyWith( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, ), ), ], @@ -229,7 +231,7 @@ class WalletBalanceToggleSheet extends ConsumerWidget { Text( "Current public spendable (unlocked) balance", style: STextStyles.itemSubtitle12.copyWith( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, ), ), ], diff --git a/lib/pages/wallet_view/sub_widgets/wallet_navigation_bar.dart b/lib/pages/wallet_view/sub_widgets/wallet_navigation_bar.dart index da817069f..6c0dea5ba 100644 --- a/lib/pages/wallet_view/sub_widgets/wallet_navigation_bar.dart +++ b/lib/pages/wallet_view/sub_widgets/wallet_navigation_bar.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class WalletNavigationBar extends StatelessWidget { const WalletNavigationBar({ @@ -27,8 +27,8 @@ class WalletNavigationBar extends StatelessWidget { return Container( height: height, decoration: BoxDecoration( - color: CFColors.white, - boxShadow: const [CFColors.standardBoxShadow], + color: StackTheme.instance.color.popupBG, + boxShadow: [StackTheme.instance.standardBoxShadow], borderRadius: BorderRadius.circular( height / 2.0, ), @@ -49,7 +49,7 @@ class WalletNavigationBar extends StatelessWidget { minWidth: 66, ), onPressed: onReceivePressed, - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( height / 2.0, @@ -65,7 +65,8 @@ class WalletNavigationBar extends StatelessWidget { const Spacer(), Container( decoration: BoxDecoration( - color: CFColors.stackAccent.withOpacity(0.4), + color: StackTheme.instance.color.accentColorDark + .withOpacity(0.4), borderRadius: BorderRadius.circular( 24, ), @@ -76,7 +77,7 @@ class WalletNavigationBar extends StatelessWidget { Assets.svg.arrowDownLeft, width: 12, height: 12, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), ), @@ -98,7 +99,7 @@ class WalletNavigationBar extends StatelessWidget { minWidth: 66, ), onPressed: onSendPressed, - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( height / 2.0, @@ -114,7 +115,8 @@ class WalletNavigationBar extends StatelessWidget { const Spacer(), Container( decoration: BoxDecoration( - color: CFColors.stackAccent.withOpacity(0.4), + color: StackTheme.instance.color.accentColorDark + .withOpacity(0.4), borderRadius: BorderRadius.circular( 24, ), @@ -125,7 +127,7 @@ class WalletNavigationBar extends StatelessWidget { Assets.svg.arrowUpRight, width: 12, height: 12, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), ), @@ -148,7 +150,7 @@ class WalletNavigationBar extends StatelessWidget { minWidth: 66, ), onPressed: onExchangePressed, - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular( height / 2.0, @@ -236,7 +238,7 @@ class WalletNavigationBar extends StatelessWidget { // Widget build(BuildContext context) { // return Container( // child: MaterialButton( -// splashColor: CFColors.splashLight, +// splashColor: StackTheme.instance.color.highlight, // padding: const EdgeInsets.all(0), // minWidth: 45, // shape: RoundedRectangleBorder( diff --git a/lib/pages/wallet_view/sub_widgets/wallet_refresh_button.dart b/lib/pages/wallet_view/sub_widgets/wallet_refresh_button.dart index d03e83803..806a5861c 100644 --- a/lib/pages/wallet_view/sub_widgets/wallet_refresh_button.dart +++ b/lib/pages/wallet_view/sub_widgets/wallet_refresh_button.dart @@ -8,8 +8,8 @@ import 'package:stackwallet/providers/global/wallets_provider.dart'; import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/global_event_bus.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; /// [eventBus] should only be set during testing class WalletRefreshButton extends ConsumerStatefulWidget { @@ -96,7 +96,7 @@ class _RefreshButtonState extends ConsumerState height: 36, width: 36, child: MaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, onPressed: () { final managerProvider = ref .read(walletsChangeNotifierProvider) @@ -123,7 +123,7 @@ class _RefreshButtonState extends ConsumerState Assets.svg.arrowRotate, width: 24, height: 24, - color: CFColors.stackAccent, + color: StackTheme.instance.color.textFavoriteCard, ), ), ), diff --git a/lib/pages/wallet_view/sub_widgets/wallet_summary.dart b/lib/pages/wallet_view/sub_widgets/wallet_summary.dart index 786748356..a4800594a 100644 --- a/lib/pages/wallet_view/sub_widgets/wallet_summary.dart +++ b/lib/pages/wallet_view/sub_widgets/wallet_summary.dart @@ -5,8 +5,8 @@ import 'package:stackwallet/pages/wallet_view/sub_widgets/wallet_summary_info.da import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class WalletSummary extends StatelessWidget { const WalletSummary({ @@ -48,7 +48,7 @@ class WalletSummary extends StatelessWidget { builder: (_, ref, __) { return Container( decoration: BoxDecoration( - color: CFColors.coin.forCoin(ref + color: StackTheme.instance.colorForCoin(ref .watch(managerProvider.select((value) => value.coin))), borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, diff --git a/lib/pages/wallet_view/sub_widgets/wallet_summary_info.dart b/lib/pages/wallet_view/sub_widgets/wallet_summary_info.dart index 8687e8a59..a175d38f8 100644 --- a/lib/pages/wallet_view/sub_widgets/wallet_summary_info.dart +++ b/lib/pages/wallet_view/sub_widgets/wallet_summary_info.dart @@ -10,11 +10,11 @@ import 'package:stackwallet/services/coins/firo/firo_wallet.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/wallet_balance_toggle_state.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/animated_text.dart'; class WalletSummaryInfo extends StatefulWidget { @@ -130,6 +130,8 @@ class _WalletSummaryInfoState extends State { "${_showAvailable ? "Private" : "Public"} Balance", style: STextStyles.subtitle.copyWith( fontWeight: FontWeight.w500, + color: StackTheme + .instance.color.textFavoriteCard, ), ), if (coin != Coin.firo && coin != Coin.firoTestNet) @@ -137,6 +139,8 @@ class _WalletSummaryInfoState extends State { "${_showAvailable ? "Available" : "Full"} Balance", style: STextStyles.subtitle.copyWith( fontWeight: FontWeight.w500, + color: StackTheme + .instance.color.textFavoriteCard, ), ), const SizedBox( @@ -144,7 +148,8 @@ class _WalletSummaryInfoState extends State { ), SvgPicture.asset( Assets.svg.chevronDown, - color: CFColors.stackAccent, + color: + StackTheme.instance.color.textFavoriteCard, width: 8, height: 4, ), @@ -162,6 +167,7 @@ class _WalletSummaryInfoState extends State { )} ${coin.ticker}", style: STextStyles.pageTitleH1.copyWith( fontSize: 24, + color: StackTheme.instance.color.textFavoriteCard, ), ), ), @@ -173,6 +179,7 @@ class _WalletSummaryInfoState extends State { )} $baseCurrency", style: STextStyles.subtitle.copyWith( fontWeight: FontWeight.w500, + color: StackTheme.instance.color.textFavoriteCard, ), ), ], @@ -190,6 +197,8 @@ class _WalletSummaryInfoState extends State { "${_showAvailable ? "Private" : "Public"} Balance", style: STextStyles.subtitle.copyWith( fontWeight: FontWeight.w500, + color: StackTheme + .instance.color.textFavoriteCard, ), ), if (coin != Coin.firo && coin != Coin.firoTestNet) @@ -197,6 +206,8 @@ class _WalletSummaryInfoState extends State { "${_showAvailable ? "Available" : "Full"} Balance", style: STextStyles.subtitle.copyWith( fontWeight: FontWeight.w500, + color: StackTheme + .instance.color.textFavoriteCard, ), ), const SizedBox( @@ -204,9 +215,10 @@ class _WalletSummaryInfoState extends State { ), SvgPicture.asset( Assets.svg.chevronDown, - color: CFColors.stackAccent, width: 8, height: 4, + color: + StackTheme.instance.color.textFavoriteCard, ), ], ), @@ -221,6 +233,7 @@ class _WalletSummaryInfoState extends State { ], style: STextStyles.pageTitleH1.copyWith( fontSize: 24, + color: StackTheme.instance.color.textFavoriteCard, ), ), AnimatedText( @@ -232,6 +245,7 @@ class _WalletSummaryInfoState extends State { ], style: STextStyles.subtitle.copyWith( fontWeight: FontWeight.w500, + color: StackTheme.instance.color.textFavoriteCard, ), ), ], diff --git a/lib/pages/wallet_view/transaction_views/all_transactions_view.dart b/lib/pages/wallet_view/transaction_views/all_transactions_view.dart index b2c3c4383..979925a42 100644 --- a/lib/pages/wallet_view/transaction_views/all_transactions_view.dart +++ b/lib/pages/wallet_view/transaction_views/all_transactions_view.dart @@ -9,9 +9,9 @@ import 'package:stackwallet/providers/global/address_book_service_provider.dart' import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/transaction_filter_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; @@ -165,9 +165,9 @@ class _TransactionDetailsViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -196,10 +196,10 @@ class _TransactionDetailsViewState extends ConsumerState { key: const Key("transactionSearchFilterViewButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.filter, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), diff --git a/lib/pages/wallet_view/transaction_views/dialogs/cancelling_transaction_progress_dialog.dart b/lib/pages/wallet_view/transaction_views/dialogs/cancelling_transaction_progress_dialog.dart index 27c294495..9bd5f7b26 100644 --- a/lib/pages/wallet_view/transaction_views/dialogs/cancelling_transaction_progress_dialog.dart +++ b/lib/pages/wallet_view/transaction_views/dialogs/cancelling_transaction_progress_dialog.dart @@ -2,7 +2,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/stack_dialog.dart'; class CancellingTransactionProgressDialog extends StatefulWidget { @@ -57,7 +57,7 @@ class _CancellingTransactionProgressDialogState Assets.svg.arrowRotate3, width: 24, height: 24, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, ), ), // rightButton: TextButton( diff --git a/lib/pages/wallet_view/transaction_views/edit_note_view.dart b/lib/pages/wallet_view/transaction_views/edit_note_view.dart index 532b814f7..f3d0662a7 100644 --- a/lib/pages/wallet_view/transaction_views/edit_note_view.dart +++ b/lib/pages/wallet_view/transaction_views/edit_note_view.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/stack_text_field.dart'; @@ -48,9 +48,9 @@ class _EditNoteViewState extends ConsumerState { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -129,13 +129,8 @@ class _EditNoteViewState extends ConsumerState { Navigator.of(context).pop(); } }, - style: - Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Save", style: STextStyles.button, diff --git a/lib/pages/wallet_view/transaction_views/transaction_details_view.dart b/lib/pages/wallet_view/transaction_views/transaction_details_view.dart index 3bed97db6..87969020a 100644 --- a/lib/pages/wallet_view/transaction_views/transaction_details_view.dart +++ b/lib/pages/wallet_view/transaction_views/transaction_details_view.dart @@ -16,13 +16,13 @@ import 'package:stackwallet/services/coins/epiccash/epiccash_wallet.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/block_explorers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -179,17 +179,12 @@ class _TransactionDetailsViewState }, child: Text( "Cancel", - style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + style: STextStyles.button + .copyWith(color: StackTheme.instance.color.accentColorDark), ), ), rightButton: TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), onPressed: () { Navigator.of(context).pop(true); }, @@ -206,9 +201,9 @@ class _TransactionDetailsViewState @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { // if (FocusScope.of(context).hasFocus) { @@ -380,7 +375,8 @@ class _TransactionDetailsViewState Assets.svg.pencil, width: 10, height: 10, - color: CFColors.link2, + color: + StackTheme.instance.color.infoItemIcons, ), const SizedBox( width: 4, @@ -722,7 +718,7 @@ class _TransactionDetailsViewState child: TextButton( style: ButtonStyle( backgroundColor: MaterialStateProperty.all( - CFColors.error, + StackTheme.instance.color.textError, ), ), onPressed: () async { diff --git a/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart b/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart index 6b9fbd7e3..cfe511b43 100644 --- a/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart +++ b/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart @@ -9,11 +9,12 @@ import 'package:stackwallet/models/transaction_filter.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/transaction_filter_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -89,8 +90,9 @@ class _TransactionSearchViewState return Text( isDateSelected ? "From..." : _fromDateString, style: STextStyles.fieldLabel.copyWith( - color: isDateSelected ? CFColors.gray3 : CFColors.stackAccent, - ), + color: isDateSelected + ? StackTheme.instance.color.textSubtitle2 + : StackTheme.instance.color.accentColorDark), ); } @@ -99,8 +101,9 @@ class _TransactionSearchViewState return Text( isDateSelected ? "To..." : _toDateString, style: STextStyles.fieldLabel.copyWith( - color: isDateSelected ? CFColors.gray3 : CFColors.stackAccent, - ), + color: isDateSelected + ? StackTheme.instance.color.textSubtitle2 + : StackTheme.instance.color.accentColorDark), ); } @@ -108,7 +111,7 @@ class _TransactionSearchViewState var _selectedToDate = DateTime.now(); final _datePickerTextStyleBase = GoogleFonts.inter( - color: CFColors.gray3, + color: StackTheme.instance.color.textSubtitle2, fontSize: 12, fontWeight: FontWeight.w400, letterSpacing: 0.5, @@ -117,34 +120,33 @@ class _TransactionSearchViewState MaterialRoundedDatePickerStyle _buildDatePickerStyle() { return MaterialRoundedDatePickerStyle( paddingMonthHeader: const EdgeInsets.only(top: 11), - colorArrowNext: CFColors.neutral60, - colorArrowPrevious: CFColors.neutral60, + colorArrowNext: StackTheme.instance.color.textSubtitle1, + colorArrowPrevious: StackTheme.instance.color.textSubtitle1, textStyleButtonNegative: _datePickerTextStyleBase.copyWith( fontSize: 16, fontWeight: FontWeight.w600), textStyleButtonPositive: _datePickerTextStyleBase.copyWith( fontSize: 16, fontWeight: FontWeight.w600), textStyleCurrentDayOnCalendar: _datePickerTextStyleBase.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color.accentColorDark), textStyleDayHeader: _datePickerTextStyleBase.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, fontSize: 16, fontWeight: FontWeight.w600, ), textStyleDayOnCalendar: _datePickerTextStyleBase, textStyleDayOnCalendarDisabled: _datePickerTextStyleBase.copyWith( - color: CFColors.neutral80, + color: StackTheme.instance.color.textSubtitle3, ), textStyleDayOnCalendarSelected: _datePickerTextStyleBase.copyWith( - color: CFColors.white, + color: StackTheme.instance.color.textWhite, ), textStyleMonthYearHeader: _datePickerTextStyleBase.copyWith( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, fontSize: 16, fontWeight: FontWeight.w600, ), textStyleYearButton: _datePickerTextStyleBase.copyWith( - color: CFColors.white, + color: StackTheme.instance.color.textWhite, fontSize: 16, fontWeight: FontWeight.w600, ), @@ -155,12 +157,12 @@ class _TransactionSearchViewState MaterialRoundedYearPickerStyle _buildYearPickerStyle() { return MaterialRoundedYearPickerStyle( textStyleYear: _datePickerTextStyleBase.copyWith( - color: CFColors.gray3, + color: StackTheme.instance.color.textSubtitle2, fontWeight: FontWeight.w600, fontSize: 16, ), textStyleYearSelected: _datePickerTextStyleBase.copyWith( - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, fontWeight: FontWeight.w600, fontSize: 18, ), @@ -196,8 +198,9 @@ class _TransactionSearchViewState initialDate: DateTime.now(), height: height * 0.5, theme: ThemeData( - primarySwatch: - CFColors.createMaterialColor(CFColors.stackAccent), + primarySwatch: Util.createMaterialColor( + StackTheme.instance.color.accentColorDark, + ), ), //TODO pick a better initial date // 2007 chosen as that is just before bitcoin launched @@ -231,11 +234,11 @@ class _TransactionSearchViewState child: Container( width: width, decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular(Constants.size.circularBorderRadius), border: Border.all( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, width: 1, ), ), @@ -247,7 +250,7 @@ class _TransactionSearchViewState Assets.svg.calendar, height: 20, width: 20, - color: CFColors.gray3, + color: StackTheme.instance.color.textSubtitle2, ), const SizedBox( width: 10, @@ -288,8 +291,9 @@ class _TransactionSearchViewState context: context, height: height * 0.5, theme: ThemeData( - primarySwatch: - CFColors.createMaterialColor(CFColors.stackAccent), + primarySwatch: Util.createMaterialColor( + StackTheme.instance.color.accentColorDark, + ), ), //TODO pick a better initial date // 2007 chosen as that is just before bitcoin launched @@ -324,11 +328,11 @@ class _TransactionSearchViewState child: Container( width: width, decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular(Constants.size.circularBorderRadius), border: Border.all( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, width: 1, ), ), @@ -340,7 +344,7 @@ class _TransactionSearchViewState Assets.svg.calendar, height: 20, width: 20, - color: CFColors.gray3, + color: StackTheme.instance.color.textSubtitle2, ), const SizedBox( width: 10, @@ -363,9 +367,9 @@ class _TransactionSearchViewState @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, appBar: AppBar( - backgroundColor: CFColors.almostWhite, + backgroundColor: StackTheme.instance.color.background, leading: AppBarBackButton( onPressed: () async { if (FocusScope.of(context).hasFocus) { @@ -673,17 +677,13 @@ class _TransactionSearchViewState Navigator.of(context).pop(); } }, - style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme + .instance.color.accentColorDark), ), ), ), @@ -695,15 +695,8 @@ class _TransactionSearchViewState child: SizedBox( height: 48, child: TextButton( - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), onPressed: () async { _onApplyPressed(); }, diff --git a/lib/pages/wallet_view/wallet_view.dart b/lib/pages/wallet_view/wallet_view.dart index b06b8627c..51ee4d075 100644 --- a/lib/pages/wallet_view/wallet_view.dart +++ b/lib/pages/wallet_view/wallet_view.dart @@ -33,13 +33,13 @@ import 'package:stackwallet/services/event_bus/events/global/node_connection_sta import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/global_event_bus.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/backup_frequency_type.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/enums/wallet_balance_toggle_state.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/custom_loading_overlay.dart'; @@ -208,21 +208,21 @@ class _WalletViewState extends ConsumerState { case WalletSyncStatus.unableToSync: return SvgPicture.asset( Assets.svg.radioProblem, - color: CFColors.link, + color: StackTheme.instance.color.accentColorRed, width: 20, height: 20, ); case WalletSyncStatus.synced: return SvgPicture.asset( Assets.svg.radio, - color: CFColors.stackGreen, + color: StackTheme.instance.color.accentColorGreen, width: 20, height: 20, ); case WalletSyncStatus.syncing: return SvgPicture.asset( Assets.svg.radioSyncing, - color: CFColors.stackYellow, + color: StackTheme.instance.color.accentColorYellow, width: 20, height: 20, ); @@ -375,7 +375,7 @@ class _WalletViewState extends ConsumerState { children: [ SvgPicture.asset( Assets.svg.iconFor(coin: coin), - // color: CFColors.stackAccent, + // color: StackTheme.instance.color.accentColorDark width: 24, height: 24, ), @@ -405,7 +405,7 @@ class _WalletViewState extends ConsumerState { key: const Key("walletViewRadioButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: _buildNetworkIcon(_currentSyncStatus), onPressed: () { Navigator.of(context).pushNamed( @@ -432,7 +432,7 @@ class _WalletViewState extends ConsumerState { key: const Key("walletViewAlertsButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( ref.watch(notificationsProvider.select((value) => value.hasUnreadNotificationsFor(walletId))) @@ -440,6 +440,10 @@ class _WalletViewState extends ConsumerState { : Assets.svg.bell, width: 20, height: 20, + color: ref.watch(notificationsProvider.select((value) => + value.hasUnreadNotificationsFor(walletId))) + ? null + : StackTheme.instance.color.topNavIconPrimary, ), onPressed: () { // reset unread state @@ -488,10 +492,10 @@ class _WalletViewState extends ConsumerState { key: const Key("walletViewSettingsButton"), size: 36, shadows: const [], - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, icon: SvgPicture.asset( Assets.svg.bars, - color: CFColors.stackAccent, + color: StackTheme.instance.color.accentColorDark, width: 20, height: 20, ), @@ -514,7 +518,7 @@ class _WalletViewState extends ConsumerState { ), body: SafeArea( child: Container( - color: CFColors.almostWhite, + color: StackTheme.instance.color.background, child: Column( children: [ const SizedBox( @@ -544,6 +548,8 @@ class _WalletViewState extends ConsumerState { children: [ Expanded( child: TextButton( + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), onPressed: () async { await showDialog( context: context, @@ -558,7 +564,8 @@ class _WalletViewState extends ConsumerState { child: Text( "Cancel", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.accentColorDark, ), ), ), @@ -568,15 +575,8 @@ class _WalletViewState extends ConsumerState { unawaited(attemptAnonymize()); }, - style: Theme.of(context) - .textButtonTheme - .style - ?.copyWith( - backgroundColor: - MaterialStateProperty.all( - CFColors.stackAccent, - ), - ), + style: StackTheme.instance + .getPrimaryEnabledButtonColor(context), child: Text( "Continue", style: STextStyles.button, @@ -588,7 +588,8 @@ class _WalletViewState extends ConsumerState { child: Text( "Anonymize funds", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, + color: StackTheme + .instance.color.buttonTextSecondary, ), ), ), @@ -607,7 +608,7 @@ class _WalletViewState extends ConsumerState { Text( "Transactions", style: STextStyles.itemSubtitle.copyWith( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, ), ), BlueTextButton( diff --git a/lib/pages/wallets_sheet/wallets_sheet.dart b/lib/pages/wallets_sheet/wallets_sheet.dart index 553cc093e..113184a2a 100644 --- a/lib/pages/wallets_sheet/wallets_sheet.dart +++ b/lib/pages/wallets_sheet/wallets_sheet.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/wallet_card.dart'; class WalletsSheet extends ConsumerWidget { @@ -23,9 +23,9 @@ class WalletsSheet extends ConsumerWidget { final maxHeight = MediaQuery.of(context).size.height * 0.60; return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -45,7 +45,7 @@ class WalletsSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), diff --git a/lib/pages/wallets_view/sub_widgets/all_wallets.dart b/lib/pages/wallets_view/sub_widgets/all_wallets.dart index 3707ce69c..1cf76c921 100644 --- a/lib/pages/wallets_view/sub_widgets/all_wallets.dart +++ b/lib/pages/wallets_view/sub_widgets/all_wallets.dart @@ -4,6 +4,7 @@ import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/add_wallet_vi import 'package:stackwallet/pages/wallets_view/sub_widgets/wallet_list_item.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; class AllWallets extends StatelessWidget { @@ -19,7 +20,9 @@ class AllWallets extends StatelessWidget { children: [ Text( "All wallets", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: StackTheme.instance.color.textDark, + ), ), BlueTextButton( text: "Add new", diff --git a/lib/pages/wallets_view/sub_widgets/empty_wallets.dart b/lib/pages/wallets_view/sub_widgets/empty_wallets.dart index c4bbab967..0b1d2a417 100644 --- a/lib/pages/wallets_view/sub_widgets/empty_wallets.dart +++ b/lib/pages/wallets_view/sub_widgets/empty_wallets.dart @@ -2,8 +2,10 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/add_wallet_view.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; class EmptyWallets extends StatelessWidget { const EmptyWallets({Key? key}) : super(key: key); @@ -11,73 +13,110 @@ class EmptyWallets extends StatelessWidget { @override Widget build(BuildContext context) { debugPrint("BUILD: $runtimeType"); + + final isDesktop = Util.isDesktop; + return SafeArea( child: Padding( padding: const EdgeInsets.symmetric( horizontal: 43, ), - child: Column( - children: [ - const Spacer( - flex: 2, - ), - Image( - image: AssetImage( - Assets.png.stack, + child: ConstrainedBox( + constraints: BoxConstraints( + maxWidth: isDesktop ? 330 : double.infinity, + ), + child: Column( + children: [ + const Spacer( + flex: 2, ), - width: MediaQuery.of(context).size.width / 3, - ), - const SizedBox( - height: 16, - ), - Text( - "You do not have any wallets yet. Start building your crypto Stack!", - textAlign: TextAlign.center, - style: STextStyles.subtitle.copyWith( - color: CFColors.neutral60, + Image( + image: AssetImage( + Assets.png.stack, + ), + width: isDesktop ? 324 : MediaQuery.of(context).size.width / 3, ), - ), - const SizedBox( - height: 16, - ), - Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - TextButton( - style: Theme.of(context).textButtonTheme.style?.copyWith( - backgroundColor: MaterialStateProperty.all( - CFColors.stackAccent, - ), + SizedBox( + height: isDesktop ? 30 : 16, + ), + Text( + "You do not have any wallets yet. Start building your crypto Stack!", + textAlign: TextAlign.center, + style: isDesktop + ? STextStyles.desktopSubtitleH2.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ) + : STextStyles.subtitle.copyWith( + color: StackTheme.instance.color.textSubtitle1, ), - onPressed: () { - Navigator.of(context).pushNamed(AddWalletView.routeName); - }, - child: Container( - padding: const EdgeInsets.symmetric( - horizontal: 16, - ), - child: Row( - children: [ - SvgPicture.asset( - Assets.svg.plus, - ), - const SizedBox( - width: 5, - ), - Text( - "Add Wallet", - style: STextStyles.button, - ), - ], - ), + ), + SizedBox( + height: isDesktop ? 30 : 16, + ), + if (isDesktop) + const SizedBox( + width: 328, + height: 70, + child: AddWalletButton( + isDesktop: true, ), ), - ], - ), - const Spacer( - flex: 5, - ), - ], + if (!isDesktop) + Row( + mainAxisAlignment: MainAxisAlignment.center, + children: const [ + AddWalletButton( + isDesktop: false, + ), + ], + ), + const Spacer( + flex: 5, + ), + ], + ), + ), + ), + ); + } +} + +class AddWalletButton extends StatelessWidget { + const AddWalletButton({Key? key, required this.isDesktop}) : super(key: key); + + final bool isDesktop; + + @override + Widget build(BuildContext context) { + return TextButton( + style: StackTheme.instance.getPrimaryEnabledButtonColor(context), + onPressed: () { + Navigator.of(context).pushNamed(AddWalletView.routeName); + }, + child: Center( + child: Container( + padding: const EdgeInsets.symmetric( + horizontal: 16, + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + SvgPicture.asset( + Assets.svg.plus, + width: isDesktop ? 18 : null, + height: isDesktop ? 18 : null, + ), + SizedBox( + width: isDesktop ? 8 : 5, + ), + Text( + "Add Wallet", + style: isDesktop + ? STextStyles.desktopButtonEnabled + : STextStyles.button, + ), + ], + ), ), ), ); diff --git a/lib/pages/wallets_view/sub_widgets/favorite_card.dart b/lib/pages/wallets_view/sub_widgets/favorite_card.dart index 30112885c..5f4176601 100644 --- a/lib/pages/wallets_view/sub_widgets/favorite_card.dart +++ b/lib/pages/wallets_view/sub_widgets/favorite_card.dart @@ -6,11 +6,11 @@ import 'package:stackwallet/pages/wallet_view/wallet_view.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:tuple/tuple.dart'; class FavoriteCard extends ConsumerStatefulWidget { @@ -70,7 +70,7 @@ class _FavoriteCardState extends ConsumerState { width: widget.width, height: widget.height, decoration: BoxDecoration( - color: CFColors.coin.forCoin(coin), + color: StackTheme.instance.colorForCoin(coin), borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -128,23 +128,29 @@ class _FavoriteCardState extends ConsumerState { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Text( - ref.watch( - managerProvider.select((value) => value.walletName)), - style: STextStyles.itemSubtitle12, - ), - const Spacer(), - SvgPicture.asset( - Assets.svg.iconFor(coin: coin), - width: 24, - height: 24, - ), - ], + Expanded( + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Expanded( + child: Text( + ref.watch(managerProvider + .select((value) => value.walletName)), + style: STextStyles.itemSubtitle12.copyWith( + color: StackTheme.instance.color.textFavoriteCard, + ), + overflow: TextOverflow.fade, + ), + ), + SvgPicture.asset( + Assets.svg.iconFor(coin: coin), + width: 24, + height: 24, + ), + ], + ), ), - const Spacer(), FutureBuilder( future: ref.watch( managerProvider.select((value) => value.totalBalance)), @@ -179,6 +185,7 @@ class _FavoriteCardState extends ConsumerState { )} ${coin.ticker}", style: STextStyles.titleBold12.copyWith( fontSize: 16, + color: StackTheme.instance.color.textFavoriteCard, ), ), ), @@ -199,6 +206,7 @@ class _FavoriteCardState extends ConsumerState { )}", style: STextStyles.itemSubtitle12.copyWith( fontSize: 10, + color: StackTheme.instance.color.textFavoriteCard, ), ), ], diff --git a/lib/pages/wallets_view/sub_widgets/favorite_wallets.dart b/lib/pages/wallets_view/sub_widgets/favorite_wallets.dart index 2f7efe58b..0130345ff 100644 --- a/lib/pages/wallets_view/sub_widgets/favorite_wallets.dart +++ b/lib/pages/wallets_view/sub_widgets/favorite_wallets.dart @@ -8,9 +8,9 @@ import 'package:stackwallet/pages/wallets_view/sub_widgets/favorite_card.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_page_view/custom_page_view.dart' as cpv; @@ -82,19 +82,22 @@ class _FavoriteWalletsState extends ConsumerState { children: [ Text( "Favorite Wallets", - style: STextStyles.itemSubtitle, + style: STextStyles.itemSubtitle.copyWith( + color: StackTheme.instance.color.textDark3, + ), ), const Spacer(), if (hasFavorites) TextButton( style: ButtonStyle( - backgroundColor: - MaterialStateProperty.all(CFColors.almostWhite), + backgroundColor: MaterialStateProperty.all( + StackTheme.instance.color.background), ), child: SvgPicture.asset( Assets.svg.ellipsis, width: 16, height: 16, + color: StackTheme.instance.color.accentColorDark, ), onPressed: () { Navigator.of(context).pushNamed( @@ -117,12 +120,12 @@ class _FavoriteWalletsState extends ConsumerState { height: cardHeight, width: cardWidth, decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius), ), child: MaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, key: const Key("favoriteWalletsAddFavoriteButtonKey"), padding: const EdgeInsets.all(12), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, @@ -141,7 +144,7 @@ class _FavoriteWalletsState extends ConsumerState { Assets.svg.plus, width: 8, height: 8, - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, ), const SizedBox( width: 4, diff --git a/lib/pages/wallets_view/sub_widgets/wallet_list_item.dart b/lib/pages/wallets_view/sub_widgets/wallet_list_item.dart index 95f1b469e..517a98525 100644 --- a/lib/pages/wallets_view/sub_widgets/wallet_list_item.dart +++ b/lib/pages/wallets_view/sub_widgets/wallet_list_item.dart @@ -4,11 +4,11 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/wallets_sheet/wallets_sheet.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; class WalletListItem extends ConsumerWidget { @@ -32,7 +32,7 @@ class WalletListItem extends ConsumerWidget { return RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: MaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, key: Key("walletListItemButtonKey_${coin.name}"), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 13), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, @@ -78,11 +78,13 @@ class WalletListItem extends ConsumerWidget { final double percentChange = tuple.item2; - var percentChangedColor = CFColors.stackAccent; + var percentChangedColor = StackTheme.instance.color.textDark; if (percentChange > 0) { - percentChangedColor = CFColors.stackGreen; + percentChangedColor = + StackTheme.instance.color.accentColorGreen; } else if (percentChange < 0) { - percentChangedColor = CFColors.stackRed; + percentChangedColor = + StackTheme.instance.color.accentColorRed; } return Column( @@ -90,7 +92,10 @@ class WalletListItem extends ConsumerWidget { children: [ Row( children: [ - Text(coin.prettyName), + Text( + coin.prettyName, + style: STextStyles.titleBold12, + ), const Spacer(), Text( "$priceString $currency/${coin.ticker}", diff --git a/lib/pages_desktop_specific/create_password/create_password_view.dart b/lib/pages_desktop_specific/create_password/create_password_view.dart new file mode 100644 index 000000000..be6ea74e6 --- /dev/null +++ b/lib/pages_desktop_specific/create_password/create_password_view.dart @@ -0,0 +1,398 @@ +import 'dart:async'; + +import 'package:flutter/material.dart'; +import 'package:flutter_secure_storage/flutter_secure_storage.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/notifications/show_flush_bar.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; +import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; +import 'package:stackwallet/widgets/progress_bar.dart'; +import 'package:stackwallet/widgets/stack_text_field.dart'; +import 'package:zxcvbn/zxcvbn.dart'; + +class CreatePasswordView extends StatefulWidget { + const CreatePasswordView({ + Key? key, + this.secureStore = const SecureStorageWrapper( + FlutterSecureStorage(), + ), + }) : super(key: key); + + static const String routeName = "/createPasswordDesktop"; + + final FlutterSecureStorageInterface secureStore; + + @override + State createState() => _CreatePasswordViewState(); +} + +class _CreatePasswordViewState extends State { + late final TextEditingController passwordController; + late final TextEditingController passwordRepeatController; + + late final FocusNode passwordFocusNode; + late final FocusNode passwordRepeatFocusNode; + final zxcvbn = Zxcvbn(); + + String passwordFeedback = + "Add another word or two. Uncommon words are better. Use a few words, avoid common phrases. No need for symbols, digits, or uppercase letters."; + bool shouldShowPasswordHint = true; + bool hidePassword = true; + double passwordStrength = 0.0; + + bool get nextEnabled => + passwordController.text.isNotEmpty && + passwordRepeatController.text.isNotEmpty; + + bool get fieldsMatch => + passwordController.text == passwordRepeatController.text; + + void onNextPressed() async { + final String passphrase = passwordController.text; + final String repeatPassphrase = passwordRepeatController.text; + + if (passphrase.isEmpty) { + unawaited(showFloatingFlushBar( + type: FlushBarType.warning, + message: "A password is required", + context: context, + )); + return; + } + if (passphrase != repeatPassphrase) { + unawaited(showFloatingFlushBar( + type: FlushBarType.warning, + message: "Password does not match", + context: context, + )); + return; + } + + await widget.secureStore + .write(key: "stackDesktopPassword", value: passphrase); + + if (mounted) { + unawaited(Navigator.of(context) + .pushReplacementNamed(DesktopHomeView.routeName)); + } + + unawaited(showFloatingFlushBar( + type: FlushBarType.success, + message: "Your password is set up", + context: context, + )); + } + + @override + void initState() { + passwordController = TextEditingController(); + passwordRepeatController = TextEditingController(); + + passwordFocusNode = FocusNode(); + passwordRepeatFocusNode = FocusNode(); + + super.initState(); + } + + @override + void dispose() { + passwordController.dispose(); + passwordRepeatController.dispose(); + + passwordFocusNode.dispose(); + passwordRepeatFocusNode.dispose(); + + super.dispose(); + } + + @override + Widget build(BuildContext context) { + debugPrint("BUILD: $runtimeType "); + + return DesktopScaffold( + appBar: DesktopAppBar( + leading: AppBarBackButton( + onPressed: () async { + if (mounted) { + Navigator.of(context).pop(); + } + }, + ), + isCompactHeight: false, + ), + body: Column( + children: [ + Expanded( + child: Center( + child: SizedBox( + width: 480, + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + "Create a password", + style: STextStyles.desktopH2, + ), + const SizedBox( + height: 16, + ), + Text( + "Protect your funds with a strong password", + style: STextStyles.desktopSubtitleH2, + ), + const SizedBox( + height: 40, + ), + ClipRRect( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + child: TextField( + key: const Key("createBackupPasswordFieldKey1"), + focusNode: passwordFocusNode, + controller: passwordController, + style: STextStyles.desktopTextMedium.copyWith( + height: 2, + ), + obscureText: hidePassword, + enableSuggestions: false, + autocorrect: false, + decoration: standardInputDecoration( + "Create password", + passwordFocusNode, + ).copyWith( + suffixIcon: UnconstrainedBox( + child: SizedBox( + height: 70, + child: Row( + children: [ + GestureDetector( + key: const Key( + "createDesktopPasswordFieldShowPasswordButtonKey"), + onTap: () async { + setState(() { + hidePassword = !hidePassword; + }); + }, + child: Container( + decoration: BoxDecoration( + color: Colors.transparent, + borderRadius: + BorderRadius.circular(1000), + ), + height: 32, + width: 32, + child: Center( + child: SvgPicture.asset( + hidePassword + ? Assets.svg.eye + : Assets.svg.eyeSlash, + color: StackTheme + .instance.color.textDark3, + width: 24, + height: 19, + ), + ), + ), + ), + const SizedBox( + width: 10, + ), + ], + ), + ), + ), + ), + onChanged: (newValue) { + if (newValue.isEmpty) { + setState(() { + passwordFeedback = ""; + }); + return; + } + final result = zxcvbn.evaluate(newValue); + String suggestionsAndTips = ""; + for (var sug + in result.feedback.suggestions!.toSet()) { + suggestionsAndTips += "$sug\n"; + } + suggestionsAndTips += result.feedback.warning!; + String feedback = + // "Password Strength: ${((result.score! / 4.0) * 100).toInt()}%\n" + suggestionsAndTips; + + passwordStrength = result.score! / 4; + + // hack fix to format back string returned from zxcvbn + if (feedback.contains("phrasesNo need")) { + feedback = feedback.replaceFirst( + "phrasesNo need", "phrases\nNo need"); + } + + if (feedback.endsWith("\n")) { + feedback = + feedback.substring(0, feedback.length - 2); + } + + setState(() { + passwordFeedback = feedback; + }); + }, + ), + ), + if (passwordFocusNode.hasFocus || + passwordRepeatFocusNode.hasFocus || + passwordController.text.isNotEmpty) + Padding( + padding: EdgeInsets.only( + top: passwordFeedback.isNotEmpty ? 4 : 8, + ), + child: passwordFeedback.isNotEmpty + ? Text( + passwordFeedback, + style: + STextStyles.desktopTextExtraSmall.copyWith( + color: + StackTheme.instance.color.textSubtitle1, + ), + ) + : null, + ), + if (passwordFocusNode.hasFocus || + passwordRepeatFocusNode.hasFocus || + passwordController.text.isNotEmpty) + Padding( + padding: const EdgeInsets.only( + top: 10, + ), + child: ProgressBar( + key: const Key("createDesktopPasswordProgressBar"), + width: 458, + height: 8, + fillColor: passwordStrength < 0.51 + ? StackTheme.instance.color.accentColorRed + : passwordStrength < 1 + ? StackTheme.instance.color.accentColorYellow + : StackTheme.instance.color.accentColorGreen, + backgroundColor: + StackTheme.instance.color.buttonBackSecondary, + percent: + passwordStrength < 0.25 ? 0.03 : passwordStrength, + ), + ), + const SizedBox( + height: 16, + ), + ClipRRect( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + child: TextField( + key: const Key("createDesktopPasswordFieldKey2"), + focusNode: passwordRepeatFocusNode, + controller: passwordRepeatController, + style: STextStyles.desktopTextMedium.copyWith( + height: 2, + ), + obscureText: hidePassword, + enableSuggestions: false, + autocorrect: false, + decoration: standardInputDecoration( + "Confirm password", + passwordRepeatFocusNode, + ).copyWith( + suffixIcon: UnconstrainedBox( + child: SizedBox( + height: 70, + child: Row( + children: [ + GestureDetector( + key: const Key( + "createDesktopPasswordFieldShowPasswordButtonKey2"), + onTap: () async { + setState(() { + hidePassword = !hidePassword; + }); + }, + child: Container( + decoration: BoxDecoration( + color: Colors.transparent, + borderRadius: + BorderRadius.circular(1000), + ), + height: 32, + width: 32, + child: Center( + child: SvgPicture.asset( + fieldsMatch && passwordStrength == 1 + ? Assets.svg.checkCircle + : hidePassword + ? Assets.svg.eye + : Assets.svg.eyeSlash, + color: fieldsMatch && + passwordStrength == 1 + ? StackTheme.instance.color + .accentColorGreen + : StackTheme + .instance.color.textDark3, + width: 24, + height: 19, + ), + ), + ), + ), + const SizedBox( + width: 10, + ), + ], + ), + ), + ), + ), + onChanged: (newValue) { + setState(() {}); + }, + ), + ), + const SizedBox( + height: 32, + ), + SizedBox( + width: 480, + height: 70, + child: TextButton( + style: nextEnabled + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), + onPressed: nextEnabled ? onNextPressed : null, + child: Text( + "Next", + style: nextEnabled + ? STextStyles.desktopButtonEnabled + : STextStyles.desktopButtonDisabled, + ), + ), + ), + ], + ), + ), + ), + ), + const SizedBox( + height: kDesktopAppBarHeight, + ), + ], + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/desktop_home_view.dart b/lib/pages_desktop_specific/home/desktop_home_view.dart new file mode 100644 index 000000000..e7bc12507 --- /dev/null +++ b/lib/pages_desktop_specific/home/desktop_home_view.dart @@ -0,0 +1,71 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_menu.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/my_stack_view.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class DesktopHomeView extends ConsumerStatefulWidget { + const DesktopHomeView({Key? key}) : super(key: key); + + static const String routeName = "/desktopHome"; + + @override + ConsumerState createState() => _DesktopHomeViewState(); +} + +class _DesktopHomeViewState extends ConsumerState { + int currentViewIndex = 0; + final List contentViews = [ + // const Navigator( + // onGenerateRoute: RouteGenerator.generateRoute, + // initialRoute: MyStackView.routeName, + // ), + const MyStackView( + key: Key("myStackViewKey"), + ), + Container( + color: Colors.green, + ), + Container( + color: Colors.red, + ), + Container( + color: Colors.orange, + ), + Container( + color: Colors.yellow, + ), + Container( + color: Colors.blue, + ), + Container( + color: Colors.pink, + ), + Container( + color: Colors.purple, + ), + ]; + + void onMenuSelectionChanged(int newIndex) { + setState(() { + currentViewIndex = newIndex; + }); + } + + @override + Widget build(BuildContext context) { + return Material( + color: StackTheme.instance.color.background, + child: Row( + children: [ + DesktopMenu( + onSelectionChanged: onMenuSelectionChanged, + ), + Expanded( + child: contentViews[currentViewIndex], + ), + ], + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/desktop_menu.dart b/lib/pages_desktop_specific/home/desktop_menu.dart new file mode 100644 index 000000000..32b526e30 --- /dev/null +++ b/lib/pages_desktop_specific/home/desktop_menu.dart @@ -0,0 +1,221 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_menu_item.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class DesktopMenu extends ConsumerStatefulWidget { + const DesktopMenu({ + Key? key, + required this.onSelectionChanged, + }) : super(key: key); + + final void Function(int)? onSelectionChanged; + + @override + ConsumerState createState() => _DesktopMenuState(); +} + +class _DesktopMenuState extends ConsumerState { + static const expandedWidth = 225.0; + static const minimizedWidth = 72.0; + + double _width = expandedWidth; + int selectedMenuItem = 0; + + void updateSelectedMenuItem(int index) { + setState(() { + selectedMenuItem = index; + }); + widget.onSelectionChanged?.call(index); + } + + void toggleMinimize() { + setState(() { + _width = _width == expandedWidth ? minimizedWidth : expandedWidth; + }); + } + + @override + Widget build(BuildContext context) { + return Material( + color: StackTheme.instance.color.popupBG, + child: SizedBox( + width: _width, + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + SizedBox( + height: _width == expandedWidth ? 22 : 25, + ), + SizedBox( + width: _width == expandedWidth ? 70 : 32, + height: _width == expandedWidth ? 70 : 32, + child: SvgPicture.asset( + Assets.svg.stackIcon, + ), + ), + const SizedBox( + height: 10, + ), + Text( + _width == expandedWidth ? "Stack Wallet" : "", + style: STextStyles.desktopH2.copyWith( + fontSize: 18, + height: 23.4 / 18, + ), + ), + const SizedBox( + height: 60, + ), + SizedBox( + width: _width == expandedWidth + ? _width - 32 // 16 padding on either side + : _width - 16, // 8 padding on either side + child: Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.walletFa, + width: 20, + height: 20, + ), + label: "My Stack", + value: 0, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.exchange3, + width: 20, + height: 20, + ), + label: "Exchange", + value: 1, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.bell, + width: 20, + height: 20, + ), + label: "Notifications", + value: 2, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.addressBook2, + width: 20, + height: 20, + ), + label: "Address Book", + value: 3, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.gear, + width: 20, + height: 20, + ), + label: "Settings", + value: 4, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.messageQuestion, + width: 20, + height: 20, + ), + label: "Support", + value: 5, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.messageQuestion, + width: 20, + height: 20, + ), + label: "About", + value: 6, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + const SizedBox( + height: 2, + ), + DesktopMenuItem( + icon: SvgPicture.asset( + Assets.svg.messageQuestion, + width: 20, + height: 20, + ), + label: "Exit", + value: 7, + group: selectedMenuItem, + onChanged: updateSelectedMenuItem, + iconOnly: _width == minimizedWidth, + ), + ], + ), + ), + const Spacer(), + Row( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + const Spacer(), + IconButton( + splashRadius: 18, + onPressed: toggleMinimize, + icon: SvgPicture.asset( + Assets.svg.minimize, + height: 12, + width: 12, + ), + ), + ], + ) + ], + ), + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/desktop_menu_item.dart b/lib/pages_desktop_specific/home/desktop_menu_item.dart new file mode 100644 index 000000000..66f4be6cd --- /dev/null +++ b/lib/pages_desktop_specific/home/desktop_menu_item.dart @@ -0,0 +1,58 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class DesktopMenuItem extends StatelessWidget { + const DesktopMenuItem({ + Key? key, + required this.icon, + required this.label, + required this.value, + required this.group, + required this.onChanged, + required this.iconOnly, + }) : super(key: key); + + final Widget icon; + final String label; + final T value; + final T group; + final void Function(T) onChanged; + final bool iconOnly; + + @override + Widget build(BuildContext context) { + return TextButton( + style: value == group + ? StackTheme.instance.getDesktopMenuButtonColorSelected(context) + : StackTheme.instance.getDesktopMenuButtonColor(context), + onPressed: () { + onChanged(value); + }, + child: Padding( + padding: EdgeInsets.symmetric( + vertical: 16, + horizontal: iconOnly ? 0 : 16, + ), + child: Row( + mainAxisAlignment: + iconOnly ? MainAxisAlignment.center : MainAxisAlignment.start, + children: [ + icon, + if (!iconOnly) + const SizedBox( + width: 12, + ), + if (!iconOnly) + Text( + label, + style: value == group + ? STextStyles.desktopMenuItemSelected + : STextStyles.desktopMenuItem, + ), + ], + ), + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/my_stack_view/coin_wallets_table.dart b/lib/pages_desktop_specific/home/my_stack_view/coin_wallets_table.dart new file mode 100644 index 000000000..5635b2544 --- /dev/null +++ b/lib/pages_desktop_specific/home/my_stack_view/coin_wallets_table.dart @@ -0,0 +1,48 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/widgets/wallet_info_row/wallet_info_row.dart'; + +class CoinWalletsTable extends ConsumerWidget { + const CoinWalletsTable({ + Key? key, + required this.walletIds, + }) : super(key: key); + + final List walletIds; + + @override + Widget build(BuildContext context, WidgetRef ref) { + return Container( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 20, + vertical: 16, + ), + child: Column( + children: [ + for (int i = 0; i < walletIds.length; i++) + Column( + children: [ + if (i != 0) + const SizedBox( + height: 32, + ), + WalletInfoRow( + walletId: walletIds[i], + ), + ], + ), + ], + ), + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart b/lib/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart new file mode 100644 index 000000000..9fcd84252 --- /dev/null +++ b/lib/pages_desktop_specific/home/my_stack_view/exit_to_my_stack_button.dart @@ -0,0 +1,44 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class ExitToMyStackButton extends StatelessWidget { + const ExitToMyStackButton({ + Key? key, + this.onPressed, + }) : super(key: key); + + final VoidCallback? onPressed; + + @override + Widget build(BuildContext context) { + return Padding( + padding: const EdgeInsets.only( + right: 24, + ), + child: SizedBox( + height: 56, + child: TextButton( + style: + StackTheme.instance.getSmallSecondaryEnabledButtonColor(context), + onPressed: onPressed ?? + () { + Navigator.of(context).popUntil( + ModalRoute.withName(DesktopHomeView.routeName), + ); + }, + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 30, + ), + child: Text( + "Exit to My Stack", + style: STextStyles.desktopButtonSmallSecondaryEnabled, + ), + ), + ), + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/my_stack_view/my_stack_view.dart b/lib/pages_desktop_specific/home/my_stack_view/my_stack_view.dart new file mode 100644 index 000000000..2bbcd6251 --- /dev/null +++ b/lib/pages_desktop_specific/home/my_stack_view/my_stack_view.dart @@ -0,0 +1,62 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:stackwallet/pages/wallets_view/sub_widgets/empty_wallets.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/my_wallets.dart'; +import 'package:stackwallet/providers/global/prefs_provider.dart'; +import 'package:stackwallet/providers/global/wallets_provider.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; + +class MyStackView extends ConsumerStatefulWidget { + const MyStackView({Key? key}) : super(key: key); + + static const String routeName = "/myStackDesktop"; + + @override + ConsumerState createState() => _MyStackViewState(); +} + +class _MyStackViewState extends ConsumerState { + @override + Widget build(BuildContext context) { + debugPrint("BUILD: $runtimeType"); + final hasWallets = ref.watch(walletsChangeNotifierProvider).hasWallets; + + final showFavorites = ref.watch(prefsChangeNotifierProvider + .select((value) => value.showFavoriteWallets)); + + return Column( + children: [ + DesktopAppBar( + isCompactHeight: true, + leading: Row( + children: [ + const SizedBox( + width: 24, + ), + SizedBox( + width: 32, + height: 32, + child: SvgPicture.asset( + Assets.svg.stackIcon, + ), + ), + const SizedBox( + width: 12, + ), + Text( + "My Stack", + style: STextStyles.desktopH3, + ) + ], + ), + ), + Expanded( + child: hasWallets ? const MyWallets() : const EmptyWallets(), + ), + ], + ); + } +} diff --git a/lib/pages_desktop_specific/home/my_stack_view/my_wallets.dart b/lib/pages_desktop_specific/home/my_stack_view/my_wallets.dart new file mode 100644 index 000000000..34d992e89 --- /dev/null +++ b/lib/pages_desktop_specific/home/my_stack_view/my_wallets.dart @@ -0,0 +1,71 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/pages/add_wallet_views/add_wallet_view/add_wallet_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_summary_table.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; + +class MyWallets extends StatefulWidget { + const MyWallets({Key? key}) : super(key: key); + + @override + State createState() => _MyWalletsState(); +} + +class _MyWalletsState extends State { + @override + Widget build(BuildContext context) { + return Padding( + padding: const EdgeInsets.all(24), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + "Favorite wallets", + style: STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textFieldActiveSearchIconRight, + ), + ), + const SizedBox( + height: 20, + ), + // TODO favorites grid + Container( + color: Colors.deepPurpleAccent, + height: 210, + ), + + const SizedBox( + height: 40, + ), + + Row( + children: [ + Text( + "All wallets", + style: STextStyles.desktopTextExtraSmall.copyWith( + color: + StackTheme.instance.color.textFieldActiveSearchIconRight, + ), + ), + const Spacer(), + BlueTextButton( + text: "Add new wallet", + onTap: () { + Navigator.of(context).pushNamed(AddWalletView.routeName); + }, + ), + ], + ), + + const SizedBox( + height: 20, + ), + const Expanded( + child: WalletSummaryTable(), + ), + ], + ), + ); + } +} diff --git a/lib/pages_desktop_specific/home/my_stack_view/wallet_summary_table.dart b/lib/pages_desktop_specific/home/my_stack_view/wallet_summary_table.dart new file mode 100644 index 000000000..72dbda00a --- /dev/null +++ b/lib/pages_desktop_specific/home/my_stack_view/wallet_summary_table.dart @@ -0,0 +1,161 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/coin_wallets_table.dart'; +import 'package:stackwallet/providers/providers.dart'; +import 'package:stackwallet/utilities/assets.dart'; + +import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/format.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/widgets/table_view/table_view.dart'; +import 'package:stackwallet/widgets/table_view/table_view_cell.dart'; +import 'package:stackwallet/widgets/table_view/table_view_row.dart'; + +class WalletSummaryTable extends ConsumerStatefulWidget { + const WalletSummaryTable({Key? key}) : super(key: key); + + @override + ConsumerState createState() => _WalletTableState(); +} + +class _WalletTableState extends ConsumerState { + @override + Widget build(BuildContext context) { + final providersByCoin = ref + .watch( + walletsChangeNotifierProvider.select( + (value) => value.getManagerProvidersByCoin(), + ), + ) + .entries + .toList(growable: false); + + return TableView( + rows: [ + for (int i = 0; i < providersByCoin.length; i++) + TableViewRow( + padding: const EdgeInsets.symmetric( + horizontal: 20, + vertical: 16, + ), + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + cells: [ + TableViewCell( + flex: 4, + child: Row( + children: [ + SvgPicture.asset( + Assets.svg.iconFor(coin: providersByCoin[i].key), + width: 28, + height: 28, + ), + const SizedBox( + width: 10, + ), + Text( + providersByCoin[i].key.prettyName, + style: STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textDark, + ), + ) + ], + ), + ), + TableViewCell( + flex: 4, + child: Text( + providersByCoin[i].value.length == 1 + ? "${providersByCoin[i].value.length} wallet" + : "${providersByCoin[i].value.length} wallets", + style: STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ), + ), + ), + TableViewCell( + flex: 6, + child: TablePriceInfo( + coin: providersByCoin[i].key, + ), + ), + ], + expandingChild: CoinWalletsTable( + walletIds: ref.watch( + walletsChangeNotifierProvider.select( + (value) => value.getWalletIdsFor( + coin: providersByCoin[i].key, + ), + ), + ), + ), + ) + ], + ); + } +} + +class TablePriceInfo extends ConsumerWidget { + const TablePriceInfo({Key? key, required this.coin}) : super(key: key); + + final Coin coin; + + @override + Widget build(BuildContext context, WidgetRef ref) { + final tuple = ref.watch( + priceAnd24hChangeNotifierProvider.select( + (value) => value.getPrice(coin), + ), + ); + + final currency = ref.watch( + prefsChangeNotifierProvider.select( + (value) => value.currency, + ), + ); + + final priceString = Format.localizedStringAsFixed( + value: tuple.item1, + locale: ref + .watch( + localeServiceChangeNotifierProvider.notifier, + ) + .locale, + decimalPlaces: 2, + ); + + final double percentChange = tuple.item2; + + var percentChangedColor = StackTheme.instance.color.textDark; + if (percentChange > 0) { + percentChangedColor = StackTheme.instance.color.accentColorGreen; + } else if (percentChange < 0) { + percentChangedColor = StackTheme.instance.color.accentColorRed; + } + + return Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + "$priceString $currency/${coin.ticker}", + style: STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ), + ), + Text( + "${percentChange.toStringAsFixed(2)}%", + style: STextStyles.desktopTextExtraSmall.copyWith( + color: percentChangedColor, + ), + ), + ], + ); + } +} diff --git a/lib/route_generator.dart b/lib/route_generator.dart index df15f65fe..797b62969 100644 --- a/lib/route_generator.dart +++ b/lib/route_generator.dart @@ -10,7 +10,7 @@ import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view import 'package:stackwallet/pages/add_wallet_views/name_your_wallet_view/name_your_wallet_view.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_view/new_wallet_recovery_phrase_view.dart'; import 'package:stackwallet/pages/add_wallet_views/new_wallet_recovery_phrase_warning_view/new_wallet_recovery_phrase_warning_view.dart'; -import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view.dart'; +import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart'; import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_wallet_view.dart'; import 'package:stackwallet/pages/add_wallet_views/verify_recovery_phrase_view/verify_recovery_phrase_view.dart'; import 'package:stackwallet/pages/address_book_views/address_book_view.dart'; @@ -75,6 +75,9 @@ import 'package:stackwallet/pages/wallet_view/transaction_views/transaction_deta import 'package:stackwallet/pages/wallet_view/transaction_views/transaction_search_filter_view.dart'; import 'package:stackwallet/pages/wallet_view/wallet_view.dart'; import 'package:stackwallet/pages/wallets_view/wallets_view.dart'; +import 'package:stackwallet/pages_desktop_specific/create_password/create_password_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/desktop_home_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/my_stack_view.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/services/event_bus/events/global/node_connection_status_changed_event.dart'; import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart'; @@ -876,6 +879,27 @@ class RouteGenerator { } return _routeError("${settings.name} invalid args: ${args.toString()}"); + // == Desktop specific routes ============================================ + case CreatePasswordView.routeName: + return getRoute( + shouldUseMaterialRoute: useMaterialPageRoute, + builder: (_) => const CreatePasswordView(), + settings: RouteSettings(name: settings.name)); + + case DesktopHomeView.routeName: + return getRoute( + shouldUseMaterialRoute: useMaterialPageRoute, + builder: (_) => const DesktopHomeView(), + settings: RouteSettings(name: settings.name)); + + case MyStackView.routeName: + return getRoute( + shouldUseMaterialRoute: useMaterialPageRoute, + builder: (_) => const MyStackView(), + settings: RouteSettings(name: settings.name)); + + // == End of desktop specific routes ===================================== + default: return _routeError(""); } diff --git a/lib/services/wallets.dart b/lib/services/wallets.dart index 66bd968d4..034db9308 100644 --- a/lib/services/wallets.dart +++ b/lib/services/wallets.dart @@ -51,6 +51,16 @@ class Wallets extends ChangeNotifier { _managerProviderMap.values.toList(growable: false); List get managers => _managerMap.values.toList(growable: false); + List getWalletIdsFor({required Coin coin}) { + final List result = []; + for (final manager in _managerMap.values) { + if (manager.coin == coin) { + result.add(manager.walletId); + } + } + return result; + } + Map>> getManagerProvidersByCoin() { Map>> result = {}; for (final manager in _managerMap.values) { diff --git a/lib/utilities/assets.dart b/lib/utilities/assets.dart index 87e3b44ed..883729ae9 100644 --- a/lib/utilities/assets.dart +++ b/lib/utilities/assets.dart @@ -1,5 +1,5 @@ -import 'package:stackwallet/services/coins/namecoin/namecoin_wallet.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; abstract class Assets { static const svg = _SVG(); @@ -23,8 +23,10 @@ class _SVG { String get plus => "assets/svg/plus.svg"; String get gear => "assets/svg/gear.svg"; String get bell => "assets/svg/bell.svg"; - String get bellNew => "assets/svg/bell-new.svg"; - String get stackIcon => "assets/svg/stack-icon1.svg"; + String get bellNew => + "assets/svg/${StackTheme.instance.theme.name}/bell-new.svg"; + String get stackIcon => + "assets/svg/${StackTheme.instance.theme.name}/stack-icon1.svg"; String get arrowLeft => "assets/svg/arrow-left-fa.svg"; String get star => "assets/svg/star.svg"; String get copy => "assets/svg/copy-fa.svg"; @@ -36,8 +38,10 @@ class _SVG { String get bars => "assets/svg/bars.svg"; String get filter => "assets/svg/filter.svg"; String get pending => "assets/svg/pending.svg"; - String get exchange => "assets/svg/exchange-2.svg"; - String get buy => "assets/svg/buy-coins-icon.svg"; + String get exchange => + "assets/svg/${StackTheme.instance.theme.name}/exchange-2.svg"; + String get buy => + "assets/svg/${StackTheme.instance.theme.name}/buy-coins-icon.svg"; String get radio => "assets/svg/signal-stream.svg"; String get arrowRotate => "assets/svg/arrow-rotate.svg"; String get arrowRotate2 => "assets/svg/arrow-rotate2.svg"; @@ -52,6 +56,7 @@ class _SVG { String get lock => "assets/svg/lock-keyhole.svg"; String get network => "assets/svg/network-wired.svg"; String get addressBook => "assets/svg/address-book.svg"; + String get addressBook2 => "assets/svg/address-book2.svg"; String get arrowRotate3 => "assets/svg/rotate-exclamation.svg"; String get delete => "assets/svg/delete.svg"; String get arrowRight => "assets/svg/arrow-right.svg"; @@ -90,20 +95,29 @@ class _SVG { String get anonymizePending => "assets/svg/tx-icon-anonymize-pending.svg"; String get anonymizeFailed => "assets/svg/tx-icon-anonymize-failed.svg"; - String get receive => "assets/svg/tx-icon-receive.svg"; - String get receivePending => "assets/svg/tx-icon-receive-pending.svg"; - String get receiveCancelled => "assets/svg/tx-icon-receive-failed.svg"; + String get receive => + "assets/svg/${StackTheme.instance.theme.name}/tx-icon-receive.svg"; + String get receivePending => + "assets/svg/${StackTheme.instance.theme.name}/tx-icon-receive-pending.svg"; + String get receiveCancelled => + "assets/svg/${StackTheme.instance.theme.name}/tx-icon-receive-failed.svg"; - String get send => "assets/svg/tx-icon-send.svg"; - String get sendPending => "assets/svg/tx-icon-send-pending.svg"; - String get sendCancelled => "assets/svg/tx-icon-send-failed.svg"; + String get send => + "assets/svg/${StackTheme.instance.theme.name}/tx-icon-send.svg"; + String get sendPending => + "assets/svg/${StackTheme.instance.theme.name}/tx-icon-send-pending.svg"; + String get sendCancelled => + "assets/svg/${StackTheme.instance.theme.name}/tx-icon-send-failed.svg"; String get ellipse1 => "assets/svg/Ellipse-43.svg"; String get ellipse2 => "assets/svg/Ellipse-42.svg"; - String get txExchange => "assets/svg/tx-exchange-icon.svg"; - String get txExchangePending => "assets/svg/tx-exchange-icon-pending.svg"; - String get txExchangeFailed => "assets/svg/tx-exchange-icon-failed.svg"; + String get txExchange => + "assets/svg/${StackTheme.instance.theme.name}/tx-exchange-icon.svg"; + String get txExchangePending => + "assets/svg/${StackTheme.instance.theme.name}/tx-exchange-icon-pending.svg"; + String get txExchangeFailed => + "assets/svg/${StackTheme.instance.theme.name}/tx-exchange-icon-failed.svg"; String get bitcoin => "assets/svg/coin_icons/Bitcoin.svg"; String get bitcoincash => "assets/svg/coin_icons/Bitcoincash.svg"; @@ -113,6 +127,12 @@ class _SVG { String get monero => "assets/svg/coin_icons/Monero.svg"; String get namecoin => "assets/svg/coin_icons/Namecoin.svg"; + String get chevronRight => "assets/svg/chevron-right.svg"; + String get minimize => "assets/svg/minimize.svg"; + String get walletFa => "assets/svg/wallet-fa.svg"; + String get exchange3 => "assets/svg/exchange-3.svg"; + String get messageQuestion => "assets/svg/message-question-1.svg"; + // TODO provide proper assets String get bitcoinTestnet => "assets/svg/coin_icons/Bitcoin.svg"; String get bitcoincashTestnet => "assets/svg/coin_icons/Bitcoincash.svg"; @@ -138,7 +158,7 @@ class _SVG { case Coin.bitcoinTestNet: return bitcoinTestnet; case Coin.bitcoincashTestnet: - return bitcoinTestnet; + return bitcoincashTestnet; case Coin.firoTestNet: return firoTestnet; case Coin.dogecoinTestNet: diff --git a/lib/utilities/cfcolors.dart b/lib/utilities/cfcolors.dart deleted file mode 100644 index 8f460aa4e..000000000 --- a/lib/utilities/cfcolors.dart +++ /dev/null @@ -1,158 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:stackwallet/models/exchange/change_now/exchange_transaction_status.dart'; -import 'package:stackwallet/utilities/enums/coin_enum.dart'; - -class _CoinThemeColor { - const _CoinThemeColor(); - - Color get bitcoin => const Color(0xFFFCC17B); - Color get bitcoincash => const Color(0xFF7BCFB8); - Color get firo => const Color(0xFFFF897A); - Color get dogecoin => const Color(0xFFFFE079); - Color get epicCash => const Color(0xFFC5C7CB); - Color get monero => const Color(0xFFFF9E6B); - Color get namecoin => const Color(0xFF91B1E1); - Color get wownero => const Color(0xFFED80C1); - - Color forCoin(Coin coin) { - switch (coin) { - case Coin.bitcoin: - case Coin.bitcoinTestNet: - return bitcoin; - case Coin.bitcoincash: - case Coin.bitcoincashTestnet: - return bitcoincash; - case Coin.dogecoin: - case Coin.dogecoinTestNet: - return dogecoin; - case Coin.epicCash: - return epicCash; - case Coin.firo: - case Coin.firoTestNet: - return firo; - case Coin.monero: - return monero; - case Coin.namecoin: - return namecoin; - // case Coin.wownero: - // return wownero; - } - } -} - -class _ChangeNowTradeStatusColors { - const _ChangeNowTradeStatusColors(); - - Color get yellow => const Color(0xFFD3A90F); - Color get green => CFColors.stackGreen; - Color get red => CFColors.link; - Color get gray => CFColors.gray3; - - Color forStatus(ChangeNowTransactionStatus status) { - switch (status) { - case ChangeNowTransactionStatus.New: - case ChangeNowTransactionStatus.Waiting: - case ChangeNowTransactionStatus.Confirming: - case ChangeNowTransactionStatus.Exchanging: - case ChangeNowTransactionStatus.Sending: - case ChangeNowTransactionStatus.Verifying: - return yellow; - case ChangeNowTransactionStatus.Finished: - return green; - case ChangeNowTransactionStatus.Failed: - return red; - case ChangeNowTransactionStatus.Refunded: - return gray; - } - } -} - -abstract class CFColors { - static const coin = _CoinThemeColor(); - static const status = _ChangeNowTradeStatusColors(); - - static const Color splashLight = Color(0x44A9ACAC); - static const Color splashMed = Color(0x358E9192); - static const Color splashDark = Color(0x33232323); - - static const Color selected = Color(0xFFF9F9FC); - static const Color selected2 = Color(0xFFE0E3E3); - - static const Color primary = Color(0xFF0052DF); - static const Color primaryLight = Color(0xFFDAE2FF); - - static const Color link = Color(0xFFC00205); - static const Color link2 = Color(0xFF0056D2); - - static const Color warningBackground = Color(0xFFFFDAD3); - - static const Color marked = Color(0xFFF61515); - static const Color stackGreen = Color(0xFF00A578); - static const Color stackYellow = Color(0xFFF4C517); - static const Color stackGreen15 = Color(0xFFD2EBE4); - static const Color stackRed = Color(0xFFDC5673); - static const Color sentTx = Color(0x66FE805C); - static const Color receivedTx = Color(0x6600A578); - // static const Color stackAccent = Color(0xFF232323); - // static const Color stackAccent = Color(0xFF232323); - static const Color stackAccent = Color(0xFF232323); - static const Color black = Color(0xFF191B23); - - static const Color primaryBlue = Color(0xFF074EE8); - static const Color notificationBlueBackground = Color(0xFFDAE2FF); - static const Color notificationBlueForeground = Color(0xFF002A78); - static const Color notificationGreenBackground = Color(0xFFB9E9D4); - static const Color notificationGreenForeground = Color(0xFF006C4D); - static const Color notificationRedBackground = Color(0xFFFFDAD4); - static const Color notificationRedForeground = Color(0xFF930006); - static const Color error = Color(0xFF930006); - - static const Color almostWhite = Color(0xFFF7F7F7); - static const Color light1 = Color(0xFFF5F5F5); - - static const Color disabledButton = Color(0xFFE0E3E3); - - static const Color neutral80 = Color(0xFFC5C6C9); - static const Color neutral60 = Color(0xFF8E9192); - static const Color neutral50 = Color(0xFF747778); - static const Color selection = Color(0xFFD9E2FF); - static const Color buttonGray = Color(0xFFE0E3E3); - - static const Color textFieldInactive = Color(0xFFEEEFF1); - static const Color fieldGray = Color(0xFFEEEFF1); - static const Color textFieldActive = Color(0xFFE9EAEC); - - static const Color contactIconBackground = Color(0xFFF4F5F8); - - static const Color gray3 = Color(0xFFA9ACAC); - // shadow - static const Color shadowColor = Color(0x0F2D3132); - static const BoxShadow standardBoxShadow = BoxShadow( - color: CFColors.shadowColor, - spreadRadius: 3, - blurRadius: 4, - ); - - // generic - static const Color white = Color(0xFFFFFFFF); - - static MaterialColor createMaterialColor(Color color) { - List strengths = [.05]; - final swatch = {}; - final int r = color.red, g = color.green, b = color.blue; - - for (int i = 1; i < 10; i++) { - strengths.add(0.1 * i); - } - for (var strength in strengths) { - final double ds = 0.5 - strength; - swatch[(strength * 1000).round()] = Color.fromRGBO( - r + ((ds < 0 ? r : (255 - r)) * ds).round(), - g + ((ds < 0 ? g : (255 - g)) * ds).round(), - b + ((ds < 0 ? b : (255 - b)) * ds).round(), - 1, - ); - } - return MaterialColor(color.value, swatch); - } -} diff --git a/lib/utilities/default_nodes.dart b/lib/utilities/default_nodes.dart index dfbab231c..142ba4dfa 100644 --- a/lib/utilities/default_nodes.dart +++ b/lib/utilities/default_nodes.dart @@ -1,7 +1,6 @@ import 'dart:convert'; import 'package:stackwallet/models/node_model.dart'; -import 'package:stackwallet/services/coins/namecoin/namecoin_wallet.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; abstract class DefaultNodes { @@ -97,7 +96,7 @@ abstract class DefaultNodes { static NodeModel get namecoin => NodeModel( host: "namecoin.stackwallet.com", - port: 8336, + port: 57002, name: defaultName, id: _nodeId(Coin.namecoin), useSSL: true, diff --git a/lib/utilities/text_styles.dart b/lib/utilities/text_styles.dart index 71612a660..cce566322 100644 --- a/lib/utilities/text_styles.dart +++ b/lib/utilities/text_styles.dart @@ -1,175 +1,244 @@ import 'package:flutter/material.dart'; import 'package:google_fonts/google_fonts.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class STextStyles { static final TextStyle pageTitleH1 = GoogleFonts.inter( - color: CFColors.black, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w600, fontSize: 20, ); static final TextStyle pageTitleH2 = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w600, fontSize: 18, ); static final TextStyle navBarTitle = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w600, fontSize: 16, ); static final TextStyle titleBold12 = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w600, fontSize: 16, ); static final TextStyle subtitle = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w400, fontSize: 16, ); static final TextStyle button = GoogleFonts.inter( - color: CFColors.white, + color: StackTheme.instance.color.buttonTextPrimary, fontWeight: FontWeight.w500, fontSize: 16, ); static final TextStyle largeMedium14 = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w500, fontSize: 16, ); static final TextStyle smallMed14 = GoogleFonts.inter( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, fontWeight: FontWeight.w500, fontSize: 16, ); static final TextStyle smallMed12 = GoogleFonts.inter( - color: CFColors.neutral50, + color: StackTheme.instance.color.textDark3, fontWeight: FontWeight.w500, fontSize: 14, ); static final TextStyle label = GoogleFonts.inter( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, fontWeight: FontWeight.w500, fontSize: 12, ); static final TextStyle itemSubtitle = GoogleFonts.inter( - color: CFColors.neutral60, + color: StackTheme.instance.color.infoItemLabel, fontWeight: FontWeight.w500, fontSize: 14, ); static final TextStyle itemSubtitle12 = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w500, fontSize: 14, ); static final TextStyle fieldLabel = GoogleFonts.inter( - color: CFColors.gray3, + color: StackTheme.instance.color.textSubtitle2, fontWeight: FontWeight.w500, fontSize: 14, height: 1.5, ); static final TextStyle field = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w500, fontSize: 14, height: 1.5, ); static final TextStyle baseXS = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w400, fontSize: 14, ); static final TextStyle link = GoogleFonts.inter( - color: CFColors.link, + color: StackTheme.instance.color.accentColorRed, fontWeight: FontWeight.w500, fontSize: 14, ); static final TextStyle link2 = GoogleFonts.inter( - color: CFColors.link2, + color: StackTheme.instance.color.infoItemIcons, fontWeight: FontWeight.w500, fontSize: 14, ); static final TextStyle richLink = GoogleFonts.inter( - color: CFColors.primaryBlue, + color: StackTheme.instance.color.accentColorBlue, fontWeight: FontWeight.w500, fontSize: 12, ); static final TextStyle w600_10 = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w600, fontSize: 12, ); static final TextStyle syncPercent = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w500, fontSize: 12, ); static final TextStyle buttonSmall = GoogleFonts.inter( - color: CFColors.stackAccent, + color: StackTheme.instance.color.textDark, fontWeight: FontWeight.w500, fontSize: 12, ); static final TextStyle errorSmall = GoogleFonts.inter( - color: CFColors.error, + color: StackTheme.instance.color.textError, fontWeight: FontWeight.w500, fontSize: 10, ); static final TextStyle infoSmall = GoogleFonts.inter( - color: CFColors.neutral60, + color: StackTheme.instance.color.textSubtitle1, fontWeight: FontWeight.w500, fontSize: 10, ); - // static final TextStyle pinkHeader = GoogleFonts.workSans( - // color: CFColors.spark, - // fontWeight: FontWeight.w600, - // fontSize: 20, - // ); - // - // static final TextStyle textField = GoogleFonts.workSans( - // color: CFColors.dusk, - // fontWeight: FontWeight.w400, - // fontSize: 16, - // ); - // - // static final TextStyle textFieldHint = GoogleFonts.workSans( - // color: CFColors.twilight, - // fontWeight: FontWeight.w400, - // fontSize: 16, - // ); - // - // static final TextStyle textFieldSuffix = GoogleFonts.workSans( - // color: CFColors.twilight, - // fontWeight: FontWeight.w600, - // fontSize: 16, - // ); - // - // static final TextStyle label = GoogleFonts.workSans( - // color: CFColors.twilight, - // fontWeight: FontWeight.w500, - // fontSize: 12, - // ); +// Desktop + + static final TextStyle desktopH2 = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w600, + fontSize: 32, + height: 32 / 32, + ); + + static final TextStyle desktopH3 = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w600, + fontSize: 24, + height: 24 / 24, + ); + + static final TextStyle desktopTextMedium = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 30 / 20, + ); + + static final TextStyle desktopTextMediumRegular = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w400, + fontSize: 20, + height: 30 / 20, + ); + + static final TextStyle desktopSubtitleH2 = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w400, + fontSize: 20, + height: 28 / 20, + ); + + static final TextStyle desktopSubtitleH1 = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w400, + fontSize: 24, + height: 33 / 24, + ); + + static final TextStyle desktopButtonEnabled = GoogleFonts.inter( + color: StackTheme.instance.color.buttonTextPrimary, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + + static final TextStyle desktopButtonDisabled = GoogleFonts.inter( + color: StackTheme.instance.color.buttonTextPrimaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + + static final TextStyle desktopButtonSecondaryEnabled = GoogleFonts.inter( + color: StackTheme.instance.color.buttonTextSecondary, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + + static final TextStyle desktopTextExtraSmall = GoogleFonts.inter( + color: StackTheme.instance.color.buttonTextPrimaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 24 / 16, + ); + + static final TextStyle desktopButtonSmallSecondaryEnabled = GoogleFonts.inter( + color: StackTheme.instance.color.buttonTextSecondary, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 24 / 16, + ); + + static final TextStyle desktopTextFieldLabel = GoogleFonts.inter( + color: StackTheme.instance.color.textSubtitle2, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 30 / 20, + ); + + static final TextStyle desktopMenuItem = GoogleFonts.inter( + color: StackTheme.instance.color.textDark.withOpacity(0.8), + fontWeight: FontWeight.w500, + fontSize: 16, + height: 20.8 / 16, + ); + static final TextStyle desktopMenuItemSelected = GoogleFonts.inter( + color: StackTheme.instance.color.textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 20.8 / 16, + ); } diff --git a/lib/utilities/theme/color_theme.dart b/lib/utilities/theme/color_theme.dart new file mode 100644 index 000000000..1152ca38b --- /dev/null +++ b/lib/utilities/theme/color_theme.dart @@ -0,0 +1,204 @@ +import 'dart:ui'; + +import 'package:stackwallet/utilities/enums/coin_enum.dart'; + +enum ThemeType { + light, + dark, +} + +abstract class StackColorTheme { + Color get background; + Color get overlay; + Color get warningBackground; + Color get splash; + Color get highlight; + + Color get accentColorBlue; + Color get accentColorGreen; + Color get accentColorYellow; + Color get accentColorRed; + Color get accentColorOrange; + Color get accentColorDark; + + Color get shadow; + + Color get textDark; + Color get textDark2; + Color get textDark3; + Color get textSubtitle1; + Color get textSubtitle2; + Color get textSubtitle3; + Color get textSubtitle4; + Color get textSubtitle5; + Color get textSubtitle6; + Color get textWhite; + Color get textFavoriteCard; + Color get textError; + +// button background + Color get buttonBackPrimary; + Color get buttonBackSecondary; + Color get buttonBackPrimaryDisabled; + Color get buttonBackSecondaryDisabled; + Color get buttonBackBorder; + Color get buttonBackBorderDisabled; + Color get numberBackDefault; + Color get numpadBackDefault; + Color get bottomNavBack; + +// button text/element + Color get buttonTextPrimary; + Color get buttonTextSecondary; + Color get buttonTextPrimaryDisabled; + Color get buttonTextSecondaryDisabled; + Color get buttonTextBorder; + Color get buttonTextDisabled; + Color get buttonTextBorderless; + Color get buttonTextBorderlessDisabled; + Color get numberTextDefault; + Color get numpadTextDefault; + Color get bottomNavText; + +// switch background + Color get switchBGOn; + Color get switchBGOff; + Color get switchBGDisabled; + +// switch circle + Color get switchCircleOn; + Color get switchCircleOff; + Color get switchCircleDisabled; + +// step indicator background + Color get stepIndicatorBGCheck; + Color get stepIndicatorBGNumber; + Color get stepIndicatorBGInactive; + Color get stepIndicatorBGLines; + Color get stepIndicatorBGLinesInactive; + Color get stepIndicatorIconText; + Color get stepIndicatorIconNumber; + Color get stepIndicatorIconInactive; + +// checkbox + Color get checkboxBGChecked; + Color get checkboxBorderEmpty; + Color get checkboxBGDisabled; + Color get checkboxIconChecked; + Color get checkboxIconDisabled; + Color get checkboxTextLabel; + +// snack bar + Color get snackBarBackSuccess; + Color get snackBarBackError; + Color get snackBarBackInfo; + Color get snackBarTextSuccess; + Color get snackBarTextError; + Color get snackBarTextInfo; + +// icons + Color get bottomNavIconBack; + Color get bottomNavIconIcon; + Color get topNavIconPrimary; + Color get topNavIconGreen; + Color get topNavIconYellow; + Color get topNavIconRed; + Color get settingsIconBack; + Color get settingsIconIcon; + Color get settingsIconBack2; + Color get settingsIconElement; + +// text field + Color get textFieldActiveBG; + Color get textFieldDefaultBG; + Color get textFieldErrorBG; + Color get textFieldSuccessBG; + Color get textFieldActiveSearchIconLeft; + Color get textFieldDefaultSearchIconLeft; + Color get textFieldErrorSearchIconLeft; + Color get textFieldSuccessSearchIconLeft; + Color get textFieldActiveText; + Color get textFieldDefaultText; + Color get textFieldErrorText; + Color get textFieldSuccessText; + Color get textFieldActiveLabel; + Color get textFieldErrorLabel; + Color get textFieldSuccessLabel; + Color get textFieldActiveSearchIconRight; + Color get textFieldDefaultSearchIconRight; + Color get textFieldErrorSearchIconRight; + Color get textFieldSuccessSearchIconRight; + +// settings item level2 + Color get settingsItem2ActiveBG; + Color get settingsItem2ActiveText; + Color get settingsItem2ActiveSub; + +// radio buttons + Color get radioButtonIconBorder; + Color get radioButtonIconBorderDisabled; + Color get radioButtonBorderEnabled; + Color get radioButtonBorderDisabled; + Color get radioButtonIconCircle; + Color get radioButtonIconEnabled; + Color get radioButtonTextEnabled; + Color get radioButtonTextDisabled; + Color get radioButtonLabelEnabled; + Color get radioButtonLabelDisabled; + +// info text + Color get infoItemBG; + Color get infoItemLabel; + Color get infoItemText; + Color get infoItemIcons; + +// popup + Color get popupBG; + +// currency list + Color get currencyListItemBG; + +// bottom nav + Color get stackWalletBG; + Color get stackWalletMid; + Color get stackWalletBottom; + Color get bottomNavShadow; +} + +class CoinThemeColor { + const CoinThemeColor(); + + Color get bitcoin => const Color(0xFFFCC17B); + Color get bitcoincash => const Color(0xFF7BCFB8); + Color get firo => const Color(0xFFFF897A); + Color get dogecoin => const Color(0xFFFFE079); + Color get epicCash => const Color(0xFFC5C7CB); + Color get monero => const Color(0xFFFF9E6B); + Color get namecoin => const Color(0xFF91B1E1); + Color get wownero => const Color(0xFFED80C1); + + Color forCoin(Coin coin) { + switch (coin) { + case Coin.bitcoin: + case Coin.bitcoinTestNet: + return bitcoin; + case Coin.bitcoincash: + case Coin.bitcoincashTestnet: + return bitcoincash; + case Coin.dogecoin: + case Coin.dogecoinTestNet: + return dogecoin; + case Coin.epicCash: + return epicCash; + case Coin.firo: + case Coin.firoTestNet: + return firo; + case Coin.monero: + return monero; + case Coin.namecoin: + return namecoin; + // case Coin.wownero: + // return wownero; + } + } +} diff --git a/lib/utilities/theme/dark_colors.dart b/lib/utilities/theme/dark_colors.dart new file mode 100644 index 000000000..36e2d071c --- /dev/null +++ b/lib/utilities/theme/dark_colors.dart @@ -0,0 +1,287 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/theme/color_theme.dart'; + +class DarkColors extends StackColorTheme { + @override + Color get background => const Color(0xFF2A2D34); + @override + Color get overlay => const Color(0xFF111215); + @override + Color get warningBackground => const Color(0xFFFFB4A9); + @override + Color get splash => const Color(0x358E9192); + @override + Color get highlight => const Color(0x44A9ACAC); + + @override + Color get accentColorBlue => const Color(0xFF4C86E9); + @override + Color get accentColorGreen => const Color(0xFF4CC0A0); + @override + Color get accentColorYellow => const Color(0xFFF7D65D); + @override + Color get accentColorRed => const Color(0xFFD34E50); + @override + Color get accentColorOrange => const Color(0xFFFEA68D); + @override + Color get accentColorDark => const Color(0xFFF3F3F3); + + @override + Color get shadow => const Color(0x0F2D3132); + + @override + Color get textDark => const Color(0xFFF3F3F3); + @override + Color get textDark2 => const Color(0xFFDBDBDB); + @override + Color get textDark3 => const Color(0xFFEEEFF1); + @override + Color get textSubtitle1 => const Color(0xFF9E9E9E); + @override + Color get textSubtitle2 => const Color(0xFF969696); + @override + Color get textSubtitle3 => const Color(0xFFA9ACAC); + @override + Color get textSubtitle4 => const Color(0xFF8E9192); + @override + Color get textSubtitle5 => const Color(0xFF747778); + @override + Color get textSubtitle6 => const Color(0xFF414141); + @override + Color get textWhite => const Color(0xFF232323); + @override + Color get textFavoriteCard => const Color(0xFF232323); + @override + Color get textError => const Color(0xFFF37475); + + // button background + @override + Color get buttonBackPrimary => const Color(0xFF4C86E9); + @override + Color get buttonBackSecondary => const Color(0xFF444E5C); + @override + Color get buttonBackPrimaryDisabled => const Color(0xFF38517C); + @override + Color get buttonBackSecondaryDisabled => const Color(0xFF3B3F46); + @override + Color get buttonBackBorder => const Color(0xFF4C86E9); + @override + Color get buttonBackBorderDisabled => const Color(0xFF314265); + + @override + Color get numberBackDefault => const Color(0xFF484B51); + @override + Color get numpadBackDefault => const Color(0xFF4C86E9); + @override + Color get bottomNavBack => const Color(0xFFA2A2A2); + + // button text/element + @override + Color get buttonTextPrimary => const Color(0xFFFFFFFF); + @override + Color get buttonTextSecondary => const Color(0xFFFFFFFF); + @override + Color get buttonTextPrimaryDisabled => const Color(0xFFFFFFFF); + @override + Color get buttonTextSecondaryDisabled => const Color(0xFF6A6C71); + @override + Color get buttonTextBorder => const Color(0xFF4C86E9); + @override + Color get buttonTextDisabled => const Color(0xFF314265); + @override + Color get buttonTextBorderless => const Color(0xFF4C86E9); + @override + Color get buttonTextBorderlessDisabled => const Color(0xFFB6B6B6); + @override + Color get numberTextDefault => const Color(0xFFFFFFFF); + @override + Color get numpadTextDefault => const Color(0xFFFFFFFF); + @override + Color get bottomNavText => const Color(0xFFFFFFFF); + + // switch + @override + Color get switchBGOn => const Color(0xFF4C86E9); + @override + Color get switchBGOff => const Color(0xFFC1D9FF); + @override + Color get switchBGDisabled => const Color(0xFFB5B7BA); + @override + Color get switchCircleOn => const Color(0xFFC9DDFF); + @override + Color get switchCircleOff => const Color(0xFFFFFFFF); + @override + Color get switchCircleDisabled => const Color(0xFFFFFFFF); + + // step indicator background + @override + Color get stepIndicatorBGCheck => const Color(0xFF4C86E9); + @override + Color get stepIndicatorBGNumber => const Color(0xFF4C86E9); + @override + Color get stepIndicatorBGInactive => const Color(0xFF3B3F46); + @override + Color get stepIndicatorBGLines => const Color(0xFF4C86E9); + @override + Color get stepIndicatorBGLinesInactive => const Color(0xFF3B3F46); + @override + Color get stepIndicatorIconText => const Color(0xFFFFFFFF); + @override + Color get stepIndicatorIconNumber => const Color(0xFFFFFFFF); + @override + Color get stepIndicatorIconInactive => const Color(0xFF747474); + + // checkbox + @override + Color get checkboxBGChecked => const Color(0xFF4C86E9); + @override + Color get checkboxBorderEmpty => const Color(0xFF8E9192); + @override + Color get checkboxBGDisabled => const Color(0xFFADC7EC); + @override + Color get checkboxIconChecked => const Color(0xFFFFFFFF); + @override + Color get checkboxIconDisabled => const Color(0xFFFFFFFF); + @override + Color get checkboxTextLabel => const Color(0xFFFFFFFF); + + // snack bar + @override + Color get snackBarBackSuccess => const Color(0xFF8EF5C3); + @override + Color get snackBarBackError => const Color(0xFFFFB4A9); + @override + Color get snackBarBackInfo => const Color(0xFFB4C4FF); + @override + Color get snackBarTextSuccess => const Color(0xFF003921); + @override + Color get snackBarTextError => const Color(0xFF690001); + @override + Color get snackBarTextInfo => const Color(0xFF00297A); + + // icons + @override + Color get bottomNavIconBack => const Color(0xFF7F8185); + @override + Color get bottomNavIconIcon => const Color(0xFFFFFFFF); + + @override + Color get topNavIconPrimary => const Color(0xFFFFFFFF); + @override + Color get topNavIconGreen => const Color(0xFF4CC0A0); + @override + Color get topNavIconYellow => const Color(0xFFF7D65D); + @override + Color get topNavIconRed => const Color(0xFFD34E50); + + @override + Color get settingsIconBack => const Color(0xFFE0E3E3); + @override + Color get settingsIconIcon => const Color(0xFF232323); + @override + Color get settingsIconBack2 => const Color(0xFF94D6C4); + @override + Color get settingsIconElement => const Color(0xFF00A578); + + // text field + @override + Color get textFieldActiveBG => const Color(0xFF4C5360); + @override + Color get textFieldDefaultBG => const Color(0xFF444953); + @override + Color get textFieldErrorBG => const Color(0xFFFFB4A9); + @override + Color get textFieldSuccessBG => const Color(0xFFB9E9D4); + + @override + Color get textFieldActiveSearchIconLeft => const Color(0xFFA9ACAC); + @override + Color get textFieldDefaultSearchIconLeft => const Color(0xFFA9ACAC); + @override + Color get textFieldErrorSearchIconLeft => const Color(0xFF690001); + @override + Color get textFieldSuccessSearchIconLeft => const Color(0xFF003921); + + @override + Color get textFieldActiveText => const Color(0xFFFFFFFF); + @override + Color get textFieldDefaultText => const Color(0xFFA9ACAC); + @override + Color get textFieldErrorText => const Color(0xFF000000); + @override + Color get textFieldSuccessText => const Color(0xFF000000); + + @override + Color get textFieldActiveLabel => const Color(0xFFA9ACAC); + @override + Color get textFieldErrorLabel => const Color(0xFF690001); + @override + Color get textFieldSuccessLabel => const Color(0xFF003921); + + @override + Color get textFieldActiveSearchIconRight => const Color(0xFFC4C7C7); + @override + Color get textFieldDefaultSearchIconRight => const Color(0xFF747778); + @override + Color get textFieldErrorSearchIconRight => const Color(0xFF690001); + @override + Color get textFieldSuccessSearchIconRight => const Color(0xFF003921); + + // settings item level2 + @override + Color get settingsItem2ActiveBG => const Color(0xFF484B51); + @override + Color get settingsItem2ActiveText => const Color(0xFFFFFFFF); + @override + Color get settingsItem2ActiveSub => const Color(0xFF9E9E9E); + + // radio buttons + @override + Color get radioButtonIconBorder => const Color(0xFF4C86E9); + @override + Color get radioButtonIconBorderDisabled => const Color(0xFF9E9E9E); + @override + Color get radioButtonBorderEnabled => const Color(0xFF4C86E9); + @override + Color get radioButtonBorderDisabled => const Color(0xFFCDCDCD); + @override + Color get radioButtonIconCircle => const Color(0xFF9E9E9E); + @override + Color get radioButtonIconEnabled => const Color(0xFF4C86E9); + @override + Color get radioButtonTextEnabled => const Color(0xFF44464E); + @override + Color get radioButtonTextDisabled => const Color(0xFF44464E); + @override + Color get radioButtonLabelEnabled => const Color(0xFF8E9192); + @override + Color get radioButtonLabelDisabled => const Color(0xFF8E9192); + + // info text + @override + Color get infoItemBG => const Color(0xFF333942); + @override + Color get infoItemLabel => const Color(0xFF9E9E9E); + @override + Color get infoItemText => const Color(0xFFFFFFFF); + @override + Color get infoItemIcons => const Color(0xFF4C86E9); + + // popup + @override + Color get popupBG => const Color(0xFF333942); + + // currency list + @override + Color get currencyListItemBG => const Color(0xFF484B51); + + // bottom nav + @override + Color get stackWalletBG => const Color(0xFF35383D); + @override + Color get stackWalletMid => const Color(0xFF292D34); + @override + Color get stackWalletBottom => const Color(0xFFFFFFFF); + @override + Color get bottomNavShadow => const Color(0xFF282E33); +} diff --git a/lib/utilities/theme/light_colors.dart b/lib/utilities/theme/light_colors.dart new file mode 100644 index 000000000..8b8499e76 --- /dev/null +++ b/lib/utilities/theme/light_colors.dart @@ -0,0 +1,287 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/theme/color_theme.dart'; + +class LightColors extends StackColorTheme { + @override + Color get background => const Color(0xFFF7F7F7); + @override + Color get overlay => const Color(0xFF111215); + @override + Color get warningBackground => const Color(0xFFFFDAD3); + @override + Color get splash => const Color(0x358E9192); + @override + Color get highlight => const Color(0x44A9ACAC); + + @override + Color get accentColorBlue => const Color(0xFF4C86E9); + @override + Color get accentColorGreen => const Color(0xFF4CC0A0); + @override + Color get accentColorYellow => const Color(0xFFF7D65D); + @override + Color get accentColorRed => const Color(0xFFD34E50); + @override + Color get accentColorOrange => const Color(0xFFFEA68D); + @override + Color get accentColorDark => const Color(0xFF232323); + + @override + Color get shadow => const Color(0x0F2D3132); + + @override + Color get textDark => const Color(0xFF232323); + @override + Color get textDark2 => const Color(0xFF414141); + @override + Color get textDark3 => const Color(0xFF747778); + @override + Color get textSubtitle1 => const Color(0xFF8E9192); + @override + Color get textSubtitle2 => const Color(0xFFA9ACAC); + @override + Color get textSubtitle3 => const Color(0xFFC4C7C7); + @override + Color get textSubtitle4 => const Color(0xFFE0E3E3); + @override + Color get textSubtitle5 => const Color(0xFFEEEFF1); + @override + Color get textSubtitle6 => const Color(0xFFF5F5F5); + @override + Color get textWhite => const Color(0xFFFFFFFF); + @override + Color get textFavoriteCard => const Color(0xFF232323); + @override + Color get textError => const Color(0xFF930006); + + // button background + @override + Color get buttonBackPrimary => const Color(0xFF232323); + @override + Color get buttonBackSecondary => const Color(0xFFE0E3E3); + @override + Color get buttonBackPrimaryDisabled => const Color(0xFFD7D7D7); + @override + Color get buttonBackSecondaryDisabled => const Color(0xFFF0F1F1); + @override + Color get buttonBackBorder => const Color(0xFF232323); + @override + Color get buttonBackBorderDisabled => const Color(0xFFB6B6B6); + + @override + Color get numberBackDefault => const Color(0xFFFFFFFF); + @override + Color get numpadBackDefault => const Color(0xFF232323); + @override + Color get bottomNavBack => const Color(0xFFA2A2A2); + + // button text/element + @override + Color get buttonTextPrimary => const Color(0xFFFFFFFF); + @override + Color get buttonTextSecondary => const Color(0xFF232323); + @override + Color get buttonTextPrimaryDisabled => const Color(0xFFF8F8F8); + @override + Color get buttonTextSecondaryDisabled => const Color(0xFFB7B7B7); + @override + Color get buttonTextBorder => const Color(0xFF232323); + @override + Color get buttonTextDisabled => const Color(0xFFB6B6B6); + @override + Color get buttonTextBorderless => const Color(0xFF232323); + @override + Color get buttonTextBorderlessDisabled => const Color(0xFFB6B6B6); + @override + Color get numberTextDefault => const Color(0xFF232323); + @override + Color get numpadTextDefault => const Color(0xFFFFFFFF); + @override + Color get bottomNavText => const Color(0xFF232323); + + // switch + @override + Color get switchBGOn => const Color(0xFF0052DF); + @override + Color get switchBGOff => const Color(0xFFD8E4FB); + @override + Color get switchBGDisabled => const Color(0xFFC5C6C9); + @override + Color get switchCircleOn => const Color(0xFFDAE2FF); + @override + Color get switchCircleOff => const Color(0xFFFBFCFF); + @override + Color get switchCircleDisabled => const Color(0xFFFBFCFF); + + // step indicator background + @override + Color get stepIndicatorBGCheck => const Color(0xFFD9E2FF); + @override + Color get stepIndicatorBGNumber => const Color(0xFFD9E2FF); + @override + Color get stepIndicatorBGInactive => const Color(0xFFCDCDCD); + @override + Color get stepIndicatorBGLines => const Color(0xFF0056D2); + @override + Color get stepIndicatorBGLinesInactive => const Color(0xFFCDCDCD); + @override + Color get stepIndicatorIconText => const Color(0xFF0056D2); + @override + Color get stepIndicatorIconNumber => const Color(0xFF0056D2); + @override + Color get stepIndicatorIconInactive => const Color(0xFFD9E2FF); + + // checkbox + @override + Color get checkboxBGChecked => const Color(0xFF0056D2); + @override + Color get checkboxBorderEmpty => const Color(0xFF8E9192); + @override + Color get checkboxBGDisabled => const Color(0xFFADC7EC); + @override + Color get checkboxIconChecked => const Color(0xFFFFFFFF); + @override + Color get checkboxIconDisabled => const Color(0xFFFFFFFF); + @override + Color get checkboxTextLabel => const Color(0xFF232323); + + // snack bar + @override + Color get snackBarBackSuccess => const Color(0xFFB9E9D4); + @override + Color get snackBarBackError => const Color(0xFFFFDAD4); + @override + Color get snackBarBackInfo => const Color(0xFFDAE2FF); + @override + Color get snackBarTextSuccess => const Color(0xFF006C4D); + @override + Color get snackBarTextError => const Color(0xFF930006); + @override + Color get snackBarTextInfo => const Color(0xFF002A78); + + // icons + @override + Color get bottomNavIconBack => const Color(0xFFA2A2A2); + @override + Color get bottomNavIconIcon => const Color(0xFF232323); + + @override + Color get topNavIconPrimary => const Color(0xFF232323); + @override + Color get topNavIconGreen => const Color(0xFF00A578); + @override + Color get topNavIconYellow => const Color(0xFFF4C517); + @override + Color get topNavIconRed => const Color(0xFFC00205); + + @override + Color get settingsIconBack => const Color(0xFFE0E3E3); + @override + Color get settingsIconIcon => const Color(0xFF232323); + @override + Color get settingsIconBack2 => const Color(0xFF94D6C4); + @override + Color get settingsIconElement => const Color(0xFF00A578); + + // text field + @override + Color get textFieldActiveBG => const Color(0xFFEEEFF1); + @override + Color get textFieldDefaultBG => const Color(0xFFEEEFF1); + @override + Color get textFieldErrorBG => const Color(0xFFFFDAD4); + @override + Color get textFieldSuccessBG => const Color(0xFFB9E9D4); + + @override + Color get textFieldActiveSearchIconLeft => const Color(0xFFA9ACAC); + @override + Color get textFieldDefaultSearchIconLeft => const Color(0xFFA9ACAC); + @override + Color get textFieldErrorSearchIconLeft => const Color(0xFF930006); + @override + Color get textFieldSuccessSearchIconLeft => const Color(0xFF006C4D); + + @override + Color get textFieldActiveText => const Color(0xFF232323); + @override + Color get textFieldDefaultText => const Color(0xFFA9ACAC); + @override + Color get textFieldErrorText => const Color(0xFF000000); + @override + Color get textFieldSuccessText => const Color(0xFF000000); + + @override + Color get textFieldActiveLabel => const Color(0xFFA9ACAC); + @override + Color get textFieldErrorLabel => const Color(0xFF930006); + @override + Color get textFieldSuccessLabel => const Color(0xFF006C4D); + + @override + Color get textFieldActiveSearchIconRight => const Color(0xFF747778); + @override + Color get textFieldDefaultSearchIconRight => const Color(0xFF747778); + @override + Color get textFieldErrorSearchIconRight => const Color(0xFF930006); + @override + Color get textFieldSuccessSearchIconRight => const Color(0xFF006C4D); + + // settings item level2 + @override + Color get settingsItem2ActiveBG => const Color(0xFFFFFFFF); + @override + Color get settingsItem2ActiveText => const Color(0xFF232323); + @override + Color get settingsItem2ActiveSub => const Color(0xFF8E9192); + + // radio buttons + @override + Color get radioButtonIconBorder => const Color(0xFF0056D2); + @override + Color get radioButtonIconBorderDisabled => const Color(0xFF8F909A); + @override + Color get radioButtonBorderEnabled => const Color(0xFF0056D2); + @override + Color get radioButtonBorderDisabled => const Color(0xFFCDCDCD); + @override + Color get radioButtonIconCircle => const Color(0xFF0056D2); + @override + Color get radioButtonIconEnabled => const Color(0xFF0056D2); + @override + Color get radioButtonTextEnabled => const Color(0xFF44464E); + @override + Color get radioButtonTextDisabled => const Color(0xFF44464E); + @override + Color get radioButtonLabelEnabled => const Color(0xFF8E9192); + @override + Color get radioButtonLabelDisabled => const Color(0xFF8E9192); + + // info text + @override + Color get infoItemBG => const Color(0xFFFFFFFF); + @override + Color get infoItemLabel => const Color(0xFF8E9192); + @override + Color get infoItemText => const Color(0xFF232323); + @override + Color get infoItemIcons => const Color(0xFF0056D2); + + // popup + @override + Color get popupBG => const Color(0xFFFFFFFF); + + // currency list + @override + Color get currencyListItemBG => const Color(0xFFD9E2FF); + + // bottom nav + @override + Color get stackWalletBG => const Color(0xFFFFFFFF); + @override + Color get stackWalletMid => const Color(0xFFFFFFFF); + @override + Color get stackWalletBottom => const Color(0xFF232323); + @override + Color get bottomNavShadow => const Color(0xFF282E33); +} diff --git a/lib/utilities/theme/stack_theme.dart b/lib/utilities/theme/stack_theme.dart new file mode 100644 index 000000000..5aa9d96ad --- /dev/null +++ b/lib/utilities/theme/stack_theme.dart @@ -0,0 +1,120 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/models/exchange/change_now/exchange_transaction_status.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/theme/color_theme.dart'; +import 'package:stackwallet/utilities/theme/dark_colors.dart'; +import 'package:stackwallet/utilities/theme/light_colors.dart'; + +class StackTheme { + StackTheme._(); + static final StackTheme _instance = StackTheme._(); + static StackTheme get instance => _instance; + + late StackColorTheme color; + late ThemeType theme; + + void setTheme(ThemeType theme) { + this.theme = theme; + switch (theme) { + case ThemeType.light: + color = LightColors(); + break; + case ThemeType.dark: + color = DarkColors(); + break; + } + } + + BoxShadow get standardBoxShadow => BoxShadow( + color: color.shadow, + spreadRadius: 3, + blurRadius: 4, + ); + + Color colorForCoin(Coin coin) { + switch (coin) { + case Coin.bitcoin: + case Coin.bitcoinTestNet: + return _coin.bitcoin; + case Coin.bitcoincash: + case Coin.bitcoincashTestnet: + return _coin.bitcoincash; + case Coin.dogecoin: + case Coin.dogecoinTestNet: + return _coin.dogecoin; + case Coin.epicCash: + return _coin.epicCash; + case Coin.firo: + case Coin.firoTestNet: + return _coin.firo; + case Coin.monero: + return _coin.monero; + case Coin.namecoin: + return _coin.namecoin; + // case Coin.wownero: + // return wownero; + } + } + + Color colorForStatus(ChangeNowTransactionStatus status) { + switch (status) { + case ChangeNowTransactionStatus.New: + case ChangeNowTransactionStatus.Waiting: + case ChangeNowTransactionStatus.Confirming: + case ChangeNowTransactionStatus.Exchanging: + case ChangeNowTransactionStatus.Sending: + case ChangeNowTransactionStatus.Verifying: + return const Color(0xFFD3A90F); + case ChangeNowTransactionStatus.Finished: + return color.accentColorGreen; + case ChangeNowTransactionStatus.Failed: + return color.accentColorRed; + case ChangeNowTransactionStatus.Refunded: + return color.textSubtitle2; + } + } + + ButtonStyle? getPrimaryEnabledButtonColor(BuildContext context) => + Theme.of(context).textButtonTheme.style?.copyWith( + backgroundColor: MaterialStateProperty.all( + color.buttonBackPrimary, + ), + ); + + ButtonStyle? getPrimaryDisabledButtonColor(BuildContext context) => + Theme.of(context).textButtonTheme.style?.copyWith( + backgroundColor: MaterialStateProperty.all( + color.buttonBackPrimaryDisabled, + ), + ); + + ButtonStyle? getSecondaryEnabledButtonColor(BuildContext context) => + Theme.of(context).textButtonTheme.style?.copyWith( + backgroundColor: MaterialStateProperty.all( + color.buttonBackSecondary, + ), + ); + + ButtonStyle? getSmallSecondaryEnabledButtonColor(BuildContext context) => + Theme.of(context).textButtonTheme.style?.copyWith( + backgroundColor: MaterialStateProperty.all( + color.textFieldDefaultBG, + ), + ); + + ButtonStyle? getDesktopMenuButtonColor(BuildContext context) => + Theme.of(context).textButtonTheme.style?.copyWith( + backgroundColor: MaterialStateProperty.all( + color.popupBG, + ), + ); + + ButtonStyle? getDesktopMenuButtonColorSelected(BuildContext context) => + Theme.of(context).textButtonTheme.style?.copyWith( + backgroundColor: MaterialStateProperty.all( + color.textFieldDefaultBG, + ), + ); + + static const _coin = CoinThemeColor(); +} diff --git a/lib/utilities/util.dart b/lib/utilities/util.dart new file mode 100644 index 000000000..8a98787f2 --- /dev/null +++ b/lib/utilities/util.dart @@ -0,0 +1,29 @@ +import 'dart:io'; + +import 'package:flutter/material.dart'; + +abstract class Util { + static bool get isDesktop { + return Platform.isLinux || Platform.isMacOS || Platform.isWindows; + } + + static MaterialColor createMaterialColor(Color color) { + List strengths = [.05]; + final swatch = {}; + final int r = color.red, g = color.green, b = color.blue; + + for (int i = 1; i < 10; i++) { + strengths.add(0.1 * i); + } + for (var strength in strengths) { + final double ds = 0.5 - strength; + swatch[(strength * 1000).round()] = Color.fromRGBO( + r + ((ds < 0 ? r : (255 - r)) * ds).round(), + g + ((ds < 0 ? g : (255 - g)) * ds).round(), + b + ((ds < 0 ? b : (255 - b)) * ds).round(), + 1, + ); + } + return MaterialColor(color.value, swatch); + } +} diff --git a/lib/widgets/address_book_card.dart b/lib/widgets/address_book_card.dart index 49fa65c67..c310d786a 100644 --- a/lib/widgets/address_book_card.dart +++ b/lib/widgets/address_book_card.dart @@ -4,10 +4,10 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/address_book_views/subviews/contact_popup.dart'; import 'package:stackwallet/providers/global/address_book_service_provider.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; class AddressBookCard extends ConsumerStatefulWidget { @@ -54,7 +54,7 @@ class _AddressBookCardState extends ConsumerState { return RoundedWhiteContainer( padding: const EdgeInsets.all(4), child: RawMaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, padding: const EdgeInsets.all(0), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -80,7 +80,7 @@ class _AddressBookCardState extends ConsumerState { width: 32, height: 32, decoration: BoxDecoration( - color: CFColors.contactIconBackground, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular(32), ), child: contact.id == "default" diff --git a/lib/widgets/custom_buttons/app_bar_icon_button.dart b/lib/widgets/custom_buttons/app_bar_icon_button.dart index ef523d8e2..979fb6971 100644 --- a/lib/widgets/custom_buttons/app_bar_icon_button.dart +++ b/lib/widgets/custom_buttons/app_bar_icon_button.dart @@ -1,7 +1,9 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; class AppBarIconButton extends StatelessWidget { const AppBarIconButton({ @@ -28,11 +30,11 @@ class AppBarIconButton extends StatelessWidget { width: size, decoration: BoxDecoration( borderRadius: BorderRadius.circular(1000), - color: color ?? CFColors.white, + color: color ?? StackTheme.instance.color.background, boxShadow: shadows, ), child: MaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, padding: EdgeInsets.zero, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -46,23 +48,33 @@ class AppBarIconButton extends StatelessWidget { } class AppBarBackButton extends StatelessWidget { - const AppBarBackButton({Key? key, required this.onPressed}) : super(key: key); + const AppBarBackButton({Key? key, this.onPressed}) : super(key: key); - final VoidCallback onPressed; + final VoidCallback? onPressed; @override Widget build(BuildContext context) { + final isDesktop = Util.isDesktop; return Padding( - padding: const EdgeInsets.all(10), + padding: isDesktop + ? const EdgeInsets.symmetric( + vertical: 20, + horizontal: 24, + ) + : const EdgeInsets.all(10), child: AppBarIconButton( - color: CFColors.almostWhite, + size: isDesktop ? 56 : 32, + color: isDesktop + ? StackTheme.instance.color.textFieldDefaultBG + : StackTheme.instance.color.background, shadows: const [], icon: SvgPicture.asset( Assets.svg.arrowLeft, width: 24, height: 24, + color: StackTheme.instance.color.topNavIconPrimary, ), - onPressed: onPressed, + onPressed: onPressed ?? Navigator.of(context).pop, ), ); } diff --git a/lib/widgets/custom_buttons/blue_text_button.dart b/lib/widgets/custom_buttons/blue_text_button.dart index 4de4bb674..90e41c812 100644 --- a/lib/widgets/custom_buttons/blue_text_button.dart +++ b/lib/widgets/custom_buttons/blue_text_button.dart @@ -1,7 +1,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/gestures.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class BlueTextButton extends StatefulWidget { const BlueTextButton({Key? key, required this.text, this.onTap}) @@ -22,14 +22,14 @@ class _BlueTextButtonState extends State @override void initState() { - color = CFColors.link2; + color = StackTheme.instance.color.buttonTextBorderless; controller = AnimationController( vsync: this, duration: const Duration(milliseconds: 100), ); animation = ColorTween( - begin: CFColors.link2, - end: CFColors.link2.withOpacity(0.4), + begin: StackTheme.instance.color.buttonTextBorderless, + end: StackTheme.instance.color.buttonTextBorderless.withOpacity(0.4), ).animate(controller); animation.addListener(() { diff --git a/lib/widgets/custom_buttons/draggable_switch_button.dart b/lib/widgets/custom_buttons/draggable_switch_button.dart index eeaa871ac..06fe08e5b 100644 --- a/lib/widgets/custom_buttons/draggable_switch_button.dart +++ b/lib/widgets/custom_buttons/draggable_switch_button.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class DraggableSwitchButton extends StatefulWidget { const DraggableSwitchButton({ @@ -37,21 +37,21 @@ class DraggableSwitchButtonState extends State { Color _colorBG(bool isOn, bool enabled, double alpha) { if (enabled) { return Color.alphaBlend( - CFColors.primary.withOpacity(alpha), - CFColors.primaryLight, + StackTheme.instance.color.switchBGOn.withOpacity(alpha), + StackTheme.instance.color.switchBGOff, ); } - return CFColors.neutral80; + return StackTheme.instance.color.switchBGDisabled; } Color _colorFG(bool isOn, bool enabled, double alpha) { if (enabled) { return Color.alphaBlend( - CFColors.primaryLight.withOpacity(alpha), - CFColors.white, + StackTheme.instance.color.switchCircleOn.withOpacity(alpha), + StackTheme.instance.color.switchCircleOff, ); } - return CFColors.white; + return StackTheme.instance.color.switchCircleDisabled; } @override diff --git a/lib/widgets/custom_buttons/favorite_toggle.dart b/lib/widgets/custom_buttons/favorite_toggle.dart index 4b7586ccc..cd2727f18 100644 --- a/lib/widgets/custom_buttons/favorite_toggle.dart +++ b/lib/widgets/custom_buttons/favorite_toggle.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class FavoriteToggle extends StatefulWidget { const FavoriteToggle({ @@ -9,14 +9,14 @@ class FavoriteToggle extends StatefulWidget { this.backGround, this.borderRadius = BorderRadius.zero, this.initialState = false, - this.on = CFColors.link2, - this.off = CFColors.buttonGray, + this.on, + this.off, required this.onChanged, }) : super(key: key); final Color? backGround; - final Color on; - final Color off; + final Color? on; + final Color? off; final BorderRadiusGeometry borderRadius; final bool initialState; final void Function(bool)? onChanged; @@ -30,10 +30,15 @@ class _FavoriteToggleState extends State { late Color _color; late void Function(bool)? _onChanged; + late final Color on; + late final Color off; + @override void initState() { + on = widget.on ?? StackTheme.instance.color.infoItemIcons; + off = widget.off ?? StackTheme.instance.color.buttonBackSecondary; _isActive = widget.initialState; - _color = _isActive ? widget.on : widget.off; + _color = _isActive ? on : off; _onChanged = widget.onChanged; super.initState(); } @@ -46,7 +51,7 @@ class _FavoriteToggleState extends State { borderRadius: widget.borderRadius, ), child: MaterialButton( - splashColor: CFColors.splashLight, + splashColor: StackTheme.instance.color.highlight, minWidth: 0, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: RoundedRectangleBorder( @@ -56,7 +61,7 @@ class _FavoriteToggleState extends State { ? () { _isActive = !_isActive; setState(() { - _color = _isActive ? widget.on : widget.off; + _color = _isActive ? on : off; }); _onChanged!.call(_isActive); } diff --git a/lib/widgets/custom_loading_overlay.dart b/lib/widgets/custom_loading_overlay.dart index 3c392b674..a11832207 100644 --- a/lib/widgets/custom_loading_overlay.dart +++ b/lib/widgets/custom_loading_overlay.dart @@ -3,8 +3,8 @@ import 'dart:async'; import 'package:event_bus/event_bus.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; class CustomLoadingOverlay extends ConsumerStatefulWidget { @@ -57,7 +57,7 @@ class _CustomLoadingOverlayState extends ConsumerState { Text( widget.message, style: STextStyles.pageTitleH2.copyWith( - color: CFColors.white, + color: StackTheme.instance.color.accentColorOrange, ), ), if (widget.eventBus != null) @@ -68,7 +68,7 @@ class _CustomLoadingOverlayState extends ConsumerState { Text( "${(_percent * 100).toStringAsFixed(2)}%", style: STextStyles.pageTitleH2.copyWith( - color: CFColors.white, + color: StackTheme.instance.color.accentColorOrange, ), ), ], diff --git a/lib/widgets/custom_pin_put/pin_keyboard.dart b/lib/widgets/custom_pin_put/pin_keyboard.dart index 1942f3af4..45f127669 100644 --- a/lib/widgets/custom_pin_put/pin_keyboard.dart +++ b/lib/widgets/custom_pin_put/pin_keyboard.dart @@ -2,7 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class NumberKey extends StatefulWidget { const NumberKey({ @@ -22,7 +22,7 @@ class _NumberKeyState extends State { late final String number; late final ValueSetter onPressed; - Color _color = CFColors.white; + Color _color = StackTheme.instance.color.numberBackDefault; @override void initState() { @@ -45,19 +45,20 @@ class _NumberKeyState extends State { shadows: const [], ), child: MaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: const StadiumBorder(), onPressed: () async { onPressed.call(number); setState(() { - _color = CFColors.splashLight; + _color = + StackTheme.instance.color.numberBackDefault.withOpacity(0.8); }); Future.delayed(const Duration(milliseconds: 200), () { if (mounted) { setState(() { - _color = CFColors.white; + _color = StackTheme.instance.color.numberBackDefault; }); } }); @@ -66,7 +67,7 @@ class _NumberKeyState extends State { child: Text( number, style: GoogleFonts.roboto( - color: CFColors.stackAccent, + color: StackTheme.instance.color.numberTextDefault, fontWeight: FontWeight.w400, fontSize: 26, ), @@ -92,7 +93,7 @@ class BackspaceKey extends StatefulWidget { class _BackspaceKeyState extends State { late final VoidCallback onPressed; - Color _color = CFColors.stackAccent; + Color _color = StackTheme.instance.color.numpadBackDefault; @override void initState() { @@ -113,19 +114,20 @@ class _BackspaceKeyState extends State { shadows: const [], ), child: MaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, shape: const StadiumBorder(), onPressed: () { onPressed.call(); setState(() { - _color = CFColors.stackAccent.withOpacity(0.8); + _color = + StackTheme.instance.color.numpadBackDefault.withOpacity(0.8); }); Future.delayed(const Duration(milliseconds: 200), () { if (mounted) { setState(() { - _color = CFColors.stackAccent; + _color = StackTheme.instance.color.numpadBackDefault; }); } }); @@ -135,6 +137,7 @@ class _BackspaceKeyState extends State { Assets.svg.delete, width: 20, height: 20, + color: StackTheme.instance.color.numpadTextDefault, ), ), ), @@ -142,44 +145,43 @@ class _BackspaceKeyState extends State { } } -// class SubmitKey extends StatelessWidget { -// const SubmitKey({ -// Key? key, -// required this.onPressed, -// }) : super(key: key); -// -// final VoidCallback onPressed; -// -// @override -// Widget build(BuildContext context) { -// return Container( -// height: 72, -// width: 72, -// decoration: ShapeDecoration( -// shape: StadiumBorder(), -// color: CFColors.stackAccent, -// shadows: [], -// ), -// child: MaterialButton( -// // splashColor: CFColors.splashLight, -// materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, -// shape: StadiumBorder(), -// onPressed: () { -// onPressed.call(); -// }, -// child: Container( -// child: Center( -// child: SvgPicture.asset( -// Assets.svg.arrowRight, -// width: 20, -// height: 20, -// ), -// ), -// ), -// ), -// ); -// } -// } +class SubmitKey extends StatelessWidget { + const SubmitKey({ + Key? key, + required this.onPressed, + }) : super(key: key); + + final VoidCallback onPressed; + + @override + Widget build(BuildContext context) { + return Container( + height: 72, + width: 72, + decoration: ShapeDecoration( + shape: const StadiumBorder(), + color: StackTheme.instance.color.numpadBackDefault, + shadows: const [], + ), + child: MaterialButton( + // splashColor: StackTheme.instance.color.highlight, + materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, + shape: const StadiumBorder(), + onPressed: () { + onPressed.call(); + }, + child: Center( + child: SvgPicture.asset( + Assets.svg.arrowRight, + width: 20, + height: 20, + color: StackTheme.instance.color.numpadTextDefault, + ), + ), + ), + ); + } +} class PinKeyboard extends StatelessWidget { const PinKeyboard({ @@ -203,9 +205,9 @@ class PinKeyboard extends StatelessWidget { onBackPressed.call(); } - // void _submitHandler() { - // onSubmitPressed.call(); - // } + void _submitHandler() { + onSubmitPressed.call(); + } void _numberHandler(String number) { onNumberKeyPressed.call(number); @@ -296,9 +298,8 @@ class PinKeyboard extends StatelessWidget { ), Row( children: [ - const SizedBox( - height: 72, - width: 72, + BackspaceKey( + onPressed: _backHandler, ), const SizedBox( width: 24, @@ -310,11 +311,8 @@ class PinKeyboard extends StatelessWidget { const SizedBox( width: 24, ), - // SubmitKey( - // onPressed: _submitHandler, - // ) - BackspaceKey( - onPressed: _backHandler, + SubmitKey( + onPressed: _submitHandler, ), ], ) diff --git a/lib/widgets/desktop/desktop_app_bar.dart b/lib/widgets/desktop/desktop_app_bar.dart new file mode 100644 index 000000000..1c825382c --- /dev/null +++ b/lib/widgets/desktop/desktop_app_bar.dart @@ -0,0 +1,66 @@ +import 'package:flutter/material.dart'; + +const double kDesktopAppBarHeight = 96.0; +const double kDesktopAppBarHeightCompact = 82.0; + +class DesktopAppBar extends StatefulWidget { + const DesktopAppBar({ + Key? key, + this.leading, + this.center, + this.trailing, + this.background = Colors.transparent, + required this.isCompactHeight, + }) : super(key: key); + + final Widget? leading; + final Widget? center; + final Widget? trailing; + final Color background; + final bool isCompactHeight; + + @override + State createState() => _DesktopAppBarState(); +} + +class _DesktopAppBarState extends State { + late final List items; + + @override + void initState() { + items = []; + if (widget.leading != null) { + items.add(widget.leading!); + } + + items.add(const Spacer()); + + if (widget.center != null) { + items.add(widget.center!); + items.add(const Spacer()); + } + + if (widget.trailing != null) { + items.add(widget.trailing!); + } + + super.initState(); + } + + @override + Widget build(BuildContext context) { + return Container( + decoration: BoxDecoration( + color: widget.background, + ), + height: widget.isCompactHeight + ? kDesktopAppBarHeightCompact + : kDesktopAppBarHeight, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.center, + children: items, + ), + ); + } +} diff --git a/lib/widgets/desktop/desktop_scaffold.dart b/lib/widgets/desktop/desktop_scaffold.dart new file mode 100644 index 000000000..697ce8030 --- /dev/null +++ b/lib/widgets/desktop/desktop_scaffold.dart @@ -0,0 +1,64 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class DesktopScaffold extends StatelessWidget { + const DesktopScaffold({ + Key? key, + this.background, + this.appBar, + this.body, + }) : super(key: key); + + final Color? background; + final Widget? appBar; + final Widget? body; + + @override + Widget build(BuildContext context) { + return Material( + color: background ?? StackTheme.instance.color.background, + child: Column( + // crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + if (appBar != null) appBar!, + if (body != null) + Expanded( + child: body!, + ), + ], + ), + ); + } +} + +class MasterScaffold extends StatelessWidget { + const MasterScaffold({ + Key? key, + required this.isDesktop, + required this.appBar, + required this.body, + this.background, + }) : super(key: key); + + final bool isDesktop; + final Widget appBar; + final Widget body; + final Color? background; + + @override + Widget build(BuildContext context) { + if (isDesktop) { + return DesktopScaffold( + background: background ?? StackTheme.instance.color.background, + appBar: appBar, + body: body, + ); + } else { + return Scaffold( + backgroundColor: background ?? StackTheme.instance.color.background, + appBar: appBar as PreferredSizeWidget?, + body: body, + ); + } + } +} diff --git a/lib/widgets/emoji_select_sheet.dart b/lib/widgets/emoji_select_sheet.dart index 01fd8a6a1..879ca0de7 100644 --- a/lib/widgets/emoji_select_sheet.dart +++ b/lib/widgets/emoji_select_sheet.dart @@ -1,9 +1,9 @@ import 'package:emojis/emoji.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class EmojiSelectSheet extends ConsumerWidget { const EmojiSelectSheet({ @@ -25,9 +25,9 @@ class EmojiSelectSheet extends ConsumerWidget { final itemCount = Emoji.all().length; return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -47,7 +47,7 @@ class EmojiSelectSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), diff --git a/lib/widgets/expandable.dart b/lib/widgets/expandable.dart new file mode 100644 index 000000000..ddae2201d --- /dev/null +++ b/lib/widgets/expandable.dart @@ -0,0 +1,91 @@ +import 'package:flutter/material.dart'; + +enum ExpandableState { + expanded, + collapsed, +} + +class Expandable extends StatefulWidget { + const Expandable({ + Key? key, + required this.header, + required this.body, + this.animationController, + this.animation, + this.animationDurationMultiplier = 1.0, + this.onExpandChanged, + }) : super(key: key); + + final Widget header; + final Widget body; + final AnimationController? animationController; + final Animation? animation; + final double animationDurationMultiplier; + final void Function(ExpandableState)? onExpandChanged; + + @override + State createState() => _ExpandableState(); +} + +class _ExpandableState extends State with TickerProviderStateMixin { + late final AnimationController animationController; + late final Animation animation; + late final Duration duration; + + Future toggle() async { + if (animation.isDismissed) { + await animationController.forward(); + widget.onExpandChanged?.call(ExpandableState.collapsed); + } else if (animation.isCompleted) { + await animationController.reverse(); + widget.onExpandChanged?.call(ExpandableState.expanded); + } + } + + @override + void initState() { + duration = Duration( + milliseconds: (500 * widget.animationDurationMultiplier).toInt(), + ); + animationController = widget.animationController ?? + AnimationController( + vsync: this, + duration: duration, + ); + animation = widget.animation ?? + Tween(begin: 0.0, end: 1.0).animate( + CurvedAnimation( + curve: Curves.easeInOut, + parent: animationController, + ), + ); + super.initState(); + } + + @override + void dispose() { + animationController.dispose(); + super.dispose(); + } + + @override + Widget build(BuildContext context) { + return Column( + mainAxisSize: MainAxisSize.min, + children: [ + GestureDetector( + onTap: toggle, + child: Container( + color: Colors.transparent, + child: widget.header, + ), + ), + SizeTransition( + sizeFactor: animation, + axisAlignment: 1.0, + child: widget.body, + ), + ], + ); + } +} diff --git a/lib/widgets/gradient_card.dart b/lib/widgets/gradient_card.dart index 154a50993..c0b276c13 100644 --- a/lib/widgets/gradient_card.dart +++ b/lib/widgets/gradient_card.dart @@ -1,7 +1,5 @@ // import 'package:flutter/material.dart'; // import 'package:stackwallet/utilities/cfcolors.dart'; -// -// class GradientCard extends StatelessWidget { // const GradientCard( // {Key key, // this.child, diff --git a/lib/widgets/icon_widgets/addressbook_icon.dart b/lib/widgets/icon_widgets/addressbook_icon.dart index a0e0db616..f2d3f927b 100644 --- a/lib/widgets/icon_widgets/addressbook_icon.dart +++ b/lib/widgets/icon_widgets/addressbook_icon.dart @@ -1,14 +1,15 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; + +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class AddressBookIcon extends StatelessWidget { const AddressBookIcon({ Key? key, this.width = 16, this.height = 16, - this.color = CFColors.neutral50, + this.color, }) : super(key: key); final double width; @@ -21,7 +22,7 @@ class AddressBookIcon extends StatelessWidget { Assets.svg.addressBook, width: width, height: height, - color: color, + color: color ?? StackTheme.instance.color.textDark3, ); } } diff --git a/lib/widgets/icon_widgets/clipboard_icon.dart b/lib/widgets/icon_widgets/clipboard_icon.dart index c90e77f9b..7dd720190 100644 --- a/lib/widgets/icon_widgets/clipboard_icon.dart +++ b/lib/widgets/icon_widgets/clipboard_icon.dart @@ -1,14 +1,14 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class ClipboardIcon extends StatelessWidget { const ClipboardIcon({ Key? key, this.width = 18, this.height = 18, - this.color = CFColors.neutral50, + this.color, }) : super(key: key); final double width; @@ -21,7 +21,7 @@ class ClipboardIcon extends StatelessWidget { Assets.svg.clipboard, width: width, height: height, - color: color, + color: color ?? StackTheme.instance.color.textDark3, ); } } diff --git a/lib/widgets/icon_widgets/dice_icon.dart b/lib/widgets/icon_widgets/dice_icon.dart index e78ede912..9343108d3 100644 --- a/lib/widgets/icon_widgets/dice_icon.dart +++ b/lib/widgets/icon_widgets/dice_icon.dart @@ -1,14 +1,14 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class DiceIcon extends StatelessWidget { const DiceIcon({ Key? key, this.width = 17, this.height = 17, - this.color = CFColors.neutral50, + this.color, }) : super(key: key); final double width; @@ -21,7 +21,7 @@ class DiceIcon extends StatelessWidget { Assets.svg.dice, width: width, height: height, - color: color, + color: color ?? StackTheme.instance.color.textDark3, ); } } diff --git a/lib/widgets/icon_widgets/qrcode_icon.dart b/lib/widgets/icon_widgets/qrcode_icon.dart index 530afc751..3dc44f8d7 100644 --- a/lib/widgets/icon_widgets/qrcode_icon.dart +++ b/lib/widgets/icon_widgets/qrcode_icon.dart @@ -1,14 +1,14 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class QrCodeIcon extends StatelessWidget { const QrCodeIcon({ Key? key, this.width = 17, this.height = 17, - this.color = CFColors.neutral50, + this.color, }) : super(key: key); final double width; @@ -21,7 +21,7 @@ class QrCodeIcon extends StatelessWidget { Assets.svg.qrcode, width: width, height: height, - color: color, + color: color ?? StackTheme.instance.color.textDark3, ); } } diff --git a/lib/widgets/icon_widgets/x_icon.dart b/lib/widgets/icon_widgets/x_icon.dart index 7e1962e58..d4a5baac8 100644 --- a/lib/widgets/icon_widgets/x_icon.dart +++ b/lib/widgets/icon_widgets/x_icon.dart @@ -1,14 +1,14 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class XIcon extends StatelessWidget { const XIcon({ Key? key, this.width = 18, this.height = 18, - this.color = CFColors.neutral50, + this.color, }) : super(key: key); final double width; @@ -21,7 +21,7 @@ class XIcon extends StatelessWidget { Assets.svg.x, width: width, height: height, - color: color, + color: color ?? StackTheme.instance.color.textFieldActiveSearchIconRight, ); } } diff --git a/lib/widgets/managed_favorite.dart b/lib/widgets/managed_favorite.dart index e365420fe..1a87dcc31 100644 --- a/lib/widgets/managed_favorite.dart +++ b/lib/widgets/managed_favorite.dart @@ -3,11 +3,11 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/custom_buttons/favorite_toggle.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -40,13 +40,13 @@ class _ManagedFavoriteCardState extends ConsumerState { if (!manager.isFavorite) { ref.read(favoritesProvider).add(provider, true); ref.read(nonFavoritesProvider).remove(provider, true); - ref + await ref .read(walletsServiceChangeNotifierProvider) .addFavorite(manager.walletId); } else { ref.read(favoritesProvider).remove(provider, true); ref.read(nonFavoritesProvider).add(provider, true); - ref + await ref .read(walletsServiceChangeNotifierProvider) .removeFavorite(manager.walletId); } @@ -64,7 +64,9 @@ class _ManagedFavoriteCardState extends ConsumerState { children: [ Container( decoration: BoxDecoration( - color: CFColors.coin.forCoin(manager.coin).withOpacity(0.5), + color: StackTheme.instance + .colorForCoin(manager.coin) + .withOpacity(0.5), borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -81,29 +83,30 @@ class _ManagedFavoriteCardState extends ConsumerState { const SizedBox( width: 12, ), - Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - manager.walletName, - style: STextStyles.titleBold12, - ), - const SizedBox( - height: 2, - ), - Text( - "${Format.localizedStringAsFixed( - value: manager.cachedTotalBalance, - locale: ref.watch(localeServiceChangeNotifierProvider - .select((value) => value.locale)), - decimalPlaces: 8, - )} ${manager.coin.ticker}", - style: STextStyles.itemSubtitle, - ), - ], + Expanded( + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + manager.walletName, + style: STextStyles.titleBold12, + ), + const SizedBox( + height: 2, + ), + Text( + "${Format.localizedStringAsFixed( + value: manager.cachedTotalBalance, + locale: ref.watch(localeServiceChangeNotifierProvider + .select((value) => value.locale)), + decimalPlaces: 8, + )} ${manager.coin.ticker}", + style: STextStyles.itemSubtitle, + ), + ], + ), ), - const Spacer(), FavoriteToggle( borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, diff --git a/lib/widgets/node_card.dart b/lib/widgets/node_card.dart index 6f3eac6c1..4ff569ddd 100644 --- a/lib/widgets/node_card.dart +++ b/lib/widgets/node_card.dart @@ -3,11 +3,11 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/default_nodes.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/node_options_sheet.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; @@ -78,8 +78,9 @@ class _NodeCardState extends ConsumerState { height: 24, decoration: BoxDecoration( color: _node.name == DefaultNodes.defaultName - ? CFColors.buttonGray - : CFColors.link2.withOpacity(0.2), + ? StackTheme.instance.color.buttonBackSecondary + : StackTheme.instance.color.infoItemIcons + .withOpacity(0.2), borderRadius: BorderRadius.circular(100), ), child: Center( @@ -88,8 +89,8 @@ class _NodeCardState extends ConsumerState { height: 11, width: 14, color: _node.name == DefaultNodes.defaultName - ? CFColors.stackAccent - : CFColors.link2, + ? StackTheme.instance.color.accentColorDark + : StackTheme.instance.color.infoItemIcons, ), ), ), @@ -116,8 +117,8 @@ class _NodeCardState extends ConsumerState { SvgPicture.asset( Assets.svg.network, color: _status == "Connected" - ? CFColors.stackGreen - : CFColors.buttonGray, + ? StackTheme.instance.color.accentColorGreen + : StackTheme.instance.color.buttonBackSecondary, width: 20, height: 20, ), diff --git a/lib/widgets/node_options_sheet.dart b/lib/widgets/node_options_sheet.dart index f84f943d6..303ce02b6 100644 --- a/lib/widgets/node_options_sheet.dart +++ b/lib/widgets/node_options_sheet.dart @@ -1,3 +1,5 @@ +import 'dart:async'; + import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; @@ -7,7 +9,6 @@ import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/manage_nodes_views/node_details_view.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/default_nodes.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; @@ -17,6 +18,7 @@ import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/test_epic_box_connection.dart'; import 'package:stackwallet/utilities/test_monero_node_connection.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:tuple/tuple.dart'; @@ -104,6 +106,9 @@ class NodeOptionsSheet extends ConsumerWidget { case Coin.bitcoinTestNet: case Coin.firoTestNet: case Coin.dogecoinTestNet: + case Coin.bitcoincash: + case Coin.namecoin: + case Coin.bitcoincashTestnet: final client = ElectrumX( host: node.host, port: node.port, @@ -128,12 +133,12 @@ class NodeOptionsSheet extends ConsumerWidget { // context: context, // ); } else { - showFloatingFlushBar( + unawaited(showFloatingFlushBar( type: FlushBarType.warning, iconAsset: Assets.svg.circleAlert, message: "Could not connect to node", context: context, - ); + )); } return testPassed; @@ -154,9 +159,9 @@ class NodeOptionsSheet extends ConsumerWidget { : "Connected"; return Container( - decoration: const BoxDecoration( - color: CFColors.white, - borderRadius: BorderRadius.vertical( + decoration: BoxDecoration( + color: StackTheme.instance.color.popupBG, + borderRadius: const BorderRadius.vertical( top: Radius.circular(20), ), ), @@ -177,7 +182,7 @@ class NodeOptionsSheet extends ConsumerWidget { Center( child: Container( decoration: BoxDecoration( - color: CFColors.fieldGray, + color: StackTheme.instance.color.textFieldDefaultBG, borderRadius: BorderRadius.circular( Constants.size.circularBorderRadius, ), @@ -203,8 +208,9 @@ class NodeOptionsSheet extends ConsumerWidget { height: 32, decoration: BoxDecoration( color: node.name == DefaultNodes.defaultName - ? CFColors.buttonGray - : CFColors.link2.withOpacity(0.2), + ? StackTheme.instance.color.textSubtitle4 + : StackTheme.instance.color.infoItemIcons + .withOpacity(0.2), borderRadius: BorderRadius.circular(100), ), child: Center( @@ -213,8 +219,8 @@ class NodeOptionsSheet extends ConsumerWidget { height: 15, width: 19, color: node.name == DefaultNodes.defaultName - ? CFColors.stackAccent - : CFColors.link2, + ? StackTheme.instance.color.accentColorDark + : StackTheme.instance.color.infoItemIcons, ), ), ), @@ -241,8 +247,8 @@ class NodeOptionsSheet extends ConsumerWidget { SvgPicture.asset( Assets.svg.network, color: status == "Connected" - ? CFColors.stackGreen - : CFColors.buttonGray, + ? StackTheme.instance.color.accentColorGreen + : StackTheme.instance.color.buttonBackSecondary, width: 18, ), ], @@ -253,11 +259,8 @@ class NodeOptionsSheet extends ConsumerWidget { // if (!node.id.startsWith("default")) Expanded( child: TextButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - CFColors.buttonGray, - ), - ), + style: StackTheme.instance + .getSecondaryEnabledButtonColor(context), onPressed: () { Navigator.pop(context); Navigator.of(context).pushNamed( @@ -272,8 +275,7 @@ class NodeOptionsSheet extends ConsumerWidget { child: Text( "Details", style: STextStyles.button.copyWith( - color: CFColors.stackAccent, - ), + color: StackTheme.instance.color.accentColorDark), ), ), ), @@ -283,13 +285,11 @@ class NodeOptionsSheet extends ConsumerWidget { ), Expanded( child: TextButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - status == "Connected" - ? CFColors.disabledButton - : CFColors.stackAccent, - ), - ), + style: status == "Connected" + ? StackTheme.instance + .getPrimaryEnabledButtonColor(context) + : StackTheme.instance + .getPrimaryDisabledButtonColor(context), onPressed: status == "Connected" ? null : () async { @@ -299,7 +299,7 @@ class NodeOptionsSheet extends ConsumerWidget { return; } - ref + await ref .read(nodeServiceChangeNotifierProvider) .setPrimaryNodeFor( coin: coin, @@ -307,7 +307,7 @@ class NodeOptionsSheet extends ConsumerWidget { shouldNotifyListeners: true, ); - _notifyWalletsOfUpdatedNode(ref); + await _notifyWalletsOfUpdatedNode(ref); }, child: Text( // status == "Connected" ? "Disconnect" : "Connect", diff --git a/lib/widgets/rounded_container.dart b/lib/widgets/rounded_container.dart index 91d23aa4e..7ae35afdd 100644 --- a/lib/widgets/rounded_container.dart +++ b/lib/widgets/rounded_container.dart @@ -1,5 +1,4 @@ import 'package:flutter/cupertino.dart'; - import 'package:stackwallet/utilities/constants.dart'; class RoundedContainer extends StatelessWidget { @@ -8,19 +7,27 @@ class RoundedContainer extends StatelessWidget { this.child, required this.color, this.padding = const EdgeInsets.all(12), + this.radiusMultiplier = 1.0, + this.width, + this.height, }) : super(key: key); final Widget? child; final Color color; final EdgeInsets padding; + final double radiusMultiplier; + final double? width; + final double? height; @override Widget build(BuildContext context) { return Container( + width: width, + height: height, decoration: BoxDecoration( color: color, borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius, + Constants.size.circularBorderRadius * radiusMultiplier, ), ), child: Padding( diff --git a/lib/widgets/rounded_white_container.dart b/lib/widgets/rounded_white_container.dart index 836789c4d..c612ce68d 100644 --- a/lib/widgets/rounded_white_container.dart +++ b/lib/widgets/rounded_white_container.dart @@ -1,5 +1,5 @@ import 'package:flutter/cupertino.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/widgets/rounded_container.dart'; class RoundedWhiteContainer extends StatelessWidget { @@ -7,16 +7,25 @@ class RoundedWhiteContainer extends StatelessWidget { Key? key, this.child, this.padding = const EdgeInsets.all(12), + this.radiusMultiplier = 1.0, + this.width, + this.height, }) : super(key: key); final Widget? child; final EdgeInsets padding; + final double radiusMultiplier; + final double? width; + final double? height; @override Widget build(BuildContext context) { return RoundedContainer( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, padding: padding, + radiusMultiplier: radiusMultiplier, + width: width, + height: height, child: child, ); } diff --git a/lib/widgets/stack_dialog.dart b/lib/widgets/stack_dialog.dart index 6bb96bbd1..8dc108c8e 100644 --- a/lib/widgets/stack_dialog.dart +++ b/lib/widgets/stack_dialog.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; class StackDialogBase extends StatelessWidget { const StackDialogBase({ @@ -25,7 +25,7 @@ class StackDialogBase extends StatelessWidget { ), child: Container( decoration: BoxDecoration( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, borderRadius: BorderRadius.circular( 20, ), @@ -183,10 +183,11 @@ class StackOkDialog extends StatelessWidget { Navigator.of(context).pop(); onOkPressed?.call("OK"); }, + style: + StackTheme.instance.getPrimaryEnabledButtonColor(context), child: Text( "Ok", - style: STextStyles.button - .copyWith(color: CFColors.stackAccent), + style: STextStyles.button, ), ), ), diff --git a/lib/widgets/stack_text_field.dart b/lib/widgets/stack_text_field.dart index 140312999..07c78ea75 100644 --- a/lib/widgets/stack_text_field.dart +++ b/lib/widgets/stack_text_field.dart @@ -1,16 +1,21 @@ import 'package:flutter/material.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; InputDecoration standardInputDecoration( String? labelText, FocusNode textFieldFocusNode) { + final isDesktop = Util.isDesktop; + return InputDecoration( labelText: labelText, fillColor: textFieldFocusNode.hasFocus - ? CFColors.textFieldActive - : CFColors.textFieldInactive, - labelStyle: STextStyles.fieldLabel, - hintStyle: STextStyles.fieldLabel, + ? StackTheme.instance.color.textFieldActiveBG + : StackTheme.instance.color.textFieldDefaultBG, + labelStyle: + isDesktop ? STextStyles.desktopTextFieldLabel : STextStyles.fieldLabel, + hintStyle: + isDesktop ? STextStyles.desktopTextFieldLabel : STextStyles.fieldLabel, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none, errorBorder: InputBorder.none, diff --git a/lib/widgets/table_view/table_view.dart b/lib/widgets/table_view/table_view.dart new file mode 100644 index 000000000..74103fe04 --- /dev/null +++ b/lib/widgets/table_view/table_view.dart @@ -0,0 +1,36 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/widgets/table_view/table_view_row.dart'; + +class TableView extends StatefulWidget { + const TableView({ + Key? key, + required this.rows, + this.rowSpacing = 10.0, + }) : super(key: key); + + final List rows; + final double rowSpacing; + + @override + State createState() => _TableViewState(); +} + +class _TableViewState extends State { + @override + Widget build(BuildContext context) { + return ListView( + children: [ + for (int i = 0; i < widget.rows.length; i++) + Column( + children: [ + if (i != 0) + SizedBox( + height: widget.rowSpacing, + ), + widget.rows[i], + ], + ) + ], + ); + } +} diff --git a/lib/widgets/table_view/table_view_cell.dart b/lib/widgets/table_view/table_view_cell.dart new file mode 100644 index 000000000..16a807d3c --- /dev/null +++ b/lib/widgets/table_view/table_view_cell.dart @@ -0,0 +1,17 @@ +import 'package:flutter/material.dart'; + +class TableViewCell extends StatelessWidget { + const TableViewCell({ + Key? key, + required this.flex, + required this.child, + }) : super(key: key); + + final int flex; + final Widget child; + + @override + Widget build(BuildContext context) { + return child; + } +} diff --git a/lib/widgets/table_view/table_view_row.dart b/lib/widgets/table_view/table_view_row.dart new file mode 100644 index 000000000..95b5ed706 --- /dev/null +++ b/lib/widgets/table_view/table_view_row.dart @@ -0,0 +1,68 @@ +import 'package:flutter/material.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/widgets/expandable.dart'; +import 'package:stackwallet/widgets/table_view/table_view_cell.dart'; + +class TableViewRow extends StatelessWidget { + const TableViewRow({ + Key? key, + required this.cells, + required this.expandingChild, + this.decoration, + this.onExpandChanged, + this.padding = const EdgeInsets.all(0), + }) : super(key: key); + + final List cells; + final Widget? expandingChild; + final Decoration? decoration; + final void Function(ExpandableState)? onExpandChanged; + final EdgeInsetsGeometry padding; + + @override + Widget build(BuildContext context) { + return Container( + decoration: decoration, + child: expandingChild == null + ? Padding( + padding: padding, + child: Row( + children: [ + ...cells.map( + (e) => Expanded( + flex: e.flex, + child: e, + ), + ), + ], + ), + ) + : Expandable( + onExpandChanged: onExpandChanged, + header: Padding( + padding: padding, + child: Row( + children: [ + ...cells.map( + (e) => Expanded( + flex: e.flex, + child: e, + ), + ), + ], + ), + ), + body: Column( + children: [ + Container( + color: StackTheme.instance.color.buttonBackSecondary, + width: double.infinity, + height: 1, + ), + expandingChild!, + ], + ), + ), + ); + } +} diff --git a/lib/widgets/transaction_card.dart b/lib/widgets/transaction_card.dart index 756e3d8f7..705fda2eb 100644 --- a/lib/widgets/transaction_card.dart +++ b/lib/widgets/transaction_card.dart @@ -7,12 +7,12 @@ import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/wallet_view/sub_widgets/tx_icon.dart'; import 'package:stackwallet/pages/wallet_view/transaction_views/transaction_details_view.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:tuple/tuple.dart'; class TransactionCard extends ConsumerStatefulWidget { @@ -101,7 +101,7 @@ class _TransactionCardState extends ConsumerState { .item1; return Material( - color: CFColors.white, + color: StackTheme.instance.color.popupBG, elevation: 0, shape: RoundedRectangleBorder( borderRadius: diff --git a/lib/widgets/wallet_card.dart b/lib/widgets/wallet_card.dart index 6601774ce..9a47d0489 100644 --- a/lib/widgets/wallet_card.dart +++ b/lib/widgets/wallet_card.dart @@ -1,17 +1,10 @@ -import 'package:decimal/decimal.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; -import 'package:flutter_svg/flutter_svg.dart'; import 'package:stackwallet/pages/wallet_view/wallet_view.dart'; import 'package:stackwallet/providers/providers.dart'; -import 'package:stackwallet/utilities/assets.dart'; -import 'package:stackwallet/utilities/cfcolors.dart'; import 'package:stackwallet/utilities/constants.dart'; -import 'package:stackwallet/utilities/enums/coin_enum.dart'; -import 'package:stackwallet/utilities/format.dart'; -import 'package:stackwallet/utilities/text_styles.dart'; -import 'package:stackwallet/widgets/animated_text.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; +import 'package:stackwallet/widgets/wallet_info_row/wallet_info_row.dart'; import 'package:tuple/tuple.dart'; class WalletSheetCard extends ConsumerWidget { @@ -26,19 +19,10 @@ class WalletSheetCard extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { - final manager = ref.watch(ref - .watch(walletsChangeNotifierProvider.notifier) - .getManagerProvider(walletId)); - - final locale = ref.watch( - localeServiceChangeNotifierProvider.select((value) => value.locale)); - - final coin = manager.coin; - return RoundedWhiteContainer( padding: const EdgeInsets.all(0), child: MaterialButton( - // splashColor: CFColors.splashLight, + // splashColor: StackTheme.instance.color.highlight, key: Key("walletsSheetItemButtonKey_$walletId"), padding: const EdgeInsets.all(5), materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, @@ -58,69 +42,8 @@ class WalletSheetCard extends ConsumerWidget { .getManagerProvider(walletId)), ); }, - child: Row( - children: [ - Container( - decoration: BoxDecoration( - color: CFColors.coin.forCoin(manager.coin).withOpacity(0.5), - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius, - ), - ), - child: Padding( - padding: const EdgeInsets.all(4), - child: SvgPicture.asset( - Assets.svg.iconFor(coin: coin), - width: 20, - height: 20, - ), - ), - ), - const SizedBox( - width: 12, - ), - Expanded( - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - manager.walletName, - style: STextStyles.titleBold12, - ), - const SizedBox( - height: 2, - ), - FutureBuilder( - future: manager.totalBalance, - builder: (builderContext, AsyncSnapshot snapshot) { - if (snapshot.connectionState == ConnectionState.done && - snapshot.hasData) { - return Text( - "${Format.localizedStringAsFixed( - value: snapshot.data!, - locale: locale, - decimalPlaces: 8, - )} ${coin.ticker}", - style: STextStyles.itemSubtitle, - ); - } else { - return AnimatedText( - stringsToLoopThrough: const [ - "Loading balance", - "Loading balance.", - "Loading balance..", - "Loading balance..." - ], - style: STextStyles.itemSubtitle, - ); - } - }, - ), - ], - ), - ), - ], + child: WalletInfoRow( + walletId: walletId, ), ), ); diff --git a/lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_balance_future.dart b/lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_balance_future.dart new file mode 100644 index 000000000..1a8078874 --- /dev/null +++ b/lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_balance_future.dart @@ -0,0 +1,65 @@ +import 'package:decimal/decimal.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/providers/providers.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/format.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; +import 'package:stackwallet/widgets/animated_text.dart'; + +class WalletInfoRowBalanceFuture extends ConsumerWidget { + const WalletInfoRowBalanceFuture({Key? key, required this.walletId}) + : super(key: key); + + final String walletId; + + @override + Widget build(BuildContext context, WidgetRef ref) { + final manager = ref.watch(ref + .watch(walletsChangeNotifierProvider.notifier) + .getManagerProvider(walletId)); + + final locale = ref.watch( + localeServiceChangeNotifierProvider.select( + (value) => value.locale, + ), + ); + + return FutureBuilder( + future: manager.totalBalance, + builder: (builderContext, AsyncSnapshot snapshot) { + if (snapshot.connectionState == ConnectionState.done && + snapshot.hasData) { + return Text( + "${Format.localizedStringAsFixed( + value: snapshot.data!, + locale: locale, + decimalPlaces: 8, + )} ${manager.coin.ticker}", + style: Util.isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ) + : STextStyles.itemSubtitle, + ); + } else { + return AnimatedText( + stringsToLoopThrough: const [ + "Loading balance", + "Loading balance.", + "Loading balance..", + "Loading balance..." + ], + style: Util.isDesktop + ? STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textSubtitle1, + ) + : STextStyles.itemSubtitle, + ); + } + }, + ); + } +} diff --git a/lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_coin_icon.dart b/lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_coin_icon.dart new file mode 100644 index 000000000..09e497aac --- /dev/null +++ b/lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_coin_icon.dart @@ -0,0 +1,32 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/constants.dart'; +import 'package:stackwallet/utilities/enums/coin_enum.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; + +class WalletInfoCoinIcon extends StatelessWidget { + const WalletInfoCoinIcon({Key? key, required this.coin}) : super(key: key); + + final Coin coin; + + @override + Widget build(BuildContext context) { + return Container( + decoration: BoxDecoration( + color: StackTheme.instance.colorForCoin(coin).withOpacity(0.5), + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + child: Padding( + padding: const EdgeInsets.all(4), + child: SvgPicture.asset( + Assets.svg.iconFor(coin: coin), + width: 20, + height: 20, + ), + ), + ); + } +} diff --git a/lib/widgets/wallet_info_row/wallet_info_row.dart b/lib/widgets/wallet_info_row/wallet_info_row.dart new file mode 100644 index 000000000..be97811d3 --- /dev/null +++ b/lib/widgets/wallet_info_row/wallet_info_row.dart @@ -0,0 +1,93 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:stackwallet/providers/providers.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_theme.dart'; +import 'package:stackwallet/utilities/util.dart'; +import 'package:stackwallet/widgets/wallet_info_row/sub_widgets/wallet_info_row_balance_future.dart'; +import 'package:stackwallet/widgets/wallet_info_row/sub_widgets/wallet_info_row_coin_icon.dart'; + +class WalletInfoRow extends ConsumerWidget { + const WalletInfoRow({ + Key? key, + required this.walletId, + this.onPressed, + }) : super(key: key); + + final String walletId; + final VoidCallback? onPressed; + + @override + Widget build(BuildContext context, WidgetRef ref) { + final manager = ref.watch(ref + .watch(walletsChangeNotifierProvider.notifier) + .getManagerProvider(walletId)); + + return Row( + children: Util.isDesktop + ? [ + Expanded( + flex: 4, + child: Row( + children: [ + WalletInfoCoinIcon(coin: manager.coin), + const SizedBox( + width: 12, + ), + Text( + manager.walletName, + style: STextStyles.desktopTextExtraSmall.copyWith( + color: StackTheme.instance.color.textDark, + ), + ), + ], + ), + ), + Expanded( + flex: 4, + child: WalletInfoRowBalanceFuture( + walletId: walletId, + ), + ), + Expanded( + flex: 6, + child: Row( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + SvgPicture.asset( + Assets.svg.chevronRight, + width: 20, + height: 20, + color: StackTheme.instance.color.textSubtitle1, + ) + ], + ), + ) + ] + : [ + WalletInfoCoinIcon(coin: manager.coin), + const SizedBox( + width: 12, + ), + Expanded( + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + manager.walletName, + style: STextStyles.titleBold12, + ), + const SizedBox( + height: 2, + ), + WalletInfoRowBalanceFuture(walletId: walletId), + ], + ), + ), + ], + ); + } +} diff --git a/linux/flutter/generated_plugin_registrant.cc b/linux/flutter/generated_plugin_registrant.cc index 0723b0586..fe1e41d19 100644 --- a/linux/flutter/generated_plugin_registrant.cc +++ b/linux/flutter/generated_plugin_registrant.cc @@ -13,6 +13,7 @@ #include #include #include +#include void fl_register_plugins(FlPluginRegistry* registry) { g_autoptr(FlPluginRegistrar) devicelocale_registrar = @@ -36,4 +37,7 @@ void fl_register_plugins(FlPluginRegistry* registry) { g_autoptr(FlPluginRegistrar) url_launcher_linux_registrar = fl_plugin_registry_get_registrar_for_plugin(registry, "UrlLauncherPlugin"); url_launcher_plugin_register_with_registrar(url_launcher_linux_registrar); + g_autoptr(FlPluginRegistrar) window_size_registrar = + fl_plugin_registry_get_registrar_for_plugin(registry, "WindowSizePlugin"); + window_size_plugin_register_with_registrar(window_size_registrar); } diff --git a/linux/flutter/generated_plugins.cmake b/linux/flutter/generated_plugins.cmake index 4b220680e..ba2cb50f2 100644 --- a/linux/flutter/generated_plugins.cmake +++ b/linux/flutter/generated_plugins.cmake @@ -10,6 +10,7 @@ list(APPEND FLUTTER_PLUGIN_LIST isar_flutter_libs stack_wallet_backup url_launcher_linux + window_size ) list(APPEND FLUTTER_FFI_PLUGIN_LIST diff --git a/macos/Flutter/GeneratedPluginRegistrant.swift b/macos/Flutter/GeneratedPluginRegistrant.swift index e4a20406c..a4f194b8d 100644 --- a/macos/Flutter/GeneratedPluginRegistrant.swift +++ b/macos/Flutter/GeneratedPluginRegistrant.swift @@ -17,6 +17,7 @@ import shared_preferences_macos import stack_wallet_backup import url_launcher_macos import wakelock_macos +import window_size func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) { ConnectivityPlugin.register(with: registry.registrar(forPlugin: "ConnectivityPlugin")) @@ -31,4 +32,5 @@ func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) { StackWalletBackupPlugin.register(with: registry.registrar(forPlugin: "StackWalletBackupPlugin")) UrlLauncherPlugin.register(with: registry.registrar(forPlugin: "UrlLauncherPlugin")) WakelockMacosPlugin.register(with: registry.registrar(forPlugin: "WakelockMacosPlugin")) + WindowSizePlugin.register(with: registry.registrar(forPlugin: "WindowSizePlugin")) } diff --git a/pubspec.lock b/pubspec.lock index 0f9b29157..71145aef4 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -366,6 +366,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "0.5.2" + dropdown_button2: + dependency: "direct main" + description: + name: dropdown_button2 + url: "https://pub.dartlang.org" + source: hosted + version: "1.7.2" emojis: dependency: "direct main" description: @@ -1607,6 +1614,15 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "2.7.0" + window_size: + dependency: "direct main" + description: + path: "plugins/window_size" + ref: HEAD + resolved-ref: "17d4710c17f4913137e7ec931f6e71eaef443363" + url: "https://github.com/google/flutter-desktop-embedding.git" + source: git + version: "0.1.0" xdg_directories: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index ebf9235f1..a616a468a 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -64,6 +64,11 @@ dependencies: zxcvbn: ^1.0.0 dart_numerics: ^0.0.6 + window_size: + git: + url: https://github.com/google/flutter-desktop-embedding.git + path: plugins/window_size + # Bitcoin plugins bip39: git: @@ -123,6 +128,7 @@ dependencies: # document_file_save_plus: ^1.0.5 isar: 3.0.0-dev.10 isar_flutter_libs: 3.0.0-dev.10 # contains the binaries + dropdown_button2: 1.7.2 dev_dependencies: flutter_test: @@ -193,7 +199,8 @@ flutter: - assets/svg/plus.svg - assets/svg/gear.svg - assets/svg/bell.svg - - assets/svg/bell-new.svg + - assets/svg/light/bell-new.svg + - assets/svg/dark/bell-new.svg - assets/svg/stack-icon1.svg - assets/svg/arrow-left-fa.svg - assets/svg/copy-fa.svg @@ -207,7 +214,8 @@ flutter: - assets/svg/bars.svg - assets/svg/filter.svg - assets/svg/pending.svg - - assets/svg/exchange-2.svg + - assets/svg/dark/exchange-2.svg + - assets/svg/light/exchange-2.svg - assets/svg/signal-stream.svg - assets/svg/buy-coins-icon.svg - assets/svg/Ellipse-43.svg @@ -223,6 +231,7 @@ flutter: - assets/svg/folder-down.svg - assets/svg/network-wired.svg - assets/svg/address-book.svg + - assets/svg/address-book2.svg - assets/svg/arrow-right.svg - assets/svg/delete.svg - assets/svg/dollar-sign.svg @@ -248,16 +257,25 @@ flutter: - assets/svg/ellipsis-vertical1.svg - assets/svg/dice-alt.svg - assets/svg/circle-arrow-up-right2.svg - - assets/svg/tx-exchange-icon.svg - - assets/svg/tx-exchange-icon-pending.svg - - assets/svg/tx-exchange-icon-failed.svg + - assets/svg/dark/tx-exchange-icon.svg + - assets/svg/light/tx-exchange-icon.svg + - assets/svg/dark/tx-exchange-icon-pending.svg + - assets/svg/light/tx-exchange-icon-pending.svg + - assets/svg/dark/tx-exchange-icon-failed.svg + - assets/svg/light/tx-exchange-icon-failed.svg - assets/svg/loader.svg - - assets/svg/tx-icon-send.svg - - assets/svg/tx-icon-send-pending.svg - - assets/svg/tx-icon-send-failed.svg - - assets/svg/tx-icon-receive.svg - - assets/svg/tx-icon-receive-pending.svg - - assets/svg/tx-icon-receive-failed.svg + - assets/svg/dark/tx-icon-send.svg + - assets/svg/light/tx-icon-send.svg + - assets/svg/dark/tx-icon-send-pending.svg + - assets/svg/light/tx-icon-send-pending.svg + - assets/svg/dark/tx-icon-send-failed.svg + - assets/svg/light/tx-icon-send-failed.svg + - assets/svg/dark/tx-icon-receive.svg + - assets/svg/light/tx-icon-receive.svg + - assets/svg/dark/tx-icon-receive-pending.svg + - assets/svg/light/tx-icon-receive-pending.svg + - assets/svg/dark/tx-icon-receive-failed.svg + - assets/svg/light/tx-icon-receive-failed.svg - assets/svg/add-backup.svg - assets/svg/auto-backup.svg - assets/svg/restore-backup.svg @@ -284,6 +302,11 @@ flutter: - assets/svg/socials/reddit-alien-brands.svg - assets/svg/socials/twitter-brands.svg - assets/svg/socials/telegram-brands.svg + - assets/svg/chevron-right.svg + - assets/svg/minimize.svg + - assets/svg/wallet-fa.svg + - assets/svg/exchange-3.svg + - assets/svg/message-question-1.svg # An image asset can refer to one or more resolution-specific "variants", see # https://flutter.dev/assets-and-images/#resolution-aware. diff --git a/test/price_test.dart b/test/price_test.dart index 7c22cd6fe..ac1110df5 100644 --- a/test/price_test.dart +++ b/test/price_test.dart @@ -23,7 +23,7 @@ void main() { when(client.get( Uri.parse( - "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), + "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin,bitcoin-cash,namecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), headers: { 'Content-Type': 'application/json' })).thenAnswer((_) async => Response( @@ -36,10 +36,10 @@ void main() { final price = await priceAPI.getPricesAnd24hChange(baseCurrency: "btc"); expect(price.toString(), - '{Coin.bitcoin: [1, 0.0], Coin.dogecoin: [0.00000315, -2.68533], Coin.epicCash: [0.00002803, 7.27524], Coin.firo: [0.0001096, -0.89304], Coin.monero: [0.00717236, -0.77656], Coin.bitcoinTestNet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); + '{Coin.bitcoin: [1, 0.0], Coin.bitcoincash: [0, 0.0], Coin.dogecoin: [0.00000315, -2.68533], Coin.epicCash: [0.00002803, 7.27524], Coin.firo: [0.0001096, -0.89304], Coin.monero: [0.00717236, -0.77656], Coin.namecoin: [0, 0.0], Coin.bitcoinTestNet: [0, 0.0], Coin.bitcoincashTestnet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); verify(client.get( Uri.parse( - "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), + "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin,bitcoin-cash,namecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), headers: {'Content-Type': 'application/json'})).called(1); verifyNoMoreInteractions(client); @@ -50,7 +50,7 @@ void main() { when(client.get( Uri.parse( - "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), + "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin,bitcoin-cash,namecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), headers: { 'Content-Type': 'application/json' })).thenAnswer((_) async => Response( @@ -68,12 +68,12 @@ void main() { await priceAPI.getPricesAnd24hChange(baseCurrency: "btc"); expect(cachedPrice.toString(), - '{Coin.bitcoin: [1, 0.0], Coin.dogecoin: [0.00000315, -2.68533], Coin.epicCash: [0.00002803, 7.27524], Coin.firo: [0.0001096, -0.89304], Coin.monero: [0.00717236, -0.77656], Coin.bitcoinTestNet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); + '{Coin.bitcoin: [1, 0.0], Coin.bitcoincash: [0, 0.0], Coin.dogecoin: [0.00000315, -2.68533], Coin.epicCash: [0.00002803, 7.27524], Coin.firo: [0.0001096, -0.89304], Coin.monero: [0.00717236, -0.77656], Coin.namecoin: [0, 0.0], Coin.bitcoinTestNet: [0, 0.0], Coin.bitcoincashTestnet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); // verify only called once during filling of cache verify(client.get( Uri.parse( - "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), + "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin,bitcoin-cash,namecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), headers: {'Content-Type': 'application/json'})).called(1); verifyNoMoreInteractions(client); @@ -84,7 +84,7 @@ void main() { when(client.get( Uri.parse( - "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), + "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin,bitcoin-cash,namecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), headers: { 'Content-Type': 'application/json' })).thenAnswer((_) async => Response( @@ -97,7 +97,7 @@ void main() { final price = await priceAPI.getPricesAnd24hChange(baseCurrency: "btc"); expect(price.toString(), - '{Coin.bitcoin: [0, 0.0], Coin.dogecoin: [0, 0.0], Coin.epicCash: [0, 0.0], Coin.firo: [0, 0.0], Coin.monero: [0, 0.0], Coin.bitcoinTestNet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); + '{Coin.bitcoin: [0, 0.0], Coin.bitcoincash: [0, 0.0], Coin.dogecoin: [0, 0.0], Coin.epicCash: [0, 0.0], Coin.firo: [0, 0.0], Coin.monero: [0, 0.0], Coin.namecoin: [0, 0.0], Coin.bitcoinTestNet: [0, 0.0], Coin.bitcoincashTestnet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); }); test("no internet available", () async { @@ -105,7 +105,7 @@ void main() { when(client.get( Uri.parse( - "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), + "https://api.coingecko.com/api/v3/coins/markets?vs_currency=btc&ids=monero,bitcoin,epic-cash,zcoin,dogecoin,bitcoin-cash,namecoin&order=market_cap_desc&per_page=10&page=1&sparkline=false"), headers: { 'Content-Type': 'application/json' })).thenThrow(const SocketException( @@ -117,7 +117,7 @@ void main() { final price = await priceAPI.getPricesAnd24hChange(baseCurrency: "btc"); expect(price.toString(), - '{Coin.bitcoin: [0, 0.0], Coin.dogecoin: [0, 0.0], Coin.epicCash: [0, 0.0], Coin.firo: [0, 0.0], Coin.monero: [0, 0.0], Coin.bitcoinTestNet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); + '{Coin.bitcoin: [0, 0.0], Coin.bitcoincash: [0, 0.0], Coin.dogecoin: [0, 0.0], Coin.epicCash: [0, 0.0], Coin.firo: [0, 0.0], Coin.monero: [0, 0.0], Coin.namecoin: [0, 0.0], Coin.bitcoinTestNet: [0, 0.0], Coin.bitcoincashTestnet: [0, 0.0], Coin.dogecoinTestNet: [0, 0.0], Coin.firoTestNet: [0, 0.0]}'); }); tearDown(() async { diff --git a/windows/flutter/generated_plugin_registrant.cc b/windows/flutter/generated_plugin_registrant.cc index e2c6ccc42..98655fe05 100644 --- a/windows/flutter/generated_plugin_registrant.cc +++ b/windows/flutter/generated_plugin_registrant.cc @@ -13,6 +13,7 @@ #include #include #include +#include void RegisterPlugins(flutter::PluginRegistry* registry) { ConnectivityPlusWindowsPluginRegisterWithRegistrar( @@ -29,4 +30,6 @@ void RegisterPlugins(flutter::PluginRegistry* registry) { registry->GetRegistrarForPlugin("StackWalletBackupPluginCApi")); UrlLauncherWindowsRegisterWithRegistrar( registry->GetRegistrarForPlugin("UrlLauncherWindows")); + WindowSizePluginRegisterWithRegistrar( + registry->GetRegistrarForPlugin("WindowSizePlugin")); } diff --git a/windows/flutter/generated_plugins.cmake b/windows/flutter/generated_plugins.cmake index a0783a490..4426d9497 100644 --- a/windows/flutter/generated_plugins.cmake +++ b/windows/flutter/generated_plugins.cmake @@ -10,6 +10,7 @@ list(APPEND FLUTTER_PLUGIN_LIST permission_handler_windows stack_wallet_backup url_launcher_windows + window_size ) list(APPEND FLUTTER_FFI_PLUGIN_LIST