This commit is contained in:
Ridwan Abadi 2019-01-28 20:12:46 +07:00
parent 29acd7a33f
commit 5221815e85
2 changed files with 81 additions and 75 deletions

View File

@ -55,10 +55,10 @@
} }
.mainContent { .mainContent {
width: calc(100vw - 14vw); //width: calc(100vw - 14vw);
margin-left: 2.5vw; //margin-left: 2.5vw;
margin-right: 2.5vw; //margin-right: 2.5vw;
position: relative; //position: relative;
} }
@media screen and (max-width: 780px) { @media screen and (max-width: 780px) {
.mainContent { .mainContent {

View File

@ -1,5 +1,6 @@
import React from "react"; import React from "react";
import {inject, observer} from "mobx-react"; import {inject, observer} from "mobx-react";
import withStyles from "@material-ui/core/styles/withStyles";
import QueueAnim from 'rc-queue-anim'; import QueueAnim from 'rc-queue-anim';
import "./style.scss"; import "./style.scss";
import NumberFormat from 'react-number-format'; import NumberFormat from 'react-number-format';
@ -24,6 +25,8 @@ import {
Divider, ListItem, List Divider, ListItem, List
} from 'material-ui'; } from 'material-ui';
import Grid from '@material-ui/core/Grid'; import Grid from '@material-ui/core/Grid';
import {default as MuiCard} from '@material-ui/core/Card'
import {default as MuiCardContent} from '@material-ui/core/CardContent';
import EmptyComponent from '../EmptyComponent'; import EmptyComponent from '../EmptyComponent';
import * as _ from 'lodash'; import * as _ from 'lodash';
import {grey400, darkBlack, lightBlack, black} from 'material-ui/styles/colors'; import {grey400, darkBlack, lightBlack, black} from 'material-ui/styles/colors';
@ -46,6 +49,7 @@ import PopularItemCardComponent from "./PopularItemCard";
import NewItemCardComponent from "./NewItemCard"; import NewItemCardComponent from "./NewItemCard";
import '../Vouchers/style.scss'; import '../Vouchers/style.scss';
import ModalTopupComponent from "../Wallet/Modal"; import ModalTopupComponent from "../Wallet/Modal";
import {styles} from "../RegisterNew/styles";
const { const {
LineChart, LineChart,
@ -65,7 +69,7 @@ const {
@inject('appstate') @inject('appstate')
@observer @observer
export default class DashboardComponent extends React.Component { class DashboardComponent extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -104,6 +108,7 @@ export default class DashboardComponent extends React.Component {
}; };
render() { render() {
const {classes} = this.props;
const settings = { const settings = {
arrows: true, arrows: true,
infinite: true, infinite: true,
@ -114,17 +119,18 @@ export default class DashboardComponent extends React.Component {
}; };
return ( return (
<div> <div className={classes.root}>
<div className="dashboard animated fadeIn" style={{ <Grid
marginLeft: '8%', container
marginRight: '7%' direction="row"
}}> justify="center"
<div className="row "> alignItems="center"
<div className="col s12 m12 l12 col-leftDashboard" style={{marginBottom: 0}}> spacing={24}
<div className="row no-margin"> style={{marginTop: 30}}>
<Grid item xs={12} sm={3} md={3} lg={3}>
{this.props.appstate.wallet.data.wallet ? ( {this.props.appstate.wallet.data.wallet ? (
<div className="col s12 m4 l4" style={{marginBottom: 0}}> <MuiCard className={classes.card}>
<Card className="cardLite cardDashboard"> <MuiCardContent>
<h3 style={{ <h3 style={{
display: 'block', display: 'block',
fontSize: '1rem', fontSize: '1rem',
@ -143,13 +149,14 @@ export default class DashboardComponent extends React.Component {
<Icon className="ml-8" type="right" /> <Icon className="ml-8" type="right" />
</a> */} </a> */}
</div> </div>
</Card> </MuiCardContent>
</div> </MuiCard>
) : ''} ) : ''}
</Grid>
<Grid item xs={12} sm={3} md={3} lg={3}>
{this.props.appstate.wallet.data.wallet ? ( {this.props.appstate.wallet.data.wallet ? (
<div className="col s12 m4 l4" style={{marginBottom: 0}}> <MuiCard className={classes.card}>
<Card className="cardLite cardDashboard"> <MuiCardContent>
<h3 style={{ <h3 style={{
display: 'block', display: 'block',
fontSize: '1rem', fontSize: '1rem',
@ -165,14 +172,14 @@ export default class DashboardComponent extends React.Component {
<Icon className="ml-8" type="right" /> <Icon className="ml-8" type="right" />
</a> */} </a> */}
</div> </div>
</Card> </MuiCardContent>
</div> </MuiCard>
) : ''} ) : ''}
</Grid>
<Grid item xs={12} sm={3} md={3} lg={3}>
{this.props.appstate.wallet.data.wallet ? ( {this.props.appstate.wallet.data.wallet ? (
<div className="col s12 m4 l4" style={{marginBottom: 0}}> <MuiCard className={classes.card}>
<Card className="cardLite cardDashboard"> <MuiCardContent>
<h3 style={{ <h3 style={{
display: 'block', display: 'block',
fontSize: '1rem', fontSize: '1rem',
@ -188,14 +195,11 @@ export default class DashboardComponent extends React.Component {
<Icon className="ml-8" type="right" /> <Icon className="ml-8" type="right" />
</a> */} </a> */}
</div> </div>
</Card> </MuiCardContent>
</div> </MuiCard>
) : ''} ) : ''}
</div> </Grid>
</div> </Grid>
</div>
</div>
<div style={{marginLeft: '10%', marginRight: '10%', marginTop: 20, flexGrow: 1, minHeight: window.innerHeight - 70, backgroundColor: '#fff'}}> <div style={{marginLeft: '10%', marginRight: '10%', marginTop: 20, flexGrow: 1, minHeight: window.innerHeight - 70, backgroundColor: '#fff'}}>
<div> <div>
@ -289,3 +293,5 @@ export default class DashboardComponent extends React.Component {
); );
} }
} }
export default withStyles(styles)(DashboardComponent);