update dashboard

src/common/pages/Dashboard/PopularItemCard.js

@@ -88,7 +88,7 @@ export default class PopularItemCardComponent extends Component {
                   return(
                     <div>
                         <div style={{textAlign:'center',padding:10}}>
-                            <img src={it.image} style={{marginLeft:'auto',marginRight:'auto'}} height={'180vh'} width={'100%'} />
+                            <img src={it.image} style={{marginLeft:'auto',marginRight:'auto'}} height={'200vh'} width={'100%'} />
                             {it.name}
                             <br/>
                             <span style={{color:'#0061a7'}}>Rp. {it.price}</span>

src/common/pages/Dashboard/index.js

@@ -43,6 +43,7 @@ import slider5 from '../../../../assets/images/slider/5.jpg';
 import {ItemCard} from "../Vouchers/ItemCard";
 import ModalVouchersComponent from "../Vouchers/Modal";
 import PopularItemCardComponent from "./PopularItemCard";
+import NewItemCardComponent from "./NewItemCard";
 import '../Vouchers/style.scss';
 
 const {
@@ -271,13 +272,12 @@ export default class DashboardComponent extends React.Component {
         <div>
           <Grid container spacing={0} style={{}}>
             <Grid item xs={12}>
-              <div className="voucher">
+              <div>
                 <div className="row">
                   <div className="col l12 m12 s12 padding">
-                    <p className={'pageTitle'}>
+                    <h3>
                       Popular Items
-                    </p>
+                    </h3>
-
                     <Row gutter={10}>
                       <PopularItemCardComponent/>
                     </Row>
@@ -286,16 +286,30 @@ export default class DashboardComponent extends React.Component {
               </div>
             </Grid>
             <Grid item xs={12}>
-              <div className="voucher">
+              <div>
                 <div className="row">
                   <div className="col l12 m12 s12 padding">
-                    <p className={'pageTitle'}>
+                    <h3>
+                      New Products
+                    </h3>
+                    <Row gutter={10}>
+                      <NewItemCardComponent/>
+                    </Row>
+                  </div>
+                </div>
+              </div>
+            </Grid>
+            <Grid item xs={12}>
+              <div className={"voucher"} style={{marginTop:0}}>
+                <div className="row">
+                  <div className="col l12 m12 s12 padding">
+                    <h3>
                       Voucher & Gift Card
-                    </p>
+                    </h3>
 
                     <Row gutter={10}>
                       {data.map((item, index) => {
-                        return (<Col onClick={() => this.setState({isOpened: true, data: item})} key={index} span={6}>
+                        return (<Col xs={24} xl={6} onClick={() => this.setState({isOpened: true, data: item})} key={index} span={6}>
                           <ItemCard data={item}/>
                         </Col>)
                       })}