mukup fixes

src/App.css

@@ -183,4 +183,10 @@
     align-content: stretch;
     padding : 35px; 
 }
-
+.register_content{
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: row;
+    justify-content: space-evenly;
+    align-items :stretch;
+}

src/Components/Register/PersonalInfo.js

@@ -1,5 +1,9 @@
+import  { useState } from 'react'
 import { useFormik, Form, FormikProvider } from 'formik'; // import { useNavigate } from 'react-router-dom';
-import { Stack, TextField,Box, Button } from '@mui/material';
+import { Stack, TextField,Box, Button,
+    Backdrop, CircularProgress,
+} from '@mui/material';
+import toast, { Toaster } from 'react-hot-toast';
 import * as Yup from 'yup';
 
 export function PersonalInfo(props) {
@@ -14,6 +18,8 @@ export function PersonalInfo(props) {
         telefono: Yup.number('Ingresa únicamente números').required('Tu numero de telefono es requerido')
     });
 
+    let [open, setOpen] = useState(false);
+
     const formik = useFormik({
         initialValues: {
             nit: client.nit,
@@ -24,12 +30,22 @@ export function PersonalInfo(props) {
         },
         validationSchema: RegisterSchema,
         onSubmit: (values) => {
-            // setOpen(true);
+            setOpen(true);
             // let url = 'http://204.48.25.93:8081/registro'
             // let url = 'http://psicoadmin.ditca.org:8081/registro'
+            console.log(client)
             setClient({
                 ...client, ...values
             })
+
+            setTimeout(() => {
+                let nombre = client.firstName +  " " + client.lastName
+                toast.success(`Bienvenido ${nombre} !!`)
+                setOpen(false);
+            }, 5000)
+
+
+
         }
     });
 
@@ -72,7 +88,7 @@ export function PersonalInfo(props) {
                             type="date"
                             label="Fecha de nacimiento"
                             fullWidth
-                            InputLabelProps={{ shrink: true, required: true }}
+                            InputLabelProps={{  required: true }}
                             {...getFieldProps('nacimiento')}
                             error={Boolean(touched.nacimiento && errors.nacimiento)}
                             helperText={touched.nacimiento && errors.nacimiento}
@@ -108,7 +124,19 @@ export function PersonalInfo(props) {
                     </Box>
 
                 </Stack>
+
             </Form>
+            <Toaster
+                position="top-center"
+                reverseOrder={false}
+            />
+            <Backdrop
+                sx={{ color: '#fd4b4b', zIndex: (theme) => theme.zIndex.drawer + 1 }}
+                open={open}
+                onClick={() => setOpen(false)}
+            >
+                <CircularProgress color="inherit" />
+            </Backdrop>
         </FormikProvider>
     )
 }

src/Pages/Register.jsx

@@ -27,6 +27,10 @@ export function Register() {
         }    
     }, [auth,navigate])
 
+
+//new Date(year, monthIndex, day)
+    const TODAY = new Date()
+
     const [activeStep, setActiveStep] = React.useState(0);
     const [client, setClient] = React.useState({
         firstName: '',
@@ -37,7 +41,7 @@ export function Register() {
         nit: "",
         cui: "",
         direccion: "",
-        fechacumple: "",
+        nacimiento : TODAY.getFullYear() +'-10-18',
         telefono : "",
     });
 
@@ -76,7 +80,7 @@ export function Register() {
 
     return (
         <Container>
-            <Row>
+            <Row className="register_content">
                 <Col md={4}>
         <Card className="card_register">