diff options
author | Eug-VS <eug-vs@keemail.me> | 2020-01-06 02:30:39 +0300 |
---|---|---|
committer | Eug-VS <eug-vs@keemail.me> | 2020-01-06 02:30:39 +0300 |
commit | a12e47a66fc24a9259a79df27130230d587821c1 (patch) | |
tree | ac9d664b154415100e6da8c2a173b9b51b63d456 /src/components/Loading/Loading.js | |
parent | f76a0f4b0e488530c1e715ecaa824fca7790dddd (diff) | |
download | chrono-cube-ui-a12e47a66fc24a9259a79df27130230d587821c1.tar.gz |
Implement Loading component (circular progress)
Diffstat (limited to 'src/components/Loading/Loading.js')
-rw-r--r-- | src/components/Loading/Loading.js | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/src/components/Loading/Loading.js b/src/components/Loading/Loading.js new file mode 100644 index 0000000..632142b --- /dev/null +++ b/src/components/Loading/Loading.js @@ -0,0 +1,32 @@ +import React from 'react'; + +import { + Card, + CardHeader, +} from "@material-ui/core"; + +import { makeStyles } from "@material-ui/core/styles"; +import CircularProgress from '@material-ui/core/CircularProgress'; + + +const useStyles = makeStyles(theme => ({ + root: { + padding: theme.spacing(1), + }, +})); + +const Loading = () => { + const classes = useStyles(); + + return ( + <Card elevation={5} className={classes.root}> + <CardHeader + avatar={(<CircularProgress color="secondary" />)} + title="Loading" + subheader="Please, wait." + /> + </Card> + ) +}; + +export default Loading; |