diff options
Diffstat (limited to 'src/pages/Enrollment/PhotoCapture')
| -rw-r--r-- | src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx | 52 | ||||
| -rw-r--r-- | src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css | 5 |
2 files changed, 57 insertions, 0 deletions
diff --git a/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx b/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx new file mode 100644 index 0000000..0b30848 --- /dev/null +++ b/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx @@ -0,0 +1,52 @@ +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/Enrollment/PhotoCapture/PhotoCapture.module.css b/src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css new file mode 100644 index 0000000..ec59f61 --- /dev/null +++ b/src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css @@ -0,0 +1,5 @@ +.card__container { + display: flex; + justify-content: center; + } +
\ No newline at end of file |