diff options
21 files changed, 143 insertions, 65 deletions
diff --git a/client/src/components/Header/Header.module.css b/client/src/components/Header/Header.module.css index daf82ef..ade1e6f 100644 --- a/client/src/components/Header/Header.module.css +++ b/client/src/components/Header/Header.module.css @@ -16,6 +16,6 @@ } .header__image { - width: 250px; - height: 250px; + width: 150px; + height: 150px; } diff --git a/client/src/components/LabelCard/LabelCard.module.css b/client/src/components/LabelCard/LabelCard.module.css index 8511596..3b80827 100644 --- a/client/src/components/LabelCard/LabelCard.module.css +++ b/client/src/components/LabelCard/LabelCard.module.css @@ -12,6 +12,8 @@ .card__image { border: 3px solid var(--color-black); border-radius: 10px; + width: 158px; + height: 158px; } .card__title { diff --git a/client/src/components/UpdateInput/UpdateInput.module.css b/client/src/components/UpdateInput/UpdateInput.module.css index d4d7ee5..391937d 100644 --- a/client/src/components/UpdateInput/UpdateInput.module.css +++ b/client/src/components/UpdateInput/UpdateInput.module.css @@ -1,8 +1,13 @@ +.input__edit { + display: flex; + flex-direction: row; +} + .input { display: flex; justify-content: center; font-family: 'Barlow'; - font-size: var(--font-medium-s); + font-size: 1.75rem; } .input__container { @@ -10,16 +15,12 @@ flex-direction: column; } -.input__edit { - display: flex; - flex-direction: row; -} - .input__field { - width: 330px; + width: 500px; + height: 80px; margin: 10px 0px; padding: 18px 10px; border: 3px solid; border-radius: 10px; - font-size: 1rem; -} + font-size: 1.5rem; +}
\ No newline at end of file diff --git a/client/src/index.css b/client/src/index.css index 4a8cd4f..ccca7a6 100644 --- a/client/src/index.css +++ b/client/src/index.css @@ -24,3 +24,9 @@ code { font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; } + +.MuiOutlinedInput-input { + border: none !important; + border-color: aqua; + font-size: 1.5rem !important; +} diff --git a/client/src/pages/Enrollment/Address/Address.jsx b/client/src/pages/Enrollment/Address/Address.jsx index fc27448..cb2db5a 100644 --- a/client/src/pages/Enrollment/Address/Address.jsx +++ b/client/src/pages/Enrollment/Address/Address.jsx @@ -29,10 +29,11 @@ const Address = () => { const customStyles = { control: (base) => ({ ...base, - width: '330px', - height: '60px', + width: '500px', + height: '80px', margin: '10px 0px', border: '3px solid', + fontSize: '1.5rem', borderRadius: '10px !important' }), input: (base) => ({ diff --git a/client/src/pages/Enrollment/Address/Address.module.css b/client/src/pages/Enrollment/Address/Address.module.css index eafa781..612d233 100644 --- a/client/src/pages/Enrollment/Address/Address.module.css +++ b/client/src/pages/Enrollment/Address/Address.module.css @@ -15,3 +15,7 @@ font-family: 'Barlow'; font-size: var(--font-medium-s); } + +.input__container label { + font-size: 1.75rem; +} diff --git a/client/src/pages/Enrollment/Agreement/Agreement.jsx b/client/src/pages/Enrollment/Agreement/Agreement.jsx index 5b7950b..704b0d5 100644 --- a/client/src/pages/Enrollment/Agreement/Agreement.jsx +++ b/client/src/pages/Enrollment/Agreement/Agreement.jsx @@ -46,7 +46,7 @@ const Agreement = ({ unverified, setUnverified }) => { }, 30000) } - const description = ['CLICK_ON_SEND_OTP', 'YOU_WILL_RECIEVE_AN_OTP_ON_YOUR_MOBILE_NUMBER', 'YOU_CAN_RESEND_THE_OTP_AFTER_30_SECONDS_IF_YOU_HAVENT_RECEIVED_IT_YET', 'CLICK_ON_VERIFY_OTP_TO_VERIFY_YOUR_MOBILE_NUMBER'] + const description = ['CLICK_ON_SEND_OTP', 'YOU_WILL_RECIEVE_AN_OTP_ON_YOUR_MOBILE_NUMBER', 'YOU_CAN_RESEND_THE_OTP_AFTER_30_SECONDS_IF_YOU_HAVENT_RECEIVED_IT_YET', 'CLICK_ON_VERIFY_OTP_TO_VERIFY_YOUR_MOBILE_NUMBER'] return ( <> @@ -73,14 +73,14 @@ const Agreement = ({ unverified, setUnverified }) => { /> </div> <div className={styles.card__elements}> - <Typography>{t('PLEASE_VERIFY_YOUR_IDENTITY')}</Typography> + <Typography sx={{ fontSize: '1.5rem' }}>{t('PLEASE_VERIFY_YOUR_IDENTITY')}</Typography> <Button color="primary" size="large" type="submit" variant="contained" disabled={disabled} - sx={{ marginTop: '1rem' }} + sx={{ marginTop: '1rem', fontSize: '1.5rem', padding: '10px 30px' }} onClick={() => { mutate() setDisabled(true) diff --git a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx index 2e40523..d76bcb0 100644 --- a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx +++ b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx @@ -76,7 +76,7 @@ const DocumentScanner = () => { {documents[doc] === '' ? ( <Webcam audio={false} - height={400} + height={500} ref={webcamRef} screenshotFormat="image/jpeg" width={600} @@ -104,7 +104,7 @@ const DocumentScanner = () => { size="large" type="submit" variant="contained" - sx={{ margin: '0px 20px' }} + sx={{ margin: '0px 20px', fontSize: '1.5rem', padding: '10px 30px' }} onClick={(e) => { e.preventDefault() capture(doc) @@ -117,7 +117,7 @@ const DocumentScanner = () => { size="large" type="submit" variant="contained" - sx={{ margin: '0px 20px' }} + sx={{ margin: '0px 20px', fontSize: '1.5rem', padding: '10px 30px' }} onClick={(e) => { e.preventDefault() doccu[doc] = '' @@ -135,7 +135,7 @@ const DocumentScanner = () => { <br></br> <div> <div> - <Typography align="center"> + <Typography align="center" sx={{ fontSize: '1.5rem' }}> {t('KINDLY_CLICK_THE_PICTURE_OF_YOUR_DOCUMENTS')} </Typography> </div> @@ -156,7 +156,7 @@ const DocumentScanner = () => { <li className="list__item"> {t('CONSISTS_OF_3_STEPS')} <ul> - <li>{t('PROOF_OF_IDENTITY')} </li> + <li className={styles.stepper__items}>{t('PROOF_OF_IDENTITY')} </li> <li>{t(t('PROOF_OF_ADDRESS'))}</li> <li>{t('PROOF_OF_DOB')} </li> </ul> diff --git a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.module.css b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.module.css index 11cd176..734601e 100644 --- a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.module.css +++ b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.module.css @@ -47,4 +47,8 @@ .container { display: flex; align-items: center; +} + +stepper__items { + font-size: 1.5rem; }
\ No newline at end of file diff --git a/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx b/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx index e2fe104..9bf9adb 100644 --- a/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx +++ b/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx @@ -38,6 +38,7 @@ const Fingerprint = () => { size="large" type="submit" variant="contained" + sx={{ margin: '20px 0px', fontSize: '1.5rem', padding: '10px 30px' }} > {t('SCAN')} </Button> @@ -48,6 +49,7 @@ const Fingerprint = () => { size="large" type="submit" variant="contained" + sx={{ margin: '20px 0px', fontSize: '1.5rem', padding: '10px 30px' }} > {t('RESET')} </Button> @@ -56,7 +58,7 @@ const Fingerprint = () => { <br></br> <div> <Grid container justifyContent="center"> - <Typography align="center"> + <Typography align="center" sx={{ fontSize: '1.5rem' }}> {t('PLEASE_PUT_YOUR_FINGERS_ON_THE_FINGERPRINT_SCANNER')} <br /> {t('WAIT_FOR_PROMPT_AND_BEEP_SOUND_TO_REMOVE_YOUR_FINGERS')} diff --git a/client/src/pages/Enrollment/FormOne/FormOne.jsx b/client/src/pages/Enrollment/FormOne/FormOne.jsx index da05ed4..4b588b0 100644 --- a/client/src/pages/Enrollment/FormOne/FormOne.jsx +++ b/client/src/pages/Enrollment/FormOne/FormOne.jsx @@ -78,7 +78,7 @@ const FormOne = () => { }} required /> - <label htmlFor="indian">{t('INDIAN_RESIDENT')}</label> + <label htmlFor="indian" className={styles.label}>{t('INDIAN_RESIDENT')}</label> </span> <span className={styles.formone__resident}> <input @@ -94,7 +94,7 @@ const FormOne = () => { }} required /> - <label htmlFor="non-resident-indian"> + <label className={styles.label} htmlFor="non-resident-indian"> {t('NON_RESIDENTIAL_INDIAN')} </label> </span> @@ -158,19 +158,30 @@ const FormOne = () => { <div className={styles.formone__dob}> <label htmlFor="dob">{t('DATE_OF_BIRTH')}</label> - <LocalizationProvider dateAdapter={AdapterMoment}> - <MobileDatePicker - inputFormat="MM/DD/yyyy" - value={userData.dob} - onChange={(e) => { - setUserData({ - ...userData, - dob: e - }) - }} - renderInput={(params) => <TextField sx={{ '& fieldset': { border: 'none' } }} className={styles.formone__dob_input} {...params} />} - /> - </LocalizationProvider> + <div style={{ marginRight: '160px' }}> + <LocalizationProvider dateAdapter={AdapterMoment}> + <MobileDatePicker + inputFormat="MM/DD/yyyy" + value={userData.dob} + onChange={(e) => { + setUserData({ + ...userData, + dob: e + }) + }} + renderInput={(params) => <TextField + placeholder="MM/DD/yyyy" sx={{ + '& fieldset': { + width: '500px', + height: '80px', + border: '3px solid !important', + borderRadius: '10px', + fontSize: '1.5rem' + } + }} {...params} />} + /> + </LocalizationProvider> + </div> {/* <input className={styles.formone__dob_input} type="date" diff --git a/client/src/pages/Enrollment/FormOne/FormOne.module.css b/client/src/pages/Enrollment/FormOne/FormOne.module.css index ce49470..80bb70e 100644 --- a/client/src/pages/Enrollment/FormOne/FormOne.module.css +++ b/client/src/pages/Enrollment/FormOne/FormOne.module.css @@ -46,6 +46,7 @@ .formone__dob label { font-size: 1.75rem; + margin-bottom: 10px; } .formone__dob_input { @@ -57,3 +58,7 @@ border-radius: 10px; font-size: 1.5rem; } + +.label { + font-size: 1.75rem; +}
\ No newline at end of file diff --git a/client/src/pages/Enrollment/IrisScan/IrisScan.jsx b/client/src/pages/Enrollment/IrisScan/IrisScan.jsx index c1ab2c7..24ce25c 100644 --- a/client/src/pages/Enrollment/IrisScan/IrisScan.jsx +++ b/client/src/pages/Enrollment/IrisScan/IrisScan.jsx @@ -38,6 +38,7 @@ const IrisScan = () => { size="large" type="submit" variant="contained" + sx={{ fontSize: '1.5rem', padding: '10px 30px' }} > {t('SCAN')} </Button> @@ -48,6 +49,7 @@ const IrisScan = () => { size="large" type="submit" variant="contained" + sx={{ fontSize: '1.5rem', padding: '10px 30px' }} > {t('RESET')} </Button> @@ -56,7 +58,7 @@ const IrisScan = () => { <br></br> <div> <Grid container justifyContent="center"> - <Typography align="center"> + <Typography align="center" sx={{ fontSize: '1.5rem' }}> {t('PLEASE_PUT_YOUR_EYES_INSIDE_THE_IRIS_SCANNER')} <br /> {t('WAIT_FOR_PROMPT_AND_BEEP_SOUND_TO_REMOVE_YOUR_EYES')} diff --git a/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx b/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx index fd5a051..b5a800b 100644 --- a/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx +++ b/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx @@ -20,7 +20,7 @@ const PhotoCapture = () => { setUserData({ ...userData, photo: imageSrc }) }) - const description = ['ENSURE_THAT_YOUR_PHOTO_IS_CLEAR_AND_IN_FOCUS', 'ALSO_ENSURE_THAT_YOU_ARE_IN_THE_CENTER_OF_YOUR_PHOTO', 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_CAPTURED_A_CLEAR_AND_CENTERED_PHOTO'] + const description = ['ENSURE_THAT_YOUR_PHOTO_IS_CLEAR_AND_IN_FOCUS', 'ALSO_ENSURE_THAT_YOU_ARE_IN_THE_CENTER_OF_YOUR_PHOTO', 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_CAPTURED_A_CLEAR_AND_CENTERED_PHOTO'] return ( <> @@ -61,6 +61,7 @@ const PhotoCapture = () => { size="large" type="submit" variant="contained" + sx={{ fontSize: '1.5rem', padding: '10px 30px' }} onClick={(e) => { e.preventDefault() capture() @@ -75,6 +76,7 @@ const PhotoCapture = () => { size="large" type="submit" variant="contained" + sx={{ fontSize: '1.5rem', padding: '10px 48px' }} onClick={(e) => { e.preventDefault() setUserData({ ...userData, photo: '' }) @@ -87,7 +89,7 @@ const PhotoCapture = () => { <br></br> <div> <Grid container justifyContent="center"> - <Typography align="center"> + <Typography align="center" sx={{ fontSize: '1.25rem' }}> {t('PLEASE_LOOK_INTO_THE_CAMERA')} <br></br> {t('CLICK_CAPTURE_TO_CAPTURE_THE_PHOTO')} diff --git a/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css b/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css index a1ff9c0..ad193e1 100644 --- a/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css +++ b/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.module.css @@ -2,4 +2,4 @@ display: flex; justify-content: center; margin: 10px; -} +}
\ No newline at end of file diff --git a/client/src/pages/Update/Address/Address.jsx b/client/src/pages/Update/Address/Address.jsx index 39d3f13..ad0c023 100644 --- a/client/src/pages/Update/Address/Address.jsx +++ b/client/src/pages/Update/Address/Address.jsx @@ -29,11 +29,12 @@ const Address = () => { const customStyles = { control: (base) => ({ ...base, - width: '330px', - height: '60px', + width: '500px', + height: '80px', margin: '10px 0px', border: '3px solid', - borderRadius: '10px !important' + borderRadius: '10px !important', + fontSize: '1.5rem' }), input: (base) => ({ ...base, @@ -106,7 +107,7 @@ const Address = () => { placeholder={t('ENTER_YOUR_VILLAGE_TOWN')} /> <div className={styles.input__container}> - <label htmlFor="state">{t('STATE')}</label> + <label className={styles.label} htmlFor="state">{t('STATE')}</label> <div className={styles.input__edit}> <Select id="state" @@ -167,7 +168,7 @@ const Address = () => { placeholder={t('ENTER_YOUR_AREA_POST_OFFICE')} /> <div className={styles.input__container}> - <label htmlFor="city">{t('DISTRICT')}</label> + <label className={styles.label} htmlFor="city">{t('DISTRICT')}</label> <div className={styles.input__edit}> <Select id="city" diff --git a/client/src/pages/Update/Address/Address.module.css b/client/src/pages/Update/Address/Address.module.css index ccaca08..0a5198f 100644 --- a/client/src/pages/Update/Address/Address.module.css +++ b/client/src/pages/Update/Address/Address.module.css @@ -20,3 +20,7 @@ display: flex; flex-direction: row; } + +.label { + font-size: 1.75rem; +}
\ No newline at end of file diff --git a/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx b/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx index e4bffc9..4ee8a0a 100644 --- a/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx +++ b/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx @@ -243,14 +243,14 @@ const DocumentScanner = () => { </Stepper> {activeStep === steps.length ? ( steps.length === 0 ? ( - <> + <div className={styles.typo__container}> <Typography variant="h4" sx={{ mt: 8, mb: 1 }}> {t("YOU_HAVEN'T_UPDATED_ANYTHING")} </Typography> - <Typography variant="h4" sx={{ mt: 8, mb: 1 }}> + <Typography variant="h4" sx={{ mb: 1 }}> {t('YOU_MAY_EITHER_UPDATE_OR_MOVE_TO_NEXT_STEP')} </Typography> - </> + </div> ) : ( <Typography variant="h3" sx={{ mt: 8, mb: 1 }}> {t('ALL_STEPS_COMPLETED')} diff --git a/client/src/pages/Update/DocumentScanner/DocumentScanner.module.css b/client/src/pages/Update/DocumentScanner/DocumentScanner.module.css index f73d192..87c9380 100644 --- a/client/src/pages/Update/DocumentScanner/DocumentScanner.module.css +++ b/client/src/pages/Update/DocumentScanner/DocumentScanner.module.css @@ -48,3 +48,11 @@ display: flex; align-items: center; } + +.typo__container { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + margin-top: 180px; +}
\ No newline at end of file diff --git a/client/src/pages/Update/FormOne/FormOne.jsx b/client/src/pages/Update/FormOne/FormOne.jsx index fc7ec1c..730f2cd 100644 --- a/client/src/pages/Update/FormOne/FormOne.jsx +++ b/client/src/pages/Update/FormOne/FormOne.jsx @@ -7,6 +7,10 @@ import Gender from '../../../components/Gender/Gender' import { useTranslation } from 'react-i18next' import { userContext } from '../../../context/User' import PopUpModal from '../../../components/Modal/Modal' +import { MobileDatePicker } from '@mui/x-date-pickers/MobileDatePicker' +import { TextField } from '@mui/material' +import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment' +import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider' const FormOne = () => { const { userData, setUserData } = userContext() @@ -78,23 +82,36 @@ const FormOne = () => { /> <div className={styles.formone__dob}> - <label htmlFor="dob">{t('DATE_OF_BIRTH')}</label> + <label className={styles.label} htmlFor="dob">{t('DATE_OF_BIRTH')}</label> <div className={styles.input__edit}> - <input - className={styles.formone__dob_input} - type="date" - id="dob" - name="dob" - value={userData?.dob} - readOnly={editable} - onChange={(e) => { - setUserData({ - ...userData, - dob: e.target.value - }) - }} - required - /> + <div style={{ marginBlock: '20px' }}> + <div style={{ marginRight: '160px' }}> + <LocalizationProvider dateAdapter={AdapterMoment}> + <MobileDatePicker + inputFormat="MM/DD/yyyy" + value={userData.dob} + className={styles.dob} + disabled={editable} + onChange={(e) => { + setUserData({ + ...userData, + dob: e + }) + }} + renderInput={(params) => <TextField + placeholder="MM/DD/YYYY" sx={{ + '& fieldset': { + width: '500px', + height: '80px', + border: '3px solid !important', + borderRadius: '10px', + fontSize: '1.75rem !important' + } + }} {...params} />} + /> + </LocalizationProvider> + </div> + </div> <EditButton onClick={handleEdit} enabled={!editable ? '1' : '0'} /> </div> </div> diff --git a/client/src/pages/Update/FormOne/FormOne.module.css b/client/src/pages/Update/FormOne/FormOne.module.css index e0cff0e..e186de8 100644 --- a/client/src/pages/Update/FormOne/FormOne.module.css +++ b/client/src/pages/Update/FormOne/FormOne.module.css @@ -45,3 +45,11 @@ display: flex; flex-direction: row; } + +.dob { + border : none; +} + +.label { + font-size: 1.75rem; +}
\ No newline at end of file |