Merge pull request #17 from Blaster4385/develop

Kaand number 2

21 files changed, 144 insertions, 67 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 a1d4b7d..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,20 +158,30 @@ const FormOne = () => {
 
         <div className={styles.formone__dob}>
           <label htmlFor="dob">{t('DATE_OF_BIRTH')}</label>
-          <LocalizationProvider dateAdapter={AdapterMoment}>
-            <MobileDatePicker
-              label="Date mobile"
-              inputFormat="mm/dd/yyyy"
-              value={userData.dob}
-              onChange={(e) => {
-                setUserData({
-                  ...userData,
-                  dob: e
-                })
-              }}
-              renderInput={(params) => <TextField {...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 b83574a..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 {
@@ -53,7 +54,11 @@
   height: 80px;
   margin: 10px 0px;
   padding: 11px 10px;
-  border: 3px solid;
+  border: 3px solid !important;
   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