CWA-198 | changed background color of dashboard page; added color of bounds and shadows to wallet card; changed color of buttons in the button_header

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/base_page.dart

@@ -81,9 +81,10 @@ abstract class BasePage extends StatelessWidget {
             leading: leading(context),
             middle: middle(context),
             trailing: trailing(context),
-            backgroundColor: _isDarkTheme
+            backgroundColor: backgroundColor);
+            /*backgroundColor: _isDarkTheme
                 ? Theme.of(context).backgroundColor
-                : backgroundColor);
+                : backgroundColor);*/
 
       case AppBarStyle.withShadow:
         return NavBar.withShadow(
@@ -91,9 +92,10 @@ abstract class BasePage extends StatelessWidget {
             leading: leading(context),
             middle: middle(context),
             trailing: trailing(context),
-            backgroundColor: _isDarkTheme
+            backgroundColor: backgroundColor);
+            /*backgroundColor: _isDarkTheme
                 ? Theme.of(context).backgroundColor
-                : backgroundColor);
+                : backgroundColor);*/
 
       default:
         return NavBar(
@@ -101,9 +103,10 @@ abstract class BasePage extends StatelessWidget {
             leading: leading(context),
             middle: middle(context),
             trailing: trailing(context),
-            backgroundColor: _isDarkTheme
+            backgroundColor: backgroundColor);
+            /*backgroundColor: _isDarkTheme
                 ? Theme.of(context).backgroundColor
-                : backgroundColor);
+                : backgroundColor);*/
     }
   }
 

lib/src/screens/dashboard/dashboard_page.dart

@@ -9,7 +9,26 @@ 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: () {},
+          child: menuButton),
+      ),
+    );
+  }
 
   @override
   Widget body(BuildContext context) => DashboardPageBody(key: _bodyKey);
@@ -23,43 +42,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: () {},
-                        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;
@@ -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, '...');
@@ -123,9 +138,10 @@ class WalletCardState extends State<WalletCard> {
           height: cardHeight,
           child: Stack(
             children: <Widget>[
-              Container(
+              AnimatedContainer(
+                duration: Duration(milliseconds: 0),
                 height: cardHeight,
-                width: progress * cardWidth,
+                width: indicatorWidth,
                 decoration: BoxDecoration(
                     borderRadius: BorderRadius.only(topLeft: Radius.circular(10), bottomLeft: Radius.circular(10)),
                     gradient: LinearGradient(

lib/src/widgets/nav_bar.dart

@@ -19,8 +19,9 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
         middle: middle,
         trailing: trailing,
         height: _height,
-        backgroundColor:
-            _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor);
+        backgroundColor: backgroundColor);
+        /*backgroundColor:
+            _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor);*/
   }
 
   factory NavBar.withShadow(
@@ -37,12 +38,14 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
       middle: middle,
       trailing: trailing,
       height: 80,
-      backgroundColor:
-          _isDarkTheme ? Theme.of(context).backgroundColor : backgroundColor,
+      backgroundColor: backgroundColor,
+      /*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),