From 8193e4d42ede8ecc478879d46cfa9b687f3300ef Mon Sep 17 00:00:00 2001
From: Barry Gitarts <bgitarts@gmail.com>
Date: Wed, 19 Dec 2018 10:43:47 -0500
Subject: [PATCH] update header style + summary card style

---
 app/components/MainCointainer.jsx           |  1 +
 app/components/dashboard/FundingSummary.jsx | 18 +++++++++++++-----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/app/components/MainCointainer.jsx b/app/components/MainCointainer.jsx
index b3eca8a..8dbcf4f 100644
--- a/app/components/MainCointainer.jsx
+++ b/app/components/MainCointainer.jsx
@@ -30,6 +30,7 @@ const styles = theme => ({
     display: 'flex',
   },
   appBar: {
+    backgroundColor: '#111735',
     transition: theme.transitions.create(['margin', 'width'], {
       easing: theme.transitions.easing.sharp,
       duration: theme.transitions.duration.leavingScreen,
diff --git a/app/components/dashboard/FundingSummary.jsx b/app/components/dashboard/FundingSummary.jsx
index c8914f5..f71299d 100644
--- a/app/components/dashboard/FundingSummary.jsx
+++ b/app/components/dashboard/FundingSummary.jsx
@@ -11,6 +11,11 @@ const styles = {
   card: {
     minWidth: 275,
   },
+  fundingSummaries: {
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center'
+  },
   bullet: {
     display: 'inline-block',
     margin: '0 2px',
@@ -41,17 +46,20 @@ function SimpleCard(props) {
                      const [name, amounts] = token
                      const { deposits, withdraws } = amounts
                      return (
-                       <div key={name}>
+                       <Card key={name} className={classes.fundingSummaries}>
+                         <Typography variant="h5" component="h2">
+                           {name}
+                         </Typography>
                          <Typography key={name + 'withdraw'} className={classes.pos} color="textSecondary">
-                           Funded: {deposits} {name}
+                           Funded: {deposits}
                          </Typography>
                          <Typography key={name + 'deposit'} className={classes.pos} color="textSecondary">
-                           Withdrawn: {withdraws} {name}
+                           Withdrawn: {withdraws}
                          </Typography>
                          <Typography key={name + 'total'} className={classes.pos} color="textSecondary">
-                           Net: {Number(deposits) - Number(withdraws)} {name}
+                           Net: {Number(deposits) - Number(withdraws)}
                          </Typography>
-                       </div>
+                       </Card>
                      )
                    })}
           </CardContent>