diff options
Diffstat (limited to 'src/pages/PhotoCapture')
| -rw-r--r-- | src/pages/PhotoCapture/PhotoCapture.jsx | 39 | ||||
| -rw-r--r-- | src/pages/PhotoCapture/PhotoCapture.module.css | 5 |
2 files changed, 44 insertions, 0 deletions
diff --git a/src/pages/PhotoCapture/PhotoCapture.jsx b/src/pages/PhotoCapture/PhotoCapture.jsx new file mode 100644 index 0000000..c16b4d0 --- /dev/null +++ b/src/pages/PhotoCapture/PhotoCapture.jsx @@ -0,0 +1,39 @@ +import React from 'react' +import Header from '../../components/Header/Header' +import CardScanner from '../../components/Card/CardScanner' +import styles from './PhotoCapture.module.css' +import { Button, Grid, Typography } from '@mui/material' + +const PhotoCapture = () => { + return ( + <><Header subheading="Enrollment" /> + <div className={styles.card__container}> + <CardScanner + image={`${process.env.PUBLIC_URL}/assets/images/capture.svg`} /> + </div> + <Grid container columnSpacing={10} justifyContent="center"> + <Grid item> + <Button color="primary" size="large" type="submit" variant="contained"> + Capture + </Button> + </Grid> + <Grid item> + <Button color="primary" size="large" type="submit" variant="contained"> + Reset + </Button> + </Grid> + </Grid> + <br></br> + <div> + <Grid container justifyContent="center"> + <Typography align='center'>Please look into the camera<br></br> + Click Capture to Capture the photo<br></br> + Click Reset the remove the captured photo</Typography> + </Grid> + </div> + + </> + ) +} + +export default PhotoCapture diff --git a/src/pages/PhotoCapture/PhotoCapture.module.css b/src/pages/PhotoCapture/PhotoCapture.module.css new file mode 100644 index 0000000..ec59f61 --- /dev/null +++ b/src/pages/PhotoCapture/PhotoCapture.module.css @@ -0,0 +1,5 @@ +.card__container { + display: flex; + justify-content: center; + } +
\ No newline at end of file |