diff options
Diffstat (limited to 'front/odiparpack/app/components/Widget/ProgressWidget.js')
| -rw-r--r-- | front/odiparpack/app/components/Widget/ProgressWidget.js | 39 |
1 files changed, 39 insertions, 0 deletions
diff --git a/front/odiparpack/app/components/Widget/ProgressWidget.js b/front/odiparpack/app/components/Widget/ProgressWidget.js new file mode 100644 index 0000000..c0e6db6 --- /dev/null +++ b/front/odiparpack/app/components/Widget/ProgressWidget.js @@ -0,0 +1,39 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import Type from 'ba-styles/Typography.scss'; +import Check from '@material-ui/icons/Check'; +import { withStyles } from '@material-ui/core/styles'; +import { LinearProgress, Paper, Typography, Grid, Avatar, Chip } from '@material-ui/core'; +import styles from './widget-jss'; + + +function ProgressWidget(props) { + const { classes } = props; + return ( + <Paper className={classes.styledPaper} elevation={4}> + <Typography className={classes.title} variant="h5" component="h3"> + <span className={Type.light}>Profile Strength: </span> + <span className={Type.bold}>Intermediate</span> + </Typography> + <Grid container justify="center"> + <Chip + avatar={( + <Avatar> + <Check /> + </Avatar> + )} + label="60% Progress" + className={classes.chipProgress} + color="primary" + /> + </Grid> + <LinearProgress variant="determinate" className={classes.progressWidget} value={60} /> + </Paper> + ); +} + +ProgressWidget.propTypes = { + classes: PropTypes.object.isRequired, +}; + +export default withStyles(styles)(ProgressWidget); |
