CAKE-20 | applied light theme to dashboard, receive, monero_account_list, monero_account_edit_or_create, address_edit_or_create, trade_details, transaction_details and base pages

lib/palette.dart

@@ -13,6 +13,23 @@ class Palette {
   static const Color blue = Color.fromRGBO(88, 143, 252, 1.0);
   static const Color darkLavender = Color.fromRGBO(225, 238, 250, 1.0);
   static const Color nightBlue = Color.fromRGBO(46, 57, 96, 1.0);
+
+  // NEW DESIGN
+  static const Color blueCraiola = Color.fromRGBO(69, 110, 255, 1.0);
+  static const Color darkBlueCraiola = Color.fromRGBO(53, 86, 136, 1.0);
+  static const Color pinkFlamingo = Color.fromRGBO(240, 60, 243, 1.0);
+  static const Color redHat = Color.fromRGBO(209, 68, 37, 1.0);
+  static const Color shineOrange = Color.fromRGBO(255, 184, 78, 1.0);
+  static const Color paleBlue = Color.fromRGBO(225, 228, 233, 1.0);
+  static const Color violetBlue = Color.fromRGBO(56, 69, 103, 1.0);
+  static const Color periwinkleCraiola = Color.fromRGBO(229, 232, 242, 1.0);
+  static const Color moderatePurpleBlue = Color.fromRGBO(57, 74, 95, 1.0);
+  static const Color moderateLavender = Color.fromRGBO(233, 242, 252, 1.0);
+  static const Color wildLavender = Color.fromRGBO(224, 230, 246, 1.0);
+  static const Color gray = Color.fromRGBO(112, 147, 186, 1.0);
+  static const Color wildPeriwinkle = Color.fromRGBO(219, 227, 243, 1.0);
+  static const Color darkGray = Color.fromRGBO(122, 147, 186, 1.0);
+
   // FIXME: Rename.
   static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);
   static const Color xxx = Color.fromRGBO(72, 89, 109, 1);

lib/src/screens/base_page.dart

@@ -15,7 +15,9 @@ abstract class BasePage extends StatelessWidget {
 
   Color get backgroundLightColor => Colors.white;
 
-  Color get backgroundDarkColor => PaletteDark.darkNightBlue;
+  Color get backgroundDarkColor => PaletteDark.backgroundColor;
+
+  Color get titleColor => null;
 
   bool get resizeToAvoidBottomPadding => true;
 
@@ -27,11 +29,6 @@ abstract class BasePage extends StatelessWidget {
 
   final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
 
-  final _backArrowImage = Image.asset('assets/images/back_arrow.png',
-  color: Colors.white);
-  final _backArrowImageDarkTheme =
-  Image.asset('assets/images/back_arrow_dark_theme.png',
-  color: Colors.white);
   final _closeButtonImage = Image.asset('assets/images/close_button.png');
   final _closeButtonImageDarkTheme =
       Image.asset('assets/images/close_button_dark_theme.png');
@@ -45,16 +42,13 @@ abstract class BasePage extends StatelessWidget {
       return null;
     }
 
+    final _backButton = Image.asset('assets/images/back_arrow.png',
+          color: titleColor ?? Theme.of(context).primaryTextTheme.title.color);
+
     final _themeChanger = Provider.of<ThemeChanger>(context);
-    Image _closeButton, _backButton;
+    final _closeButton = _themeChanger.getTheme() == Themes.darkTheme
-
+    ? _closeButtonImageDarkTheme
-    if (_themeChanger.getTheme() == Themes.darkTheme) {
+    : _closeButtonImage;
-      _backButton = _backArrowImageDarkTheme;
-      _closeButton = _closeButtonImageDarkTheme;
-    } else {
-      _backButton = _backArrowImage;
-      _closeButton = _closeButtonImage;
-    }
 
     return SizedBox(
       height: 37,
@@ -79,7 +73,8 @@ abstract class BasePage extends StatelessWidget {
             style: TextStyle(
                 fontSize: 18.0,
                 fontWeight: FontWeight.bold,
-                color: Colors.white),
+                color: titleColor ??
+                       Theme.of(context).primaryTextTheme.title.color),
           );
   }
 

lib/src/screens/dashboard/dashboard_page.dart

@@ -5,7 +5,6 @@ import 'package:flutter/cupertino.dart';
 import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/menu_widget.dart';
-import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/action_button.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/balance_page.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/address_page.dart';
@@ -21,10 +20,23 @@ class DashboardPage extends BasePage {
   });
 
   @override
-  Color get backgroundLightColor => PaletteDark.backgroundColor;
+  Color get backgroundLightColor => Colors.transparent;
 
   @override
-  Color get backgroundDarkColor => PaletteDark.backgroundColor;
+  Color get backgroundDarkColor => Colors.transparent;
+
+  @override
+  Widget Function(BuildContext, Widget) get rootWrapper =>
+          (BuildContext context, Widget scaffold) => Container(
+          decoration: BoxDecoration(
+              gradient: LinearGradient(colors: [
+                Theme.of(context).accentColor,
+                Theme.of(context).scaffoldBackgroundColor,
+                Theme.of(context).primaryColor,
+              ],
+              begin: Alignment.topRight,
+              end: Alignment.bottomLeft)),
+          child: scaffold);
 
   @override
   bool get resizeToAvoidBottomPadding => false;
@@ -101,7 +113,7 @@ class DashboardPage extends BasePage {
                   radius:  6.0,
                   dotWidth:  6.0,
                   dotHeight:  6.0,
-                  dotColor:  PaletteDark.cyanBlue,
+                  dotColor:  Theme.of(context).indicatorColor,
                   activeDotColor:  Colors.white
               ),
             )

lib/src/screens/dashboard/widgets/action_button.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 
 class ActionButton extends StatelessWidget{
   ActionButton({
@@ -36,7 +35,7 @@ class ActionButton extends StatelessWidget{
               width: 60,
               alignment: Alignment.center,
               decoration: BoxDecoration(
-                color: PaletteDark.nightBlue,
+                color: Theme.of(context).buttonColor,
                 shape: BoxShape.circle),
               child: image,
             ),

lib/src/screens/dashboard/widgets/address_page.dart

@@ -1,6 +1,5 @@
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/view_model/wallet_address_list/wallet_address_list_view_model.dart';
-import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/src/screens/receive/widgets/qr_widget.dart';
 import 'package:cake_wallet/routes.dart';
 import 'package:cake_wallet/generated/i18n.dart';
@@ -29,7 +28,11 @@ class AddressPage extends StatelessWidget {
               alignment: Alignment.center,
               decoration: BoxDecoration(
                 borderRadius: BorderRadius.all(Radius.circular(25)),
-                color: PaletteDark.nightBlue
+                border: Border.all(
+                  color: Theme.of(context).textTheme.subhead.color,
+                  width: 1
+                ),
+                color: Theme.of(context).buttonColor
               ),
               child: Row(
                 mainAxisSize: MainAxisSize.max,

lib/src/screens/dashboard/widgets/balance_page.dart

@@ -1,6 +1,5 @@
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
-import 'package:cake_wallet/palette.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
 
 class BalancePage extends StatelessWidget {
@@ -26,7 +25,7 @@ class BalancePage extends StatelessWidget {
                       style: TextStyle(
                           fontSize: 40,
                           fontWeight: FontWeight.bold,
-                          color: PaletteDark.cyanBlue,
+                          color: Theme.of(context).indicatorColor,
                           height: 1
                       ),
                     );
@@ -52,7 +51,7 @@ class BalancePage extends StatelessWidget {
                       style: TextStyle(
                           fontSize: 18,
                           fontWeight: FontWeight.w500,
-                          color: PaletteDark.cyanBlue,
+                          color: Theme.of(context).indicatorColor,
                           height: 1
                       ),
                     );

lib/src/screens/dashboard/widgets/date_section_raw.dart

@@ -3,7 +3,6 @@ import 'package:intl/intl.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:provider/provider.dart';
 import 'package:cake_wallet/src/stores/settings/settings_store.dart';
-import 'package:cake_wallet/palette.dart';
 
 class DateSectionRaw extends StatelessWidget {
   DateSectionRaw({this.date});
@@ -42,7 +41,7 @@ class DateSectionRaw extends StatelessWidget {
       child: Text(title,
         style: TextStyle(
           fontSize: 12,
-          color: PaletteDark.darkCyanBlue
+          color: Theme.of(context).textTheme.overline.backgroundColor
       ))
     );
   }

lib/src/screens/dashboard/widgets/header_row.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
 import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
@@ -11,11 +10,11 @@ class HeaderRow extends StatelessWidget {
 
   final DashboardViewModel dashboardViewModel;
 
-  final filterIcon = Image.asset('assets/images/filter_icon.png',
-      color: PaletteDark.wildBlue);
-
   @override
   Widget build(BuildContext context) {
+    final filterIcon = Image.asset('assets/images/filter_icon.png',
+        color: Theme.of(context).textTheme.caption.decorationColor);
+
     return Container(
       height: 52,
       color: Colors.transparent,
@@ -40,7 +39,7 @@ class HeaderRow extends StatelessWidget {
                   child: Text(S.of(context).transactions,
                       style: TextStyle(
                           fontWeight: FontWeight.bold,
-                          color: Theme.of(context).primaryTextTheme.caption.color))),
+                          color: Theme.of(context).primaryTextTheme.title.color))),
               PopupMenuItem(
                   value: 0,
                   child: Observer(
@@ -49,7 +48,11 @@ class HeaderRow extends StatelessWidget {
                           MainAxisAlignment
                               .spaceBetween,
                           children: [
-                            Text(S.of(context).incoming),
+                            Text(S.of(context).incoming,
+                              style: TextStyle(
+                                color: Theme.of(context).primaryTextTheme.title.color
+                              ),
+                            ),
                             Checkbox(
                                 value: dashboardViewModel
                                     .transactionFilterStore
@@ -67,7 +70,11 @@ class HeaderRow extends StatelessWidget {
                           MainAxisAlignment
                               .spaceBetween,
                           children: [
-                            Text(S.of(context).outgoing),
+                            Text(S.of(context).outgoing,
+                                style: TextStyle(
+                                    color: Theme.of(context).primaryTextTheme.title.color
+                                )
+                            ),
                             Checkbox(
                               value: dashboardViewModel
                                   .transactionFilterStore
@@ -80,7 +87,11 @@ class HeaderRow extends StatelessWidget {
               PopupMenuItem(
                   value: 2,
                   child:
-                  Text(S.of(context).transactions_by_date)),
+                  Text(S.of(context).transactions_by_date,
+                      style: TextStyle(
+                          color: Theme.of(context).primaryTextTheme.title.color
+                      )
+                  )),
               PopupMenuDivider(),
               PopupMenuItem(
                   enabled: false,
@@ -88,7 +99,7 @@ class HeaderRow extends StatelessWidget {
                   child: Text(S.of(context).trades,
                       style: TextStyle(
                           fontWeight: FontWeight.bold,
-                          color: Theme.of(context).primaryTextTheme.caption.color))),
+                          color: Theme.of(context).primaryTextTheme.title.color))),
               PopupMenuItem(
                   value: 3,
                   child: Observer(
@@ -97,7 +108,11 @@ class HeaderRow extends StatelessWidget {
                           MainAxisAlignment
                               .spaceBetween,
                           children: [
-                            Text('XMR.TO'),
+                            Text('XMR.TO',
+                                style: TextStyle(
+                                    color: Theme.of(context).primaryTextTheme.title.color
+                                )
+                            ),
                             Checkbox(
                               value: dashboardViewModel
                                   .tradeFilterStore
@@ -117,7 +132,11 @@ class HeaderRow extends StatelessWidget {
                           MainAxisAlignment
                               .spaceBetween,
                           children: [
-                            Text('Change.NOW'),
+                            Text('Change.NOW',
+                                style: TextStyle(
+                                    color: Theme.of(context).primaryTextTheme.title.color
+                                )
+                            ),
                             Checkbox(
                               value: dashboardViewModel
                                   .tradeFilterStore
@@ -137,7 +156,11 @@ class HeaderRow extends StatelessWidget {
                           MainAxisAlignment
                               .spaceBetween,
                           children: [
-                            Text('MorphToken'),
+                            Text('MorphToken',
+                                style: TextStyle(
+                                    color: Theme.of(context).primaryTextTheme.title.color
+                                )
+                            ),
                             Checkbox(
                               value: dashboardViewModel
                                   .tradeFilterStore
@@ -155,7 +178,7 @@ class HeaderRow extends StatelessWidget {
               width: 36,
               decoration: BoxDecoration(
                   shape: BoxShape.circle,
-                  color: PaletteDark.oceanBlue
+                  color: Theme.of(context).textTheme.overline.color
               ),
               child: filterIcon,
             ),

lib/src/screens/dashboard/widgets/menu_widget.dart

@@ -17,7 +17,7 @@ class MenuWidget extends StatefulWidget {
 
 class MenuWidgetState extends State<MenuWidget> {
   final moneroIcon = Image.asset('assets/images/monero_menu.png');
-  final bitcoinIcon = Image.asset('assets/images/bitcoin.png');
+  final bitcoinIcon = Image.asset('assets/images/bitcoin_menu.png');
   final largeScreen = 731;
 
   double menuWidth;
@@ -81,7 +81,7 @@ class MenuWidgetState extends State<MenuWidget> {
               width: 4,
               decoration: BoxDecoration(
                 borderRadius: BorderRadius.all(Radius.circular(2)),
-                color: Theme.of(context).hintColor),
+                color: PaletteDark.gray),
             )),
           SizedBox(width: 12),
           Expanded(
@@ -92,12 +92,13 @@ class MenuWidgetState extends State<MenuWidget> {
                 child: Container(
                   width: menuWidth,
                   height: double.infinity,
-                  color: PaletteDark.deepPurpleBlue,
+                  color: Theme.of(context).textTheme.body2.decorationColor,
                   child: SingleChildScrollView(
                     child: Column(
                       children: <Widget>[
                         Container(
                           height: headerHeight,
+                          color: Theme.of(context).textTheme.body2.color,
                           padding: EdgeInsets.only(
                               left: 24,
                               top: fromTopEdge,
@@ -120,7 +121,8 @@ class MenuWidgetState extends State<MenuWidget> {
                                         Text(
                                           widget.name,
                                           style: TextStyle(
-                                              color: Colors.white,
+                                              color: Theme.of(context).textTheme
+                                                  .display2.color,
                                               fontSize: 16,
                                               fontWeight: FontWeight.bold),
                                         ),
@@ -128,7 +130,9 @@ class MenuWidgetState extends State<MenuWidget> {
                                           Text(
                                             widget.subname,
                                             style: TextStyle(
-                                                color: PaletteDark.darkCyanBlue,
+                                                color: Theme.of(context)
+                                                    .primaryTextTheme
+                                                    .caption.color,
                                                 fontWeight: FontWeight.w500,
                                                 fontSize: 12),
                                           )
@@ -140,7 +144,7 @@ class MenuWidgetState extends State<MenuWidget> {
                         ),
                         Container(
                           height: 1,
-                          color: PaletteDark.darkOceanBlue,
+                          color: Theme.of(context).primaryTextTheme.caption.decorationColor,
                         ),
                         ListView.separated(
                             shrinkWrap: true,
@@ -178,7 +182,8 @@ class MenuWidgetState extends State<MenuWidget> {
                                           child: Text(
                                             item,
                                             style: TextStyle(
-                                                color: Colors.white,
+                                                color: Theme.of(context).textTheme
+                                                    .display2.color,
                                                 fontSize: 16,
                                                 fontWeight: FontWeight.bold),
                                           ))
@@ -189,7 +194,7 @@ class MenuWidgetState extends State<MenuWidget> {
                             },
                             separatorBuilder: (_, index) => Container(
                               height: 1,
-                              color: PaletteDark.darkOceanBlue,
+                              color: Theme.of(context).primaryTextTheme.caption.decorationColor,
                             ),
                             itemCount: itemCount)
                       ],

lib/src/screens/dashboard/widgets/sync_indicator.dart

@@ -13,35 +13,36 @@ class SyncIndicator extends StatelessWidget {
   Widget build(BuildContext context) {
     return Observer(
       builder: (_) {
-        final syncIndicatorWidth = 250.0;
+        final syncIndicatorWidth = 237.0;
         final status = dashboardViewModel.status;
-        final statusText = status.title();
+        final statusText = status != null ? status.title() : '';
-        final progress = status.progress();
+        final progress = status != null ? status.progress() : 0.0;
         final indicatorOffset = progress * syncIndicatorWidth;
-        final indicatorWidth =
+        final indicatorWidth = progress < 1
-        progress <= 1 ? syncIndicatorWidth - indicatorOffset : 0.0;
+            ? indicatorOffset > 0 ? indicatorOffset : 0.0
+            : syncIndicatorWidth;
         final indicatorColor = status is SyncedSyncStatus
                                ? PaletteDark.brightGreen
-                               : PaletteDark.orangeYellow;
+                               : Theme.of(context).textTheme.caption.color;
 
         return ClipRRect(
           borderRadius: BorderRadius.all(Radius.circular(15)),
           child: Container(
             height: 30,
             width: syncIndicatorWidth,
-            color: PaletteDark.lightNightBlue,
+            color: Theme.of(context).textTheme.title.decorationColor,
             child: Stack(
               alignment: Alignment.center,
               children: <Widget>[
                 progress <= 1
                 ? Positioned(
-                    left: indicatorOffset,
+                    left: 0,
                     top: 0,
                     bottom: 0,
                     child: Container(
                       width: indicatorWidth,
                       height: 30,
-                      color: PaletteDark.oceanBlue,
+                      color: Theme.of(context).textTheme.title.backgroundColor,
                     )
                 )
                 : Offstage(),
@@ -70,7 +71,7 @@ class SyncIndicator extends StatelessWidget {
                           style: TextStyle(
                             fontSize: 12,
                             fontWeight: FontWeight.w500,
-                            color: PaletteDark.wildBlue
+                            color: Theme.of(context).textTheme.title.color
                           ),
                         ),
                       )

lib/src/screens/dashboard/widgets/trade_row.dart

@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
 import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
-import 'package:cake_wallet/palette.dart';
 
 class TradeRow extends StatelessWidget {
   TradeRow({
@@ -66,7 +65,8 @@ class TradeRow extends StatelessWidget {
                                   Text(createdAtFormattedDate,
                                       style: TextStyle(
                                           fontSize: 14,
-                                          color: PaletteDark.darkCyanBlue))
+                                          color: Theme.of(context).textTheme
+                                              .overline.backgroundColor))
                                 ]),
                           ],
                         ),

lib/src/screens/dashboard/widgets/transaction_raw.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/src/domain/common/transaction_direction.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 
@@ -35,7 +34,7 @@ class TransactionRow extends StatelessWidget {
                   width: 36,
                   decoration: BoxDecoration(
                     shape: BoxShape.circle,
-                    color: PaletteDark.wildNightBlue
+                    color: Theme.of(context).textTheme.overline.decorationColor
                   ),
                   child: Image.asset(
                       direction == TransactionDirection.incoming
@@ -79,13 +78,15 @@ class TransactionRow extends StatelessWidget {
                                   Text(formattedDate,
                                       style: TextStyle(
                                           fontSize: 14,
-                                          color: PaletteDark.darkCyanBlue)),
+                                          color: Theme.of(context).textTheme
+                                              .overline.backgroundColor)),
                                   Text(direction == TransactionDirection.incoming
                                       ? formattedFiatAmount
                                       : '- ' + formattedFiatAmount,
                                       style: TextStyle(
                                           fontSize: 14,
-                                          color: PaletteDark.darkCyanBlue))
+                                          color: Theme.of(context).textTheme
+                                              .overline.backgroundColor))
                                 ]),
                           ],
                         ),

lib/src/screens/dashboard/widgets/transactions_page.dart

@@ -75,7 +75,7 @@ class TransactionsPage extends StatelessWidget {
                         }
 
                         return Container(
-                            color: Theme.of(context).backgroundColor,
+                            color: Colors.transparent,
                             height: 1);
                       }
                   )
@@ -84,7 +84,8 @@ class TransactionsPage extends StatelessWidget {
                       S.of(context).placeholder_transactions,
                       style: TextStyle(
                         fontSize: 14,
-                        color: Colors.grey
+                        color: Theme.of(context).primaryTextTheme
+                            .overline.decorationColor
                       ),
                     ),
                   );

lib/src/screens/monero_accounts/monero_account_edit_or_create_page.dart

@@ -8,7 +8,6 @@ import 'package:cake_wallet/view_model/monero_account_list/monero_account_edit_o
 import 'package:cake_wallet/src/widgets/primary_button.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
-import 'package:cake_wallet/palette.dart';
 
 class MoneroAccountEditOrCreatePage extends BasePage {
   MoneroAccountEditOrCreatePage({@required this.moneroAccountCreationViewModel})
@@ -24,12 +23,6 @@ class MoneroAccountEditOrCreatePage extends BasePage {
   @override
   String get title => S.current.account;
 
-  @override
-  Color get backgroundLightColor => PaletteDark.backgroundColor;
-
-  @override
-  Color get backgroundDarkColor => PaletteDark.backgroundColor;
-
   final GlobalKey<FormState> _formKey;
   final TextEditingController _textController;
 
@@ -45,7 +38,6 @@ class MoneroAccountEditOrCreatePage extends BasePage {
                   child: Center(
                       child: BaseTextFormField(
                         controller: _textController,
-                        textColor: Colors.white,
                         hintText: S.of(context).account,
                         validator: MoneroLabelValidator(),
                       ))),

lib/src/screens/monero_accounts/monero_account_list_page.dart

@@ -64,7 +64,7 @@ class MoneroAccountListPage extends StatelessWidget {
                     borderRadius: BorderRadius.all(Radius.circular(14)),
                     child: Container(
                       height: 296,
-                      color: PaletteDark.deepPurpleBlue,
+                      color: Theme.of(context).textTheme.display4.decorationColor,
                       child: Column(
                         children: <Widget>[
                           Expanded(
@@ -83,7 +83,7 @@ class MoneroAccountListPage extends StatelessWidget {
                                           separatorBuilder: (context, index) =>
                                           Container(
                                             height: 1,
-                                            color: PaletteDark.dividerColor,
+                                            color: Theme.of(context).dividerColor,
                                           ),
                                           itemCount: accounts.length ?? 0,
                                           itemBuilder: (context, index) {
@@ -121,7 +121,7 @@ class MoneroAccountListPage extends StatelessWidget {
                                 .pushNamed(Routes.accountCreation),
                             child: Container(
                               height: 62,
-                              color: Colors.white,
+                              color: Theme.of(context).textTheme.subtitle.decorationColor,
                               padding: EdgeInsets.only(left: 24, right: 24),
                               child: Center(
                                 child: Row(
@@ -129,7 +129,7 @@ class MoneroAccountListPage extends StatelessWidget {
                                   children: <Widget>[
                                     Icon(
                                       Icons.add,
-                                      color: PaletteDark.darkNightBlue,
+                                      color: Colors.white,
                                     ),
                                     Padding(
                                       padding: EdgeInsets.only(left: 5),
@@ -138,7 +138,7 @@ class MoneroAccountListPage extends StatelessWidget {
                                         style: TextStyle(
                                           fontSize: 15,
                                           fontWeight: FontWeight.w600,
-                                          color: PaletteDark.darkNightBlue,
+                                          color: Colors.white,
                                           decoration: TextDecoration.none,
                                         ),
                                       ),

lib/src/screens/monero_accounts/widgets/account_tile.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 
 class AccountTile extends StatelessWidget {
   AccountTile({
@@ -14,8 +13,12 @@ class AccountTile extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final color = isCurrent ? PaletteDark.lightOceanBlue : Colors.transparent;
+    final color = isCurrent
-    final textColor = isCurrent ? Colors.blue : Colors.white;
+        ? Theme.of(context).textTheme.subtitle.decorationColor
+        : Theme.of(context).textTheme.display4.decorationColor;
+    final textColor = isCurrent
+        ? Theme.of(context).textTheme.subtitle.color
+        : Theme.of(context).textTheme.display4.color;
 
     return GestureDetector(
       onTap: onTap,

lib/src/screens/receive/receive_page.dart

@@ -14,7 +14,6 @@ import 'package:cake_wallet/view_model/wallet_address_list/wallet_address_list_h
 import 'package:cake_wallet/view_model/wallet_address_list/wallet_address_list_item.dart';
 import 'package:cake_wallet/view_model/wallet_address_list/wallet_address_list_view_model.dart';
 import 'package:cake_wallet/src/screens/receive/widgets/qr_widget.dart';
-import 'package:cake_wallet/palette.dart';
 
 class ReceivePage extends BasePage {
   ReceivePage({this.addressListViewModel});
@@ -25,10 +24,26 @@ class ReceivePage extends BasePage {
   String get title => S.current.receive;
 
   @override
-  Color get backgroundLightColor => PaletteDark.backgroundColor;
+  Color get backgroundLightColor => Colors.transparent;
 
   @override
-  Color get backgroundDarkColor => PaletteDark.backgroundColor;
+  Color get backgroundDarkColor => Colors.transparent;
+
+  @override
+  Color get titleColor => Colors.white;
+
+  @override
+  Widget Function(BuildContext, Widget) get rootWrapper =>
+          (BuildContext context, Widget scaffold) => Container(
+          decoration: BoxDecoration(
+              gradient: LinearGradient(colors: [
+                Theme.of(context).accentColor,
+                Theme.of(context).scaffoldBackgroundColor,
+                Theme.of(context).primaryColor,
+              ],
+                  begin: Alignment.topRight,
+                  end: Alignment.bottomLeft)),
+          child: scaffold);
 
   @override
   Widget trailing(BuildContext context) {
@@ -66,7 +81,9 @@ class ReceivePage extends BasePage {
           Observer(
               builder: (_) => ListView.separated(
                   separatorBuilder: (context, _) =>
-                      Container(height: 1, color: PaletteDark.dividerColor),
+                      Container(
+                          height: 1,
+                          color: Theme.of(context).dividerColor),
                   shrinkWrap: true,
                   physics: NeverScrollableScrollPhysics(),
                   itemCount: addressListViewModel.items.length,
@@ -83,7 +100,7 @@ class ReceivePage extends BasePage {
                           icon: Icon(
                             Icons.arrow_forward_ios,
                             size: 14,
-                            color: Colors.white,
+                            color: Theme.of(context).textTheme.display1.color,
                           ));
                     }
 
@@ -95,7 +112,7 @@ class ReceivePage extends BasePage {
                           icon: Icon(
                             Icons.add,
                             size: 20,
-                            color: Colors.white,
+                            color: Theme.of(context).textTheme.display1.color,
                           ));
                     }
 
@@ -105,11 +122,11 @@ class ReceivePage extends BasePage {
                             final isCurrent = item.address ==
                                 addressListViewModel.address.address;
                             final backgroundColor = isCurrent
-                                ? PaletteDark.lightOceanBlue
+                                ? Theme.of(context).textTheme.display3.decorationColor
-                                : PaletteDark.nightBlue;
+                                : Theme.of(context).textTheme.display2.decorationColor;
                             final textColor = isCurrent
-                                ? Colors.blue
+                                ? Theme.of(context).textTheme.display3.color
-                                : Colors.white;
+                                : Theme.of(context).textTheme.display2.color;
 
                             return AddressCell.fromItem(item,
                                 isCurrent: isCurrent,

lib/src/screens/receive/widgets/header_tile.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 
 class HeaderTile extends StatelessWidget {
   HeaderTile({
@@ -23,7 +22,7 @@ class HeaderTile extends StatelessWidget {
             top: 24,
             bottom: 24
         ),
-        color: PaletteDark.nightBlue,
+        color: Theme.of(context).textTheme.display2.decorationColor,
         child: Row(
           mainAxisSize: MainAxisSize.max,
           mainAxisAlignment: MainAxisAlignment.spaceBetween,
@@ -32,8 +31,8 @@ class HeaderTile extends StatelessWidget {
               title,
               style: TextStyle(
                   fontSize: 18,
-                  fontWeight: FontWeight.w500,
+                  fontWeight: FontWeight.w600,
-                  color: Colors.white
+                  color: Theme.of(context).textTheme.display2.color
               ),
             ),
             Container(
@@ -41,7 +40,7 @@ class HeaderTile extends StatelessWidget {
               width: 32,
               decoration: BoxDecoration(
                   shape: BoxShape.circle,
-                  color: PaletteDark.distantNightBlue
+                  color: Theme.of(context).textTheme.display1.decorationColor
               ),
               child: icon,
             )

lib/src/screens/receive/widgets/qr_widget.dart

@@ -7,7 +7,6 @@ import 'package:cake_wallet/src/screens/receive/widgets/qr_image.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
 import 'package:cake_wallet/core/amount_validator.dart';
 import 'package:cake_wallet/view_model/wallet_address_list/wallet_address_list_view_model.dart';
-import 'package:cake_wallet/palette.dart';
 
 class QRWidget extends StatelessWidget {
   QRWidget({
@@ -27,7 +26,7 @@ class QRWidget extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final copyImage = Image.asset('assets/images/copy_address.png',
-          color: PaletteDark.lightBlueGrey);
+          color: Theme.of(context).textTheme.subhead.decorationColor);
     final addressTopOffset = isAmountFieldShow ? 60.0 : 40.0;
 
     return Column(
@@ -45,7 +44,7 @@ class QRWidget extends StatelessWidget {
                   child: QrImage(
                     data: addressListViewModel.uri.toString(),
                     backgroundColor: Colors.transparent,
-                    foregroundColor: PaletteDark.lightBlueGrey,
+                    foregroundColor: Theme.of(context).textTheme.headline.color,
           ))))),
           Spacer(flex: 3)
         ]),
@@ -56,7 +55,7 @@ class QRWidget extends StatelessWidget {
             style: TextStyle(
               fontSize: 12,
               fontWeight: FontWeight.w500,
-              color: PaletteDark.cyanBlue
+              color: Theme.of(context).indicatorColor
             ),
           ),
         ),
@@ -79,14 +78,14 @@ class QRWidget extends StatelessWidget {
                           textAlign: TextAlign.center,
                           hintText: S.of(context).receive_amount,
                           textColor: Colors.white,
-                          borderColor: PaletteDark.darkGrey,
+                          borderColor: Theme.of(context).textTheme.headline.decorationColor,
                           validator: AmountValidator(
                             type: addressListViewModel.type,
                             isAutovalidate: true
                           ),
                           autovalidate: true,
                           placeholderTextStyle: TextStyle(
-                              color: PaletteDark.cyanBlue,
+                              color: Theme.of(context).hoverColor,
                               fontSize: 18,
                               fontWeight: FontWeight.w500))))
             ],

lib/src/screens/subaddress/address_edit_or_create_page.dart

@@ -8,7 +8,6 @@ import 'package:cake_wallet/core/address_label_validator.dart';
 import 'package:cake_wallet/src/widgets/primary_button.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
-import 'package:cake_wallet/palette.dart';
 
 class AddressEditOrCreatePage extends BasePage {
   AddressEditOrCreatePage({@required this.addressEditOrCreateViewModel})
@@ -29,12 +28,6 @@ class AddressEditOrCreatePage extends BasePage {
   @override
   String get title => S.current.new_subaddress_title;
 
-  @override
-  Color get backgroundLightColor => PaletteDark.backgroundColor;
-
-  @override
-  Color get backgroundDarkColor => PaletteDark.backgroundColor;
-
   @override
   Widget body(BuildContext context) {
     reaction((_) => addressEditOrCreateViewModel.state,
@@ -55,7 +48,6 @@ class AddressEditOrCreatePage extends BasePage {
                   child: Center(
                       child: BaseTextFormField(
                           controller: _labelController,
-                          textColor: Colors.white,
                           hintText: S.of(context).new_subaddress_label_name,
                           validator: AddressLabelValidator()))),
               Observer(

lib/src/screens/trade_details/trade_details_page.dart

@@ -24,7 +24,6 @@ class TradeDetailsPage extends BasePage {
           formatDefault: "dd.MM.yyyy, HH:mm");
 
     return Container(
-        padding: EdgeInsets.only(top: 20, bottom: 20),
         child: Observer(builder: (_) {
           final trade = exchangeStore.trade;
           final items = [
@@ -59,17 +58,15 @@ class TradeDetailsPage extends BasePage {
               separatorBuilder: (_, __) => Container(
                 height: 1,
                 padding: EdgeInsets.only(left: 24),
-                color: Theme.of(context).accentTextTheme.title.backgroundColor,
+                color: Theme.of(context).backgroundColor,
                 child: Container(
                   height: 1,
-                  color: Theme.of(context).dividerColor,
+                  color: Theme.of(context).primaryTextTheme.title.backgroundColor,
                 ),
               ),
               itemCount: items.length,
               itemBuilder: (BuildContext context, int index) {
                 final item = items[index];
-
-                final isDrawTop = index == 0 ? true : false;
                 final isDrawBottom = index == items.length - 1 ? true : false;
 
                 return GestureDetector(
@@ -87,7 +84,6 @@ class TradeDetailsPage extends BasePage {
                     child: StandartListRow(
                       title: '${item.title}',
                       value: '${item.value}',
-                      isDrawTop: isDrawTop,
                       isDrawBottom: isDrawBottom,
                     ));
               });

lib/src/screens/transaction_details/transaction_details_page.dart

@@ -69,22 +69,19 @@ class TransactionDetailsPage extends BasePage {
   @override
   Widget body(BuildContext context) {
     return Container(
-      padding: EdgeInsets.only(top: 20, bottom: 20),
       child: ListView.separated(
           separatorBuilder: (context, index) => Container(
                 height: 1,
                 padding: EdgeInsets.only(left: 24),
-                color: Theme.of(context).accentTextTheme.title.backgroundColor,
+                color: Theme.of(context).backgroundColor,
                 child: Container(
                   height: 1,
-                  color: Theme.of(context).dividerColor,
+                  color: Theme.of(context).primaryTextTheme.title.backgroundColor,
                 ),
               ),
           itemCount: _items.length,
           itemBuilder: (context, index) {
             final item = _items[index];
-
-            final isDrawTop = index == 0 ? true : false;
             final isDrawBottom = index == _items.length - 1 ? true : false;
 
             return GestureDetector(
@@ -102,7 +99,6 @@ class TransactionDetailsPage extends BasePage {
               child: StandartListRow(
                   title: '${item.title}:',
                   value: item.value,
-                  isDrawTop: isDrawTop,
                   isDrawBottom: isDrawBottom),
             );
           }),

lib/src/widgets/base_text_form_field.dart

@@ -64,21 +64,20 @@ class BaseTextFormField extends StatelessWidget {
           suffixIcon: suffixIcon,
           hintStyle: placeholderTextStyle ??
               TextStyle(
-                  color: hintColor ??
+                  color: hintColor ?? Theme.of(context).hintColor,
-                      Theme.of(context).primaryTextTheme.caption.color,
                   fontSize: 16),
           hintText: hintText,
           focusedBorder: UnderlineInputBorder(
               borderSide: BorderSide(
-                  color: borderColor ?? Theme.of(context).dividerColor,
+                  color: borderColor ?? Theme.of(context).primaryTextTheme.title.backgroundColor,
                   width: 1.0)),
           disabledBorder: UnderlineInputBorder(
               borderSide: BorderSide(
-                  color: borderColor ?? Theme.of(context).dividerColor,
+                  color: borderColor ?? Theme.of(context).primaryTextTheme.title.backgroundColor,
                   width: 1.0)),
           enabledBorder: UnderlineInputBorder(
               borderSide: BorderSide(
-                  color: borderColor ?? Theme.of(context).dividerColor,
+                  color: borderColor ?? Theme.of(context).primaryTextTheme.title.backgroundColor,
                   width: 1.0))),
       validator: validator,
     );

lib/src/widgets/cake_scrollbar.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 
 class CakeScrollbar extends StatelessWidget {
   CakeScrollbar({
@@ -20,7 +19,7 @@ class CakeScrollbar extends StatelessWidget {
           height: backgroundHeight,
           width: 6,
           decoration: BoxDecoration(
-            color: PaletteDark.violetBlue,
+            color: Theme.of(context).textTheme.body1.decorationColor,
             borderRadius: BorderRadius.all(Radius.circular(3))
           ),
           child: Stack(
@@ -32,7 +31,7 @@ class CakeScrollbar extends StatelessWidget {
                   height: thumbHeight,
                   width: 6.0,
                   decoration: BoxDecoration(
-                    color: PaletteDark.wildBlueGrey,
+                    color: Theme.of(context).textTheme.body1.color,
                     borderRadius: BorderRadius.all(Radius.circular(3))
                   ),
                 ),

lib/src/widgets/primary_button.dart

@@ -1,6 +1,5 @@
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:cake_wallet/palette.dart';
 
 class PrimaryButton extends StatelessWidget {
   const PrimaryButton(
@@ -38,7 +37,7 @@ class PrimaryButton extends StatelessWidget {
                   fontSize: 15.0,
                   fontWeight: FontWeight.w600,
                   color: isDisabled
-                      ? Colors.grey.withOpacity(0.5)
+                      ? textColor.withOpacity(0.5)
                       : textColor)),
         ));
   }
@@ -78,7 +77,7 @@ class LoadingPrimaryButton extends StatelessWidget {
                   fontSize: 15.0,
                   fontWeight: FontWeight.w600,
                   color: isDisabled
-                      ? Colors.grey.withOpacity(0.5)
+                      ? textColor.withOpacity(0.5)
                       : textColor
               )),
         ));

lib/src/widgets/standart_list_row.dart

@@ -4,28 +4,19 @@ class StandartListRow extends StatelessWidget {
   StandartListRow(
       {this.title,
       this.value,
-      this.isDrawTop = false,
       this.isDrawBottom = false});
 
   final String title;
   final String value;
-  final bool isDrawTop;
   final bool isDrawBottom;
 
   @override
   Widget build(BuildContext context) {
     return Column(
       children: <Widget>[
-        isDrawTop
-            ? Container(
-                width: double.infinity,
-                height: 1,
-                color: Theme.of(context).dividerColor,
-              )
-            : Offstage(),
         Container(
           width: double.infinity,
-          color: Theme.of(context).accentTextTheme.title.backgroundColor,
+          color: Theme.of(context).backgroundColor,
           child: Padding(
             padding:
                 const EdgeInsets.only(left: 24, top: 16, bottom: 16, right: 24),
@@ -35,9 +26,9 @@ class StandartListRow extends StatelessWidget {
                   Text(title,
                       style: TextStyle(
                           fontSize: 14,
-                          fontWeight: FontWeight.w600,
+                          fontWeight: FontWeight.w500,
                           color:
-                              Theme.of(context).primaryTextTheme.caption.color),
+                              Theme.of(context).primaryTextTheme.overline.color),
                       textAlign: TextAlign.left),
                   Padding(
                     padding: const EdgeInsets.only(top: 12),
@@ -54,12 +45,16 @@ class StandartListRow extends StatelessWidget {
           ),
         ),
         isDrawBottom
-            ? Container(
+        ? Container(
-                width: double.infinity,
+          height: 1,
-                height: 1,
+          padding: EdgeInsets.only(left: 24),
-                color: Theme.of(context).dividerColor,
+          color: Theme.of(context).backgroundColor,
-              )
+          child: Container(
-            : Offstage(),
+            height: 1,
+            color: Theme.of(context).primaryTextTheme.title.backgroundColor,
+          ),
+        )
+        : Offstage(),
       ],
     );
   }

lib/themes.dart

@@ -7,47 +7,113 @@ class Themes {
     fontFamily: 'Poppins',
     brightness: Brightness.light,
     backgroundColor: Colors.white,
-    focusColor: Colors.white, // wallet card border
+    accentColor: Palette.blueCraiola, // first gradient color
-    hintColor: Colors.white, // menu
+    scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color
-    scaffoldBackgroundColor: Palette.blueAlice, // gradient background start
+    primaryColor: Palette.redHat, // third gradient color
-    primaryColor: Palette.lightBlue, // gradient background end
+    buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page
-    cardColor: Palette.blueAlice,
+    indicatorColor: Colors.white.withOpacity(0.5), // page indicator
-    cardTheme: CardTheme(
+    hoverColor: Colors.white, // amount hint text (receive page)
-      color: Colors.white, // synced card start
+    dividerColor: Palette.paleBlue,
+    hintColor: Palette.gray,
+    textTheme: TextTheme(
+      title: TextStyle(
+        color: Colors.white, // sync_indicator text
+        backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator
+        decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator
+      ),
+      caption: TextStyle(
+        color: Palette.shineOrange, // not synced light
+        decorationColor: Colors.white, // filter icon
+      ),
+      overline: TextStyle(
+        color: Colors.white.withOpacity(0.2), // filter button
+        backgroundColor: Colors.white.withOpacity(0.5), // date section row
+        decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows)
+      ),
+      subhead: TextStyle(
+        color: Colors.white.withOpacity(0.2), // address button border
+        decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget)
+      ),
+      headline: TextStyle(
+        color: Colors.white, // qr code
+        decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page)
+      ),
+      display1: TextStyle(
+        color: PaletteDark.lightBlueGrey, // icons color (receive page)
+        decorationColor: Palette.lavender, // icons background (receive page)
+      ),
+      display2: TextStyle(
+        color: Palette.darkBlueCraiola, // text color of tiles (receive page)
+        decorationColor: Colors.white // background of tiles (receive page)
+      ),
+      display3: TextStyle(
+        color: Colors.white, // text color of current tile (receive page),
+        decorationColor: Palette.blueCraiola // background of current tile (receive page)
+      ),
+      display4: TextStyle(
+        color: Palette.violetBlue, // text color of tiles (account list)
+        decorationColor: Colors.white // background of tiles (account list)
+      ),
+      subtitle: TextStyle(
+        color: Colors.white, // text color of current tile (account list)
+        decorationColor: Palette.blueCraiola // background of current tile (account list)
+      ),
+      body1: TextStyle(
+        color: Palette.moderatePurpleBlue, // scrollbar thumb
+        decorationColor: Palette.periwinkleCraiola // scrollbar background
+      ),
+      body2: TextStyle(
+        color: Palette.moderateLavender, // menu header
+        decorationColor: Colors.white, // menu background
+      )
     ),
-    hoverColor: Colors.white, // synced card end
     primaryTextTheme: TextTheme(
       title: TextStyle(
-        color: Palette.oceanBlue, // primary text
+        color: Palette.darkBlueCraiola, // title color
-        backgroundColor: Colors.white // selectButton text
+        backgroundColor: Palette.wildPeriwinkle // textfield underline
       ),
       caption: TextStyle(
-        color: Palette.lightBlueGrey, // secondary text
+        color: PaletteDark.pigeonBlue, // secondary text
+        decorationColor: Palette.wildLavender // menu divider
       ),
       overline: TextStyle(
-        color: Palette.lavender // address field in the wallet card
+        color: Palette.darkGray, // transaction/trade details titles
+        decorationColor: Colors.white.withOpacity(0.5), // placeholder
       ),
+
+
+
+
       subhead: TextStyle(
-        color: Colors.white.withOpacity(0.5) // send, exchange, buy buttons on dashboard page
+          color: Colors.white.withOpacity(0.5) // send, exchange, buy buttons on dashboard page
       ),
       headline: TextStyle(
-        color: Palette.lightBlueGrey // historyPanelText
+          color: Palette.lightBlueGrey // historyPanelText
       ),
       display1: TextStyle(
-        color: Colors.white // menuList
+          color: Colors.white // menuList
       ),
       display2: TextStyle(
-        color: Palette.lavender // menuHeader
+          color: Palette.lavender // menuHeader
       ),
       display3: TextStyle(
-        color: Palette.lavender // historyPanelButton
+          color: Palette.lavender // historyPanelButton
       ),
       display4: TextStyle(
-        color: Palette.oceanBlue // QR code
+          color: Palette.oceanBlue // QR code
       ),
-//      headline1: TextStyle(color: Palette.nightBlue)
     ),
-    dividerColor: Palette.eee,
+
+
+
+    focusColor: Colors.white, // wallet card border
+
+    cardColor: Palette.blueAlice,
+    cardTheme: CardTheme(
+      color: Colors.white, // synced card start
+    ),
+
+
     accentTextTheme: TextTheme(
       title: TextStyle(
         color: Palette.darkLavender, // top panel
@@ -75,48 +141,113 @@ class Themes {
   static final ThemeData darkTheme = ThemeData(
     fontFamily: 'Poppins',
     brightness: Brightness.dark,
-    backgroundColor: PaletteDark.darkNightBlue,
+    backgroundColor: PaletteDark.backgroundColor,
-    focusColor: PaletteDark.lightDistantBlue, // wallet card border
+    accentColor: PaletteDark.backgroundColor, // first gradient color
-    hintColor: PaletteDark.gray, // menu
+    scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color
-    scaffoldBackgroundColor: PaletteDark.distantBlue, // gradient background start
+    primaryColor: PaletteDark.backgroundColor, // third gradient color
-    primaryColor: PaletteDark.distantBlue, // gradient background end
+    buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page
-    cardColor: PaletteDark.darkNightBlue,
+    indicatorColor: PaletteDark.cyanBlue, // page indicator
-    cardTheme: CardTheme(
+    hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page)
-      color: PaletteDark.moderateBlue, // synced card start
+    dividerColor: PaletteDark.dividerColor,
+    hintColor: PaletteDark.pigeonBlue, // menu
+    textTheme: TextTheme(
+      title: TextStyle(
+        color: PaletteDark.wildBlue, // sync_indicator text
+        backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator
+        decorationColor: PaletteDark.oceanBlue // not synced sync_indicator
+      ),
+      caption: TextStyle(
+        color: PaletteDark.orangeYellow, // not synced light
+        decorationColor: PaletteDark.wildBlue, // filter icon
+      ),
+      overline: TextStyle(
+        color: PaletteDark.oceanBlue, // filter button
+        backgroundColor: PaletteDark.darkCyanBlue, // date section row
+        decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows)
+      ),
+      subhead: TextStyle(
+        color: PaletteDark.nightBlue, // address button border
+        decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget)
+      ),
+      headline: TextStyle(
+        color: PaletteDark.lightBlueGrey, // qr code
+        decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page)
+      ),
+      display1: TextStyle(
+        color: Colors.white, // icons color (receive page)
+        decorationColor: PaletteDark.distantNightBlue, // icons background (receive page)
+      ),
+      display2: TextStyle(
+        color: Colors.white, // text color of tiles (receive page)
+        decorationColor: PaletteDark.nightBlue // background of tiles (receive page)
+      ),
+      display3: TextStyle(
+        color: Colors.blue, // text color of current tile (receive page)
+        decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page)
+      ),
+      display4: TextStyle(
+        color: Colors.white, // text color of tiles (account list)
+        decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list)
+      ),
+      subtitle: TextStyle(
+        color: Palette.blueCraiola, // text color of current tile (account list)
+        decorationColor: PaletteDark.darkNightBlue // background of current tile (account list)
+      ),
+      body1: TextStyle(
+        color: PaletteDark.wildBlueGrey, // scrollbar thumb
+        decorationColor: PaletteDark.violetBlue // scrollbar background
+      ),
+      body2: TextStyle(
+        color: PaletteDark.deepPurpleBlue, // menu header
+        decorationColor: PaletteDark.deepPurpleBlue, // menu background
+      )
     ),
-    hoverColor: PaletteDark.nightBlue, // synced card end
     primaryTextTheme: TextTheme(
       title: TextStyle(
-        color: Colors.white,
+        color: Colors.white, // title color
-        backgroundColor: PaletteDark.moderatePurpleBlue // selectButton text
+        backgroundColor: PaletteDark.darkOceanBlue // textfield underline
       ),
       caption: TextStyle(
-        color: PaletteDark.gray,
+        color: PaletteDark.darkCyanBlue, // secondary text
+        decorationColor: PaletteDark.darkOceanBlue // menu divider
       ),
       overline: TextStyle(
-        color: PaletteDark.lightDistantBlue // address field in the wallet card
+        color: PaletteDark.lightBlueGrey, // transaction/trade details titles
+        decorationColor: Colors.grey, // placeholder
       ),
+
+
+
       subhead: TextStyle(
-        color: PaletteDark.lightDistantBlue // send, exchange, buy buttons on dashboard page
+          color: PaletteDark.lightDistantBlue // send, exchange, buy buttons on dashboard page
       ),
       headline: TextStyle(
-        color: PaletteDark.pigeonBlue // historyPanelText
+          color: PaletteDark.pigeonBlue // historyPanelText
       ),
       display1: TextStyle(
-        color: PaletteDark.lightNightBlue // menuList
+          color: PaletteDark.lightNightBlue // menuList
       ),
       display2: TextStyle(
-        color: PaletteDark.headerNightBlue // menuHeader
+          color: PaletteDark.headerNightBlue // menuHeader
       ),
       display3: TextStyle(
-        color: PaletteDark.moderateNightBlue // historyPanelButton
+          color: PaletteDark.moderateNightBlue // historyPanelButton
       ),
       display4: TextStyle(
-        color: PaletteDark.gray // QR code
+          color: PaletteDark.gray // QR code
       ),
-//        headline5: TextStyle(color: PaletteDark.gray)
     ),
-    dividerColor: PaletteDark.distantBlue,
+
+
+
+    focusColor: PaletteDark.lightDistantBlue, // wallet card border
+    cardColor: PaletteDark.darkNightBlue,
+    cardTheme: CardTheme(
+      color: PaletteDark.moderateBlue, // synced card start
+    ),
+
+
+
     accentTextTheme: TextTheme(
       title: TextStyle(
         color: PaletteDark.moderateBlue, // top panel