Merge branch 'newdesign' into CWA-201-update-wallet-menu-screen

lib/palette.dart

@@ -74,6 +74,8 @@ class PaletteDark {
 
   static const Color backgroundStart = Color.fromRGBO(231, 240, 253, 1.0);
   static const Color backgroundEnd = Color.fromRGBO(172, 203, 238, 1.0);
+  static const Color mainBackgroundColor = Color.fromRGBO(70, 85, 133, 1.0);
+  static const Color borderCardColor = Color.fromRGBO(81, 96, 147, 1.0);
   static const Color walletCardTopStartSync = Color.fromRGBO(89, 104, 152, 1.0);
   static const Color walletCardBottomStartSync = Color.fromRGBO(70, 85, 133, 1.0);
   static const Color walletCardTopEndSync = Color.fromRGBO(70, 85, 133, 1.0);

lib/src/screens/dashboard/dashboard_page.dart

@@ -1,16 +1,40 @@
+import 'package:cake_wallet/src/screens/dashboard/widgets/menu_widget.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/src/screens/base_page.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/wallet_card.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/trade_history_panel.dart';
-import 'package:cake_wallet/src/screens/dashboard/widgets/menu_widget.dart';
 
 class DashboardPage extends BasePage {
   final _bodyKey = GlobalKey();
 
   @override
-  ObstructingPreferredSizeWidget appBar(BuildContext context) => null;
+  Color get backgroundColor => PaletteDark.mainBackgroundColor;
+
+  @override
+  Widget trailing(BuildContext context) {
+    final menuButton = Image.asset('assets/images/header.png');
+
+    return SizedBox(
+      height: 37,
+      width: 37,
+      child: ButtonTheme(
+        minWidth: double.minPositive,
+        child: FlatButton(
+          highlightColor: Colors.transparent,
+          splashColor: Colors.transparent,
+          padding: EdgeInsets.all(0),
+          onPressed: () async {
+            await showDialog<void>(
+                builder: (_) => MenuWidget(),
+                context: context
+            );
+          },
+          child: menuButton),
+      ),
+    );
+  }
 
   @override
   Widget body(BuildContext context) => DashboardPageBody(key: _bodyKey);
@@ -24,46 +48,17 @@ class DashboardPageBody extends StatefulWidget {
 }
 
 class DashboardPageBodyState extends State<DashboardPageBody> {
-  final menuButton = Image.asset('assets/images/menu_button.png');
 
   @override
   Widget build(BuildContext context) {
-    final List<Color> colors = [PaletteDark.backgroundStart, PaletteDark.backgroundEnd];
 
     return SafeArea(
       child: Container(
-        decoration: BoxDecoration(
-          gradient: LinearGradient(
-            colors: colors
-          )
-        ),
+        color: PaletteDark.mainBackgroundColor,
         child: Column(
           children: <Widget>[
             Padding(
-              padding: EdgeInsets.only(top: 14),
-              child: Container(
-                width: double.infinity,
-                alignment: Alignment.centerRight,
-                child: SizedBox(
-                  height: 37,
-                  width: 37,
-                  child: ButtonTheme(
-                    minWidth: double.minPositive,
-                    child: FlatButton(
-                        highlightColor: Colors.transparent,
-                        splashColor: Colors.transparent,
-                        padding: EdgeInsets.all(0),
-                        onPressed: () => showDialog<void>(
-                          builder: (_) => MenuWidget(),
-                          context: context
-                        ),
-                        child: menuButton),
-                  ),
-                ),
-              )
-            ),
-            Padding(
-              padding: EdgeInsets.only(left: 20, top: 23),
+              padding: EdgeInsets.only(left: 20, top: 10),
               child: WalletCard(),
             ),
             SizedBox(

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

@@ -274,7 +274,7 @@ class ButtonHeader extends SliverPersistentHeaderDelegate {
               width: 48,
               alignment: Alignment.center,
               decoration: BoxDecoration(
-                  color: Colors.white,
+                  color: PaletteDark.borderCardColor,
                   shape: BoxShape.circle
               ),
               child: image,

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

@@ -24,7 +24,7 @@ class WalletCardState extends State<WalletCard> {
   final _balanceObserverKey = GlobalKey();
   final _addressObserverKey = GlobalKey();
 
-  final List<Color> colorsSync = [PaletteDark.walletCardTopEndSync, PaletteDark.walletCardBottomEndSync];
+  final List<Color> colorsSync = [PaletteDark.walletCardSubAddressField, PaletteDark.walletCardBottomEndSync];
   double cardWidth;
   double cardHeight;
   double screenWidth;
@@ -45,12 +45,12 @@ class WalletCardState extends State<WalletCard> {
   }
 
   void afterLayout(dynamic _) {
-    screenWidth = MediaQuery.of(context).size.width;
+    screenWidth = MediaQuery.of(context).size.width - 20;
     setState(() {
       cardWidth = screenWidth;
       opacity = 1;
     });
-    Timer(Duration(milliseconds: 350), () =>
+    Timer(Duration(milliseconds: 500), () =>
         setState(() => isDraw = true)
     );
   }
@@ -67,20 +67,34 @@ class WalletCardState extends State<WalletCard> {
         height: cardHeight,
         duration: Duration(milliseconds: 500),
         curve: Curves.fastOutSlowIn,
-        decoration: BoxDecoration(
-            borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)),
-            gradient: LinearGradient(
-                colors: [PaletteDark.walletCardTopStartSync.withOpacity(opacity),
-                         PaletteDark.walletCardBottomStartSync.withOpacity(opacity)],
-                begin: Alignment.topCenter,
-                end: Alignment.bottomCenter
-            )
+        padding: EdgeInsets.only(
+          top: 1,
+          left: 1,
+          bottom: 1
         ),
-        child: InkWell(
-          onTap: () => setState(() => isFrontSide = !isFrontSide),
-          child: isFrontSide
-            ? frontSide()
-            : backSide()
+        decoration: BoxDecoration(
+          borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)),
+          color: PaletteDark.borderCardColor,
+          boxShadow: [
+            BoxShadow(
+              color: PaletteDark.historyPanel.withOpacity(0.5),
+              blurRadius: 8,
+              offset: Offset(5, 5))
+          ]
+        ),
+        child: Container(
+          width: cardWidth,
+          height: cardHeight,
+          decoration: BoxDecoration(
+              borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)),
+              color: PaletteDark.historyPanel
+          ),
+          child: InkWell(
+              onTap: () => setState(() => isFrontSide = !isFrontSide),
+              child: isFrontSide
+                  ? frontSide()
+                  : backSide()
+          ),
         ),
       ),
     );
@@ -99,6 +113,7 @@ class WalletCardState extends State<WalletCard> {
         final status = syncStore.status;
         final statusText = status.title();
         final progress = syncStore.status.progress();
+        final indicatorWidth = progress * cardWidth;
 
         String shortAddress = walletStore.subaddress.address;
         shortAddress = shortAddress.replaceRange(4, shortAddress.length - 4, '...');
@@ -125,7 +140,7 @@ class WalletCardState extends State<WalletCard> {
             children: <Widget>[
               Container(
                 height: cardHeight,
-                width: progress * cardWidth,
+                width: indicatorWidth,
                 decoration: BoxDecoration(
                     borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)),
                     gradient: LinearGradient(
@@ -135,6 +150,18 @@ class WalletCardState extends State<WalletCard> {
                     )
                 ),
               ),
+              progress != 1
+              ? Positioned(
+                  left: indicatorWidth,
+                  top: 0,
+                  bottom: 0,
+                  child: Container(
+                    width: 1,
+                    height: cardHeight,
+                    color: PaletteDark.borderCardColor,
+                  )
+              )
+              : Offstage(),
               isDraw ? Positioned(
                   left: 20,
                   right: 20,
@@ -303,7 +330,7 @@ class WalletCardState extends State<WalletCard> {
     final walletStore = Provider.of<WalletStore>(context);
     final rightArrow = Image.asset('assets/images/right_arrow.png');
     double messageBoxHeight = 0;
-    double messageBoxWidth = cardWidth - 30;
+    double messageBoxWidth = cardWidth - 10;
 
     return Observer(
       key: _addressObserverKey,
@@ -358,7 +385,7 @@ class WalletCardState extends State<WalletCard> {
                                       try {
                                         _addressObserverKey.currentState.setState(() {
                                           messageBoxHeight = 0;
-                                          messageBoxWidth = cardWidth - 30;
+                                          messageBoxWidth = cardWidth - 10;
                                         });
                                       } catch(e) {
                                         print('${e.toString()}');

lib/src/widgets/nav_bar.dart

@@ -42,9 +42,10 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
       /*backgroundColor:
           _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor,*/
       decoration: BoxDecoration(
-          color: _isDarkTheme
+          color: backgroundColor,
+          /*_isDarkTheme
               ? Theme.of(context).backgroundColor
-              : backgroundColor,
+              : backgroundColor,*/
           boxShadow: [
             BoxShadow(
                 color: Color.fromRGBO(132, 141, 198, 0.11),