Merge pull request #51 from cake-tech/CWA-201-update-wallet-menu-screen

Cwa 201 update wallet menu screen

lib/palette.dart

@@ -89,5 +89,4 @@ class PaletteDark {
   static const Color historyPanelButton = Color.fromRGBO(39, 53, 96, 1.0);
   static const Color menuHeader = Color.fromRGBO(41, 52, 84, 1.0);
   static const Color menuList = Color.fromRGBO(48, 59, 95, 1.0);
-  static const Color menuDivider = Color.fromRGBO(48, 59, 95, 1.0);
 }

lib/src/screens/address_book/contact_page.dart

@@ -195,8 +195,8 @@ class ContactFormState extends State<ContactForm> {
                   text: S.of(context).reset,
                   color:
                       Theme.of(context).accentTextTheme.button.backgroundColor,
-                  borderColor:
-                      Theme.of(context).accentTextTheme.button.decorationColor),
+                  textColor:
+                      Theme.of(context).primaryTextTheme.button.color),
             ),
             SizedBox(width: 20),
             Expanded(
@@ -248,10 +248,10 @@ class ContactFormState extends State<ContactForm> {
                         .primaryTextTheme
                         .button
                         .backgroundColor,
-                    borderColor: Theme.of(context)
+                    textColor: Theme.of(context)
                         .primaryTextTheme
                         .button
-                        .decorationColor))
+                        .color))
           ],
         ));
   }

lib/src/screens/base_page.dart

@@ -31,13 +31,16 @@ abstract class BasePage extends StatelessWidget {
     final _themeChanger = Provider.of<ThemeChanger>(context);
     Image _closeButton, _backButton;
 
-    if (_themeChanger.getTheme() == Themes.darkTheme) {
+    _backButton = _backArrowImageDarkTheme;
+    _closeButton = _closeButtonImageDarkTheme;
+
+    /*if (_themeChanger.getTheme() == Themes.darkTheme) {
       _backButton = _backArrowImageDarkTheme;
       _closeButton = _closeButtonImageDarkTheme;
     } else {
       _backButton = _backArrowImage;
       _closeButton = _closeButtonImage;
-    }
+    }*/
 
     return SizedBox(
       height: 37,
@@ -60,9 +63,10 @@ abstract class BasePage extends StatelessWidget {
         : Text(
             title,
             style: TextStyle(
-                fontSize: 16.0,
-                fontWeight: FontWeight.w600,
-                color: Theme.of(context).primaryTextTheme.title.color),
+                fontSize: 22.0,
+                fontWeight: FontWeight.bold,
+                color: Colors.white),
+                //color: Theme.of(context).primaryTextTheme.title.color),
           );
   }
 

lib/src/screens/dashboard/wallet_menu.dart

@@ -4,6 +4,7 @@ import 'package:provider/provider.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/src/stores/wallet/wallet_store.dart';
 import 'package:cake_wallet/src/screens/auth/auth_page.dart';
+import 'package:cake_wallet/src/screens/dashboard/widgets/reconnect_alert_dialog.dart';
 
 class WalletMenu {
   WalletMenu(this.context);
@@ -74,7 +75,19 @@ class WalletMenu {
     await showDialog<void>(
         context: context,
         builder: (BuildContext context) {
-          return AlertDialog(
+          return ReconnectAlertDialog(
+            reconnectTitleText: S.of(context).reconnection,
+            reconnectContentText: S.of(context).reconnect_alert_text,
+            reconnectLeftActionButtonText: S.of(context).ok,
+            reconnectRightActionButtonText: S.of(context).cancel,
+            reconnectActionLeft: () {
+              walletStore.reconnect();
+              Navigator.of(context).pop();
+            },
+            reconnectActionRight: () => Navigator.of(context).pop()
+          );
+
+            /*AlertDialog(
             title: Text(
               S.of(context).reconnection,
               textAlign: TextAlign.center,
@@ -91,7 +104,7 @@ class WalletMenu {
                   },
                   child: Text(S.of(context).ok))
             ],
-          );
+          );*/
         });
   }
 }

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

@@ -0,0 +1,34 @@
+import 'dart:ui';
+import 'package:cake_wallet/src/widgets/base_alert_dialog.dart';
+import 'package:flutter/cupertino.dart';
+
+class ReconnectAlertDialog extends BaseAlertDialog {
+  ReconnectAlertDialog({
+    @required this.reconnectTitleText,
+    @required this.reconnectContentText,
+    @required this.reconnectLeftActionButtonText,
+    @required this.reconnectRightActionButtonText,
+    @required this.reconnectActionLeft,
+    @required this.reconnectActionRight
+  });
+
+  final String reconnectTitleText;
+  final String reconnectContentText;
+  final String reconnectLeftActionButtonText;
+  final String reconnectRightActionButtonText;
+  final VoidCallback reconnectActionLeft;
+  final VoidCallback reconnectActionRight;
+
+  @override
+  String get titleText => reconnectTitleText;
+  @override
+  String get contentText => reconnectContentText;
+  @override
+  String get leftActionButtonText => reconnectLeftActionButtonText;
+  @override
+  String get rightActionButtonText => reconnectRightActionButtonText;
+  @override
+  VoidCallback get actionLeft => reconnectActionLeft;
+  @override
+  VoidCallback get actionRight => reconnectActionRight;
+}

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

@@ -98,7 +98,7 @@ class TradeHistoryPanelState extends State<TradeHistoryPanel> {
                         }
 
                         if (item is TransactionListItem) {
-                          freeSpaceHeight -= 58;
+                          freeSpaceHeight -= 62;
                           final transaction = item.transaction;
                           final savedDisplayMode = settingsStore.balanceDisplayMode;
                           final formattedAmount =
@@ -123,7 +123,7 @@ class TradeHistoryPanelState extends State<TradeHistoryPanel> {
                         }
 
                         if (item is TradeListItem) {
-                          freeSpaceHeight -= 58;
+                          freeSpaceHeight -= 62;
                           final trade = item.trade;
                           final savedDisplayMode = settingsStore.balanceDisplayMode;
                           final formattedAmount = trade.amount != null

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

@@ -26,7 +26,7 @@ class TradeRow extends StatelessWidget {
     return InkWell(
         onTap: onTap,
         child: Container(
-          height: 56,
+          height: 60,
           decoration: BoxDecoration(
             color: PaletteDark.historyPanel,
             border: Border.all(

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

@@ -24,7 +24,7 @@ class TransactionRow extends StatelessWidget {
     return InkWell(
         onTap: onTap,
         child: Container(
-          height: 56,
+          height: 60,
           decoration: BoxDecoration(
             color: PaletteDark.historyPanel,
             border: Border.all(

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

@@ -361,7 +361,7 @@ class WalletCardState extends State<WalletCard> {
                       children: <Widget>[
                         Expanded(
                           child: Container(
-                            height: 84,
+                            height: 90,
                             child: Column(
                               mainAxisAlignment: MainAxisAlignment.spaceBetween,
                               crossAxisAlignment: CrossAxisAlignment.start,
@@ -406,8 +406,8 @@ class WalletCardState extends State<WalletCard> {
                         ),
                         SizedBox(width: 10),
                         Container(
-                          width: 84,
-                          height: 84,
+                          width: 90,
+                          height: 90,
                           child: QrImage(
                             data: walletStore.subaddress.address,
                             backgroundColor: Colors.transparent,

lib/src/screens/disclaimer/disclaimer_page.dart

@@ -311,10 +311,10 @@ class DisclaimerBodyState extends State<DisclaimerPageBody> {
                         .primaryTextTheme
                         .button
                         .backgroundColor,
-                    borderColor: Theme.of(context)
+                    textColor: Theme.of(context)
                         .primaryTextTheme
                         .button
-                        .decorationColor,
+                        .color,
                   ),
                 )
               : Offstage(),

lib/src/screens/exchange_trade/exchange_confirm_page.dart

@@ -69,10 +69,10 @@ class ExchangeConfirmPage extends BasePage {
                               .accentTextTheme
                               .caption
                               .backgroundColor,
-                          borderColor: Theme.of(context)
-                              .accentTextTheme
-                              .caption
-                              .decorationColor)
+                          textColor: Theme.of(context)
+                              .primaryTextTheme
+                              .button
+                              .color)
                     ],
                   ),
                 ))),
@@ -83,8 +83,8 @@ class ExchangeConfirmPage extends BasePage {
                   .pushReplacementNamed(Routes.exchangeTrade, arguments: trade),
               text: S.of(context).saved_the_trade_id,
               color: Theme.of(context).primaryTextTheme.button.backgroundColor,
-              borderColor:
-                  Theme.of(context).primaryTextTheme.button.decorationColor),
+              textColor:
+                     Theme.of(context).primaryTextTheme.button.color),
         )
       ],
     );

lib/src/screens/nodes/new_node_page.dart

@@ -173,10 +173,10 @@ class NewNodeFormState extends State<NewNodePageForm> {
                             .accentTextTheme
                             .button
                             .backgroundColor,
-                        borderColor: Theme.of(context)
-                            .accentTextTheme
+                        textColor: Theme.of(context)
+                            .primaryTextTheme
                             .button
-                            .decorationColor),
+                            .color),
                   )),
                   Flexible(
                       child: Container(
@@ -200,10 +200,10 @@ class NewNodeFormState extends State<NewNodePageForm> {
                           .primaryTextTheme
                           .button
                           .backgroundColor,
-                      borderColor: Theme.of(context)
+                      textColor: Theme.of(context)
                           .primaryTextTheme
                           .button
-                          .decorationColor,
+                          .color,
                     ),
                   )),
                 ],

lib/src/screens/seed/seed_page.dart

@@ -9,14 +9,15 @@ import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/src/widgets/primary_button.dart';
 import 'package:cake_wallet/src/stores/wallet_seed/wallet_seed_store.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
+import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
 
 class SeedPage extends BasePage {
   SeedPage({this.onCloseCallback});
 
-  static final image = Image.asset('assets/images/seed_image.png');
+  static final image = Image.asset('assets/images/crypto_lock.png');
 
   @override
-  bool get isModalBackButton => true;
+  Color get backgroundColor => PaletteDark.historyPanel;
 
   @override
   String get title => S.current.seed_title;
@@ -32,135 +33,132 @@ class SeedPage extends BasePage {
     return onCloseCallback != null ? Offstage() : super.leading(context);
   }
 
+  @override
+  Widget trailing(BuildContext context) {
+    return onCloseCallback != null
+        ? GestureDetector(
+          onTap: () => onClose(context),
+          child: Container(
+            width: 70,
+            height: 32,
+            decoration: BoxDecoration(
+              borderRadius: BorderRadius.all(Radius.circular(16)),
+              color: PaletteDark.menuList
+            ),
+            child: Text(
+              S.of(context).seed_language_next,
+              style: TextStyle(
+                fontSize: 14,
+                fontWeight: FontWeight.w600,
+                color: Colors.blue
+              ),
+            ),
+          ),
+        )
+        : Offstage();
+  }
+
   @override
   Widget body(BuildContext context) {
     final walletSeedStore = Provider.of<WalletSeedStore>(context);
     String _seed;
 
     return Container(
-      padding: EdgeInsets.all(30.0),
-      child: Column(
-        children: <Widget>[
-          Expanded(
-            child: Center(
-              child: Column(
-                mainAxisSize: MainAxisSize.min,
-                children: <Widget>[
-                  image,
-                  Container(
-                    margin: EdgeInsets.only(left: 30.0, top: 10.0, right: 30.0),
-                    child: Observer(builder: (_) {
-                      _seed = walletSeedStore.seed;
-                      return Column(
-                        children: <Widget>[
-                          Row(
-                            children: <Widget>[
-                              Expanded(
-                                  child: Container(
-                                decoration: BoxDecoration(
-                                    border: Border(
-                                        bottom: BorderSide(
-                                            width: 1.0,
-                                            color: Theme.of(context)
-                                                .dividerColor))),
-                                padding: EdgeInsets.only(bottom: 20.0),
-                                margin: EdgeInsets.only(bottom: 10.0),
-                                child: Text(
-                                  walletSeedStore.name,
-                                  textAlign: TextAlign.center,
-                                  style: TextStyle(
-                                      fontSize: 18.0,
-                                      color: Theme.of(context)
-                                          .primaryTextTheme
-                                          .button
-                                          .color),
-                                ),
-                              ))
-                            ],
-                          ),
-                          SizedBox(
-                            height: 10.0,
-                          ),
-                          Text(
-                            walletSeedStore.seed,
-                            textAlign: TextAlign.center,
-                            style: TextStyle(
-                                fontSize: 14.0,
-                                color: Theme.of(context)
-                                    .primaryTextTheme
-                                    .title
-                                    .color),
-                          )
-                        ],
-                      );
-                    }),
-                  ),
-                  Container(
-                    margin: EdgeInsets.only(top: 30.0),
-                    child: Row(
-                      children: <Widget>[
-                        Flexible(
-                            child: Container(
-                          padding: EdgeInsets.only(right: 8.0),
-                          child: PrimaryButton(
-                              onPressed: () => Share.text(
-                                  S.of(context).seed_share,
-                                  _seed,
-                                  'text/plain'),
-                              color: Theme.of(context)
-                                  .primaryTextTheme
-                                  .button
-                                  .backgroundColor,
-                              borderColor: Theme.of(context)
-                                  .primaryTextTheme
-                                  .button
-                                  .decorationColor,
-                              text: S.of(context).save),
-                        )),
-                        Flexible(
-                            child: Container(
-                                padding: EdgeInsets.only(left: 8.0),
-                                child: Builder(
-                                  builder: (context) => PrimaryButton(
-                                      onPressed: () {
-                                        Clipboard.setData(
-                                            ClipboardData(text: _seed));
-                                        Scaffold.of(context).showSnackBar(
-                                          SnackBar(
-                                            content: Text(S
-                                                .of(context)
-                                                .copied_to_clipboard),
-                                            backgroundColor: Colors.green,
-                                            duration:
-                                                Duration(milliseconds: 1500),
-                                          ),
-                                        );
-                                      },
-                                      text: S.of(context).copy,
-                                      color: Theme.of(context)
-                                          .accentTextTheme
-                                          .caption
-                                          .backgroundColor,
-                                      borderColor: Theme.of(context)
-                                          .accentTextTheme
-                                          .caption
-                                          .decorationColor),
-                                )))
-                      ],
-                    ),
-                  )
-                ],
-              ),
+      width: double.infinity,
+      height: double.infinity,
+      color: PaletteDark.historyPanel,
+      child: ScrollableWithBottomSection(
+        contentPadding: EdgeInsets.only(left: 40, right: 40, bottom: 20),
+        content: Column(
+          children: <Widget>[
+            Padding(
+              padding: EdgeInsets.only(top: 33),
+              child: image,
             ),
+            Padding(
+              padding: EdgeInsets.only(top: 33),
+              child: Observer(
+                builder: (_) {
+                  _seed = walletSeedStore.seed;
+
+                  return Column(
+                    crossAxisAlignment: CrossAxisAlignment.center,
+                    children: <Widget>[
+                      Text(
+                        walletSeedStore.name,
+                        style: TextStyle(
+                          fontSize: 20,
+                          fontWeight: FontWeight.bold,
+                          color: Colors.white
+                        ),
+                      ),
+                      Padding(
+                        padding: EdgeInsets.only(top: 20),
+                        child: Text(
+                          _seed,
+                          textAlign: TextAlign.center,
+                          style: TextStyle(
+                            fontSize: 14,
+                            color: PaletteDark.walletCardText
+                          ),
+                        ),
+                      )
+                    ],
+                  );
+                }
+              ),
+            )
+          ],
+        ),
+        bottomSectionPadding: EdgeInsets.only(
+          left: 24,
+          right: 24,
+          bottom: 52
+        ),
+        bottomSection: Container(
+          child: Row(
+            mainAxisSize: MainAxisSize.max,
+            children: <Widget>[
+              Flexible(
+                child: Container(
+                  padding: EdgeInsets.only(right: 8.0),
+                  child: PrimaryButton(
+                    onPressed: () => Share.text(
+                        S.of(context).seed_share,
+                        _seed,
+                        'text/plain'),
+                    text: S.of(context).save,
+                    color: Colors.green,
+                    textColor: Colors.white),
+                )
+              ),
+              Flexible(
+                child: Container(
+                  padding: EdgeInsets.only(left: 8.0),
+                  child: Builder(
+                    builder: (context) => PrimaryButton(
+                        onPressed: () {
+                          Clipboard.setData(
+                              ClipboardData(text: _seed));
+                          Scaffold.of(context).showSnackBar(
+                            SnackBar(
+                              content: Text(S
+                                  .of(context)
+                                  .copied_to_clipboard),
+                              backgroundColor: Colors.green,
+                              duration: Duration(milliseconds: 1500),
+                            ),
+                          );
+                        },
+                        text: S.of(context).copy,
+                        color: Colors.blue,
+                        textColor: Colors.white)
+                  ),
+                )
+              )
+            ],
           ),
-          onCloseCallback != null
-              ? PrimaryButton(
-                  onPressed: () => onClose(context),
-                  text: S.of(context).restore_next,
-                  color: Palette.darkGrey,
-                  borderColor: Palette.darkGrey)
-              : Offstage()
-        ],
+        ),
       ),
     );
   }

lib/src/screens/seed_language/seed_language_page.dart

@@ -43,8 +43,8 @@ class SeedLanguage extends BasePage {
               text: S.of(context).seed_language_next,
               color:
               Theme.of(context).primaryTextTheme.button.backgroundColor,
-              borderColor:
-              Theme.of(context).primaryTextTheme.button.decorationColor),
+              textColor:
+              Theme.of(context).primaryTextTheme.button.color),
         ],
       ),
     );

lib/src/screens/wallet_list/wallet_list_page.dart

@@ -6,22 +6,17 @@ import 'package:cake_wallet/routes.dart';
 import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/src/widgets/primary_button.dart';
-import 'package:cake_wallet/src/domain/common/wallet_description.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
 import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
 import 'package:cake_wallet/src/stores/wallet_list/wallet_list_store.dart';
+import 'package:cake_wallet/src/stores/wallet/wallet_store.dart';
 import 'package:cake_wallet/src/screens/wallet_list/wallet_menu.dart';
-import 'package:cake_wallet/src/widgets/picker.dart';
+import 'package:cake_wallet/src/screens/wallet_list/widgets/wallet_tile.dart';
 
 class WalletListPage extends BasePage {
-  @override
-  bool get isModalBackButton => true;
 
   @override
-  String get title => S.current.wallet_list_title;
-
-  @override
-  AppBarStyle get appBarStyle => AppBarStyle.withShadow;
+  Color get backgroundColor => PaletteDark.historyPanel;
 
   @override
   Widget body(BuildContext context) => WalletListBody();
@@ -33,92 +28,145 @@ class WalletListBody extends StatefulWidget {
 }
 
 class WalletListBodyState extends State<WalletListBody> {
+  final moneroIcon = Image.asset('assets/images/monero.png', height: 24, width: 24);
+  final newWalletImage = Image.asset('assets/images/new_wallet.png', height: 12, width: 12, color: PaletteDark.historyPanel);
+  final restoreWalletImage = Image.asset('assets/images/restore_wallet.png', height: 12, width: 12, color: Colors.white);
   WalletListStore _walletListStore;
-
-  void presetMenuForWallet(WalletDescription wallet, bool isCurrentWallet,
-      BuildContext bodyContext) {
-    final walletMenu = WalletMenu(bodyContext);
-    final items = walletMenu.generateItemsForWalletMenu(isCurrentWallet);
-
-    showDialog<void>(
-      context: bodyContext,
-      builder: (_) => Picker(
-          items: items,
-          selectedAtIndex: -1,
-          title: S.of(context).wallet_menu,
-          onItemSelected: (String item) => walletMenu.action(
-              walletMenu.listItems.indexOf(item), wallet, isCurrentWallet)),
-    );
-  }
+  ScrollController scrollController = ScrollController();
 
   @override
   Widget build(BuildContext context) {
+    final walletStore = Provider.of<WalletStore>(context);
     _walletListStore = Provider.of<WalletListStore>(context);
 
-    return ScrollableWithBottomSection(
-        content: Container(
-          padding: EdgeInsets.all(20),
-          child: Observer(
-            builder: (_) => ListView.separated(
-                shrinkWrap: true,
-                physics: const NeverScrollableScrollPhysics(),
-                separatorBuilder: (_, index) => Divider(
-                    color: Theme.of(context).dividerTheme.color, height: 1.0),
-                itemCount: _walletListStore.wallets.length,
-                itemBuilder: (__, index) {
-                  final wallet = _walletListStore.wallets[index];
-                  final isCurrentWallet =
+    return SafeArea(
+      child: Container(
+        padding: EdgeInsets.only(top: 16),
+        color: PaletteDark.historyPanel,
+        child: ScrollableWithBottomSection(
+            contentPadding: EdgeInsets.only(bottom: 20),
+            content: Container(
+              child: Observer(
+                builder: (_) => ListView.separated(
+                    shrinkWrap: true,
+                    physics: const NeverScrollableScrollPhysics(),
+                    separatorBuilder: (_, index) => Divider(
+                        color: PaletteDark.historyPanel, height: 16),
+                    itemCount: _walletListStore.wallets.length,
+                    itemBuilder: (__, index) {
+                      final wallet = _walletListStore.wallets[index];
+                      final screenWidth = MediaQuery.of(context).size.width;
+
+                      final isCurrentWallet =
                       _walletListStore.isCurrentWallet(wallet);
 
-                  return InkWell(
-                      onTap: () =>
-                          presetMenuForWallet(wallet, isCurrentWallet, context),
-                      child: Container(
-                          padding: EdgeInsets.only(left: 10.0, right: 10.0),
-                          child: ListTile(
-                              title: Text(
-                                wallet.name,
-                                style: TextStyle(
-                                    color: isCurrentWallet
-                                        ? Palette.cakeGreen
-                                        : Theme.of(context)
-                                            .primaryTextTheme
-                                            .headline
-                                            .color,
-                                    fontSize: 18.0,
-                                    fontWeight: FontWeight.w600),
+                      String shortAddress = '';
+
+                      if (isCurrentWallet) {
+                        shortAddress = walletStore.subaddress.address;
+                        shortAddress = shortAddress.replaceRange(4, shortAddress.length - 4, '...');
+                      }
+
+                      final walletMenu = WalletMenu(context);
+                      final items = walletMenu.generateItemsForWalletMenu(isCurrentWallet);
+                      final colors = walletMenu.generateColorsForWalletMenu(isCurrentWallet);
+                      final images = walletMenu.generateImagesForWalletMenu(isCurrentWallet);
+
+                      return Container(
+                        height: 108,
+                        width: double.infinity,
+                        child: CustomScrollView(
+                          scrollDirection: Axis.horizontal,
+                          controller: scrollController,
+                          slivers: <Widget>[
+                            SliverPersistentHeader(
+                              pinned: false,
+                              floating: true,
+                              delegate: WalletTile(
+                                  min: screenWidth - 228,
+                                  max: screenWidth,
+                                  image: moneroIcon,
+                                  walletName: wallet.name,
+                                  walletAddress: shortAddress,
+                                  isCurrent: isCurrentWallet
                               ),
-                              trailing: isCurrentWallet
-                                  ? Icon(
-                                      Icons.check,
-                                      color: Palette.cakeGreen,
-                                      size: 20.0,
-                                    )
-                                  : null)));
-                }),
-          ),
-        ),
-        bottomSection: Column(children: <Widget>[
-          PrimaryIconButton(
-              onPressed: () => Navigator.of(context).pushNamed(Routes.newWallet),
-              iconData: Icons.add,
-              color: Theme.of(context).primaryTextTheme.button.backgroundColor,
-              borderColor:
-                  Theme.of(context).primaryTextTheme.button.decorationColor,
-              iconColor: Palette.violet,
-              iconBackgroundColor: Theme.of(context).primaryIconTheme.color,
-              text: S.of(context).wallet_list_create_new_wallet),
-          SizedBox(height: 10.0),
-          PrimaryIconButton(
-              onPressed: () =>
-                  Navigator.of(context).pushNamed(Routes.restoreWalletOptions),
-              iconData: Icons.refresh,
-              text: S.of(context).wallet_list_restore_wallet,
-              color: Theme.of(context).accentTextTheme.button.backgroundColor,
-              borderColor:
-                  Theme.of(context).accentTextTheme.button.decorationColor,
-              iconColor: Theme.of(context).primaryTextTheme.caption.color,
-              iconBackgroundColor: Theme.of(context).accentIconTheme.color)
-        ]));
+                            ),
+                            SliverList(
+                                delegate: SliverChildBuilderDelegate(
+                                  (context, index) {
+
+                                    final item = items[index];
+                                    final color = colors[index];
+                                    final image = images[index];
+
+                                    final radius = index == 0 ? 12.0 : 0.0;
+
+                                    return GestureDetector(
+                                      onTap: () {
+                                        scrollController.animateTo(0.0, duration: Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
+                                        walletMenu.action(
+                                            walletMenu.listItems.indexOf(item), wallet, isCurrentWallet);
+                                      },
+                                      child: Container(
+                                        height: 108,
+                                        width: 108,
+                                        color: PaletteDark.historyPanel,
+                                        child: Container(
+                                          padding: EdgeInsets.only(left: 5, right: 5),
+                                          decoration: BoxDecoration(
+                                              borderRadius: BorderRadius.only(
+                                                  topLeft: Radius.circular(radius),
+                                                  bottomLeft: Radius.circular(radius)
+                                              ),
+                                              color: color
+                                          ),
+                                          child: Center(
+                                            child: Column(
+                                              mainAxisSize: MainAxisSize.min,
+                                              children: <Widget>[
+                                                image,
+                                                SizedBox(height: 5),
+                                                Text(
+                                                  item,
+                                                  textAlign: TextAlign.center,
+                                                  style: TextStyle(
+                                                      fontSize: 12,
+                                                      color: Colors.white
+                                                  ),
+                                                )
+                                              ],
+                                            ),
+                                          ),
+                                        ),
+                                      ),
+                                    );
+                                  },
+                                  childCount: items.length
+                                )
+                            )
+                          ],
+                        ),
+                      );
+                    }),
+              ),
+            ),
+            bottomSection: Column(children: <Widget>[
+              PrimaryImageButton(
+                onPressed: () => Navigator.of(context).pushNamed(Routes.newWallet),
+                image: newWalletImage,
+                text: S.of(context).wallet_list_create_new_wallet,
+                color: Colors.white,
+                textColor: PaletteDark.historyPanel),
+              SizedBox(height: 10.0),
+              PrimaryImageButton(
+                onPressed: () =>
+                    Navigator.of(context).pushNamed(Routes.restoreWalletOptions),
+                image: restoreWalletImage,
+                text: S.of(context).wallet_list_restore_wallet,
+                color: PaletteDark.historyPanelButton,
+                textColor: Colors.white)
+            ])),
+      )
+    );
   }
 }

lib/src/screens/wallet_list/wallet_menu.dart

@@ -18,6 +18,20 @@ class WalletMenu {
     S.current.rescan
   ];
 
+  final List<Color> listColors = [
+    Colors.blue,
+    Colors.orange,
+    Colors.red,
+    Colors.green
+  ];
+
+  final List<Image> listImages = [
+    Image.asset('assets/images/load.png', height: 32, width: 32, color: Colors.white),
+    Image.asset('assets/images/eye_action.png', height: 32, width: 32, color: Colors.white),
+    Image.asset('assets/images/trash.png', height: 32, width: 32, color: Colors.white),
+    Image.asset('assets/images/scanner.png', height: 32, width: 32, color: Colors.white)
+  ];
+
   List<String> generateItemsForWalletMenu(bool isCurrentWallet) {
     final items = List<String>();
 
@@ -29,6 +43,28 @@ class WalletMenu {
     return items;
   }
 
+  List<Color> generateColorsForWalletMenu(bool isCurrentWallet) {
+    final colors = List<Color>();
+
+    if (!isCurrentWallet) colors.add(listColors[0]);
+    if (isCurrentWallet) colors.add(listColors[1]);
+    if (!isCurrentWallet) colors.add(listColors[2]);
+    if (isCurrentWallet) colors.add(listColors[3]);
+
+    return colors;
+  }
+
+  List<Image> generateImagesForWalletMenu(bool isCurrentWallet) {
+    final images = List<Image>();
+
+    if (!isCurrentWallet) images.add(listImages[0]);
+    if (isCurrentWallet) images.add(listImages[1]);
+    if (!isCurrentWallet) images.add(listImages[2]);
+    if (isCurrentWallet) images.add(listImages[3]);
+
+    return images;
+  }
+
   void action(int index, WalletDescription wallet, bool isCurrentWallet) {
     final _walletListStore = Provider.of<WalletListStore>(context);
 

lib/src/screens/wallet_list/widgets/wallet_tile.dart

@@ -0,0 +1,135 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:cake_wallet/palette.dart';
+
+class WalletTile extends SliverPersistentHeaderDelegate {
+  WalletTile({
+    @required this.min,
+    @required this.max,
+    @required this.image,
+    @required this.walletName,
+    @required this.walletAddress,
+    @required this.isCurrent
+  });
+
+  final double min;
+  final double max;
+  final Image image;
+  final String walletName;
+  final String walletAddress;
+  final bool isCurrent;
+
+  @override
+  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
+
+    double opacity = 1 - shrinkOffset / (max - min);
+    opacity = opacity >= 0 ? opacity : 0;
+
+    double panelWidth = 12 * opacity;
+    panelWidth = panelWidth < 12 ? 0 : 12;
+
+    final currentColor = isCurrent
+        ? Colors.white
+        : PaletteDark.historyPanel;
+
+    return Stack(
+      fit: StackFit.expand,
+      overflow: Overflow.visible,
+      children: <Widget>[
+        Positioned(
+          top: 0,
+          right: max - 4,
+          child: Container(
+            height: 108,
+            width: 4,
+            decoration: BoxDecoration(
+                borderRadius: BorderRadius.only(topRight: Radius.circular(4), bottomRight: Radius.circular(4)),
+                color: currentColor
+            ),
+          ),
+        ),
+        Positioned(
+          top: 0,
+          right: 12,
+          child: Container(
+            height: 108,
+            width: max - 16,
+            padding: EdgeInsets.only(left: 20, right: 20),
+            color: PaletteDark.historyPanel,
+            child: Column(
+              mainAxisSize: MainAxisSize.max,
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: <Widget>[
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.start,
+                  crossAxisAlignment: CrossAxisAlignment.center,
+                  children: <Widget>[
+                    image,
+                    SizedBox(width: 10),
+                    Text(
+                      walletName,
+                      style: TextStyle(
+                          fontSize: 22,
+                          fontWeight: FontWeight.bold,
+                          color: Colors.white
+                      ),
+                    )
+                  ],
+                ),
+                isCurrent ? SizedBox(height: 5) : Offstage(),
+                isCurrent
+                ? Row(
+                  mainAxisAlignment: MainAxisAlignment.start,
+                  crossAxisAlignment: CrossAxisAlignment.center,
+                  children: <Widget>[
+                    SizedBox(width: 34),
+                    Text(
+                      walletAddress,
+                      style: TextStyle(
+                        fontSize: 12,
+                        color: PaletteDark.walletCardText
+                      ),
+                    )
+                  ],
+                )
+                : Offstage()
+              ],
+            ),
+          ),
+        ),
+        Positioned(
+            top: 0,
+            right: 0,
+            child: Opacity(
+              opacity: opacity,
+              child: Container(
+                height: 108,
+                width: panelWidth,
+                decoration: BoxDecoration(
+                    borderRadius: BorderRadius.only(topLeft: Radius.circular(12), bottomLeft: Radius.circular(12)),
+                    gradient: LinearGradient(
+                        begin: Alignment.topCenter,
+                        end: Alignment.bottomCenter,
+                        colors: [
+                          PaletteDark.walletCardTopEndSync,
+                          PaletteDark.walletCardBottomEndSync
+                        ]
+                    )
+                ),
+              ),
+            )
+        ),
+      ],
+    );
+  }
+
+  @override
+  double get maxExtent => max;
+
+  @override
+  double get minExtent => min;
+
+  @override
+  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) => true;
+
+}

lib/src/screens/welcome/welcome_page.dart

@@ -77,16 +77,16 @@ class WelcomePage extends BasePage {
                 text: S.of(context).create_new,
                 color:
                     Theme.of(context).primaryTextTheme.button.backgroundColor,
-                borderColor:
-                    Theme.of(context).primaryTextTheme.button.decorationColor),
+                textColor:
+                    Theme.of(context).primaryTextTheme.button.color),
             SizedBox(height: 10),
             PrimaryButton(
               onPressed: () {
                 Navigator.pushNamed(context, Routes.restoreOptions);
               },
               color: Theme.of(context).accentTextTheme.caption.backgroundColor,
-              borderColor:
-                  Theme.of(context).accentTextTheme.caption.decorationColor,
+              textColor:
+                     Theme.of(context).primaryTextTheme.button.color,
               text: S.of(context).restore_wallet,
             )
           ]))

lib/src/widgets/base_alert_dialog.dart

@@ -0,0 +1,174 @@
+import 'dart:ui';
+import 'package:flutter/material.dart';
+import 'package:cake_wallet/palette.dart';
+
+class BaseAlertDialog extends StatelessWidget {
+  String get titleText => '';
+  String get contentText => '';
+  String get leftActionButtonText => '';
+  String get rightActionButtonText => '';
+  VoidCallback get actionLeft => () {};
+  VoidCallback get actionRight => () {};
+
+  Widget title(BuildContext context) {
+    return Text(
+      titleText,
+      textAlign: TextAlign.center,
+      style: TextStyle(
+        fontSize: 20,
+        fontWeight: FontWeight.w600,
+        color: Colors.white,
+        decoration: TextDecoration.none,
+      ),
+    );
+  }
+
+  Widget content(BuildContext context) {
+    return Text(
+      contentText,
+      textAlign: TextAlign.center,
+      style: TextStyle(
+        fontSize: 16,
+        fontWeight: FontWeight.w600,
+        color: Colors.white,
+        decoration: TextDecoration.none,
+      ),
+    );
+  }
+
+  Widget actionButtons(BuildContext context) {
+    return Container(
+      width: 300,
+      height: 52,
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.only(
+          bottomLeft: Radius.circular(24),
+          bottomRight: Radius.circular(24)
+        ),
+        color: Colors.white
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.max,
+        children: <Widget>[
+          Flexible(
+            child: Container(
+              padding: EdgeInsets.only(left: 12, right: 12),
+              decoration: BoxDecoration(
+                borderRadius: BorderRadius.only(bottomLeft: Radius.circular(24)),
+              ),
+              child: ButtonTheme(
+                minWidth: double.infinity,
+                child: FlatButton(
+                  onPressed: actionLeft,
+                  highlightColor: Colors.transparent,
+                  splashColor: Colors.transparent,
+                  child: Text(
+                    leftActionButtonText,
+                    textAlign: TextAlign.center,
+                    style: TextStyle(
+                      fontSize: 15,
+                      fontWeight: FontWeight.w600,
+                      color: Colors.blue,
+                      decoration: TextDecoration.none,
+                    ),
+                  )),
+              ),
+            )
+          ),
+          Container(
+            height: 52,
+            width: 1,
+            color: Colors.grey.withOpacity(0.2),
+          ),
+          Flexible(
+            child: Container(
+              padding: EdgeInsets.only(left: 12, right: 12),
+              decoration: BoxDecoration(
+                borderRadius: BorderRadius.only(bottomRight: Radius.circular(24)),
+              ),
+              child: ButtonTheme(
+                minWidth: double.infinity,
+                child: FlatButton(
+                    onPressed: actionRight,
+                    highlightColor: Colors.transparent,
+                    splashColor: Colors.transparent,
+                    child: Text(
+                      rightActionButtonText,
+                      textAlign: TextAlign.center,
+                      style: TextStyle(
+                        fontSize: 15,
+                        fontWeight: FontWeight.w600,
+                        color: Colors.red,
+                        decoration: TextDecoration.none,
+                      ),
+                    )),
+              ),
+            )
+          )
+        ],
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: () => Navigator.of(context).pop(),
+      child: Container(
+        color: Colors.transparent,
+        child: BackdropFilter(
+          filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
+          child: Container(
+            decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
+            child: Center(
+              child: GestureDetector(
+                onTap: () => null,
+                child: Container(
+                  width: 300,
+                  height: 257,
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.all(Radius.circular(24)),
+                    color: PaletteDark.menuHeader
+                  ),
+                  child: Column(
+                    //mainAxisSize: MainAxisSize.max,
+                    children: <Widget>[
+                      Container(
+                        width: 300,
+                        height: 77,
+                        padding: EdgeInsets.all(24),
+                        decoration: BoxDecoration(
+                          borderRadius: BorderRadius.only(
+                            topLeft: Radius.circular(24),
+                            topRight: Radius.circular(24)
+                          ),
+                        ),
+                        child: Center(
+                          child: title(context),
+                        ),
+                      ),
+                      Container(
+                        width: 300,
+                        height: 1,
+                        color: PaletteDark.menuList,
+                      ),
+                      Container(
+                        width: 300,
+                        height: 127,
+                        padding: EdgeInsets.all(24),
+                        child: Center(
+                          child: content(context),
+                        ),
+                      ),
+                      actionButtons(context)
+                    ],
+                  ),
+                ),
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/src/widgets/primary_button.dart

@@ -7,14 +7,14 @@ class PrimaryButton extends StatelessWidget {
       {@required this.onPressed,
       @required this.text,
       @required this.color,
-      @required this.borderColor,
+      @required this.textColor,
       this.isDisabled = false,
       this.onDisabledPressed});
 
   final VoidCallback onPressed;
   final VoidCallback onDisabledPressed;
   final Color color;
-  final Color borderColor;
+  final Color textColor;
   final String text;
   final bool isDisabled;
 
@@ -22,21 +22,21 @@ class PrimaryButton extends StatelessWidget {
   Widget build(BuildContext context) {
     return ButtonTheme(
         minWidth: double.infinity,
-        height: 56.0,
+        height: 52.0,
         child: FlatButton(
           onPressed: isDisabled
               ? (onDisabledPressed != null ? onDisabledPressed : null)
               : onPressed,
           color: isDisabled ? Colors.transparent : color,
           shape: RoundedRectangleBorder(
-              side: BorderSide(color: borderColor),
-              borderRadius: BorderRadius.circular(10.0)),
+              borderRadius: BorderRadius.circular(26.0)),
           child: Text(text,
               style: TextStyle(
-                  fontSize: 16.0,
+                  fontSize: 15.0,
+                  fontWeight: FontWeight.w600,
                   color: isDisabled
                       ? Palette.darkGrey
-                      : Theme.of(context).primaryTextTheme.button.color)),
+                      : textColor)),
         ));
   }
 }
@@ -143,29 +143,43 @@ class PrimaryImageButton extends StatelessWidget {
       {@required this.onPressed,
       @required this.image,
       @required this.text,
-      this.color = Palette.purple,
-      this.borderColor = Palette.deepPink,
-      this.iconColor = Colors.black});
+      @required this.color,
+      @required this.textColor});
 
   final VoidCallback onPressed;
   final Image image;
   final Color color;
-  final Color borderColor;
-  final Color iconColor;
+  final Color textColor;
   final String text;
 
   @override
   Widget build(BuildContext context) {
     return ButtonTheme(
         minWidth: double.infinity,
-        height: 58.0,
+        height: 52.0,
         child: FlatButton(
           onPressed: onPressed,
           color: color,
           shape: RoundedRectangleBorder(
-              side: BorderSide(color: borderColor),
-              borderRadius: BorderRadius.circular(12.0)),
-          child: Row(
+            borderRadius: BorderRadius.circular(26.0)),
+          child:Center(
+            child: Row(
+              mainAxisSize: MainAxisSize.min,
+              children: <Widget>[
+                image,
+                SizedBox(width: 15),
+                Text(
+                  text,
+                  style: TextStyle(
+                    fontSize: 15,
+                    fontWeight: FontWeight.w600,
+                    color: textColor
+                  ),
+                )
+              ],
+            ),
+          )
+          /*Row(
             children: <Widget>[
               Container(
                 width: 28.0,
@@ -192,7 +206,7 @@ class PrimaryImageButton extends StatelessWidget {
                     )
                   ]))
             ],
-          ),
+          ),*/
         ));
   }
 }

lib/src/widgets/seed_widget.dart

@@ -337,10 +337,10 @@ class SeedWidgetState extends State<SeedWidget> {
                                   .primaryTextTheme
                                   .button
                                   .backgroundColor,
-                              borderColor: Theme.of(context)
+                              textColor: Theme.of(context)
                                   .primaryTextTheme
                                   .button
-                                  .decorationColor)
+                                  .color)
                           : PrimaryButton(
                               text: selectedItem != null
                                   ? S.of(context).save
@@ -351,7 +351,10 @@ class SeedWidgetState extends State<SeedWidget> {
                               onDisabledPressed: () => showErrorIfExist(),
                               isDisabled: !isCurrentMnemoticValid,
                               color: PaletteDark.darkThemeBlueButton,
-                              borderColor: Palette.brightBlue))
+                              textColor: Theme.of(context)
+                                  .primaryTextTheme
+                                  .button
+                                  .color))
                 ]))
       ]),
     );