#40 +. Using FE template for graphelier tool. UI tweaks, and small co…

…de changes. (#58) * Added new interface [#40]
Lercerss · Oct 26, 2019 · 84d9649 · 84d9649
1 parent ece4d7e
commit 84d9649
Show file tree

Hide file tree

Showing 17 changed files with 718 additions and 314 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,5 @@
+#windows docker compose file
+docker-compose_windows.yml
+
+#Visual studio folder
+.vs/*
diff --git a/.vs/graphelier/v16/.suo b/.vs/graphelier/v16/.suo
diff --git a/app/package-lock.json b/app/package-lock.json
diff --git a/app/package.json b/app/package.json
@@ -3,7 +3,8 @@
     "version": "0.1.0",
     "private": true,
     "dependencies": {
-        "@material-ui/core": "^4.4.2",
+        "@material-ui/core": "^4.5.1",
+        "@material-ui/icons": "^4.5.1",
         "@material-ui/styles": "^4.4.1",
         "axios": "^0.19.0",
         "classnames": "^2.2.6",

diff --git a/app/src/App.js b/app/src/App.js
@@ -5,8 +5,7 @@ import {withStyles} from '@material-ui/core/styles';
 import {Styles} from './styles/App';
 
 import {saveReactAppName} from './actions/actions';
-import OrderBookSnapshot from './components/OrderBookSnapshot';
-import {Container} from '@material-ui/core';
+import Dashboard from './components/template/Dashboard';
 
 class App extends Component {
 
@@ -26,9 +25,7 @@ class App extends Component {
         const {classes} = this.props;
 
         return (
-            <Container className={classes.app}>
-                <OrderBookSnapshot/>
-            </Container>
+            <Dashboard/>
         );
     }
 }

diff --git a/app/src/components/Order.js b/app/src/components/Order.js
@@ -13,15 +13,12 @@ class Order extends Component {
         const minQuantityTextSize = 1.5;
 
         return (
-            <Box className={classNames(classes.rectangle, type === 'bid' ? classes.bid : classes.ask)} style={{minWidth:`${quantityBoxSize}%`, maxWidth: `${quantityBoxSize}%`}}>
-                {quantityBoxSize > minQuantityTextSize ?
-                    (
-                        <Typography className={classes.text}>{quantity}</Typography>
-                    ) : (
-                        <Tooltip title={quantity} placement='cursor'><span className={classes.quantity}/></Tooltip>
-                    )
-                }
-            </Box>
+            quantityBoxSize > minQuantityTextSize ?
+                <Box className={classNames(classes.rectangle, type === 'bid' ? classes.bid : classes.ask)} style={{ minWidth: `${quantityBoxSize}%`, maxWidth: `${quantityBoxSize}%` }}>
+                    <Typography className={classes.text}>{quantity}</Typography>
+                </Box> :
+                <Tooltip title={quantity} placement='cursor'><span className={`${classes.quantity} ${classNames(classes.rectangle, type === 'bid' ? classes.bid : classes.ask)}`} style={{ minWidth: `${quantityBoxSize}%`, maxWidth: `${quantityBoxSize}%` }}/>
+                </Tooltip>
         );
     }
 }