diff options
Diffstat (limited to 'client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx')
| -rw-r--r-- | client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx | 28 |
1 files changed, 26 insertions, 2 deletions
diff --git a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx index d61f16f..3f7b0f6 100644 --- a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx +++ b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx @@ -4,10 +4,10 @@ import Webcam from 'react-webcam' import Header from '../../../components/Header/Header' import styles from './DocumentScanner.module.css' import { Button, Typography, StepLabel, Step, Stepper } from '@mui/material' -import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { useTranslation } from 'react-i18next' import { userContext } from '../../../context/User' import { toast } from 'react-toastify' +import PopUpModal from '../../../components/Modal/Modal' import { useStyles } from './styles' const DocumentScanner = () => { @@ -147,7 +147,31 @@ const DocumentScanner = () => { return ( <> <Header subheading={t('ENROLLMENT')} /> - <SubmitButton /> + <PopUpModal + title="Scan your documents" + image={`${process.env.PUBLIC_URL}/assets/images/document.svg`} + description={ + <> + <ul> + <li className="list__item"> + Consists of 3 steps : + <ul> + <li>Proof of Identity: </li> + <li>Proof of Address: </li> + <li>Proof of Date of Birth: </li> + </ul> + </li> + <li className="list__item"> + Ensure that your documents are in the center of the frame + </li> + <li className="list__item"> + You won't be able to proceed until you have scanned all the + required documents + </li> + </ul> + </> + } + /> <div className={styles.stepper__container}> <div className={styles.box}> <Stepper activeStep={activeStep} sx={{ width: '60%' }}> |