Merge pull request #95 from stockmarkat/juim/new-stock-card

finish new stock card
stockmarkat · Jul 10, 2018 · df881a2 · df881a2
2 parents 52909e1 + 8b45892
commit df881a2
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 7 deletions.
diff --git a/src/assets/sass/lbd/_responsive.scss b/src/assets/sass/lbd/_responsive.scss
@@ -460,5 +460,5 @@
 
 .vertical-center {
     display: flex;
-    align-content: center;
+    align-items: center;
 }
diff --git a/src/assets/sass/lbd/_sidebar-and-main-panel.scss b/src/assets/sass/lbd/_sidebar-and-main-panel.scss
@@ -268,6 +268,13 @@ body > .navbar-collapse {
 .currentBalance-hr {
   margin-bottom: 10px;
 }
+
+.stocktile-hr {
+  margin-top: 0;
+  margin-bottom: 30px;
+  border-color: #afafaf;
+}
+
 .currentBalance-p {
   margin: 0 15px;
   padding: 5px 15px;

diff --git a/src/assets/sass/light-bootstrap-dashboard.css b/src/assets/sass/light-bootstrap-dashboard.css
@@ -481,6 +481,11 @@ body > .navbar-collapse[data-color="purple"]:after {
 .currentBalance-hr {
   margin-bottom: 10px; }
 
+.stocktile-hr {
+  margin-top: 0;
+  margin-bottom: 30px;
+  border-color: #afafaf; }
+
 .currentBalance-p {
   margin: 0 15px;
   padding: 5px 15px;
@@ -2471,4 +2476,4 @@ body > .navbar-collapse[data-color="purple"]:after {
 
 .vertical-center {
   display: flex;
-  align-content: center; }
+  align-items: center; }
diff --git a/src/views/Depot/Cards/StockCard.tsx b/src/views/Depot/Cards/StockCard.tsx
@@ -21,17 +21,17 @@ export class StockCard extends React.PureComponent<StockCardProps> {
         return (
             <Card noHeader={true} noFooter={true}>
                 <Row className="vertical-center">
-                    <Col xs={4} className="horizontal-center">
+                    <Col xs={3} sm={4} className="horizontal-center">
                         <i
                             style={{
-                                fontSize: '11vmin',
-                                color: getColor( type )
+                                fontSize: '15vmin',
+                                color: getColor( type ),
                             }}
                             title={type}
-                            className={getCorrectIconForType( type )}
+                            className={getCorrectIconForType( type ) + ' vertical-center'}
                         />
                     </Col>
-                    <Col xs={8} className="horizontal-center">
+                    <Col xs={9} sm={8} className="horizontal-center">
                         <StockCardDetails name={name} quantity={quantity} price={price} />
                     </Col>
                 </Row>

diff --git a/src/views/Depot/Depot.tsx b/src/views/Depot/Depot.tsx
@@ -40,6 +40,7 @@ class Depot extends React.Component<DepotProps> {
                         </Col>
                         }
                     </Row>
+                    {stocks.length > 0 && <hr className="stocktile-hr"/>}
                     <Row>
                     {