From ae0dbc51652046781302bce5ce7af811b803e8da Mon Sep 17 00:00:00 2001 From: EjPlatzer Date: Mon, 19 Aug 2024 16:23:11 -0400 Subject: [PATCH] Improve Enrollment Check in styles --- .../EnrollmentCheckIn.module.scss | 19 -- .../EmergencyContactUpdate/index.jsx | 11 +- .../components/MajorHolds/index.jsx | 41 --- .../components/MinorHolds/index.jsx | 29 --- .../EnrollmentCheckInWelcome/index.jsx | 194 +++++++++++---- src/views/EnrollmentCheckIn/index.jsx | 234 ++++++++---------- 6 files changed, 251 insertions(+), 277 deletions(-) delete mode 100644 src/views/EnrollmentCheckIn/EnrollmentCheckIn.module.scss delete mode 100644 src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MajorHolds/index.jsx delete mode 100644 src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MinorHolds/index.jsx diff --git a/src/views/EnrollmentCheckIn/EnrollmentCheckIn.module.scss b/src/views/EnrollmentCheckIn/EnrollmentCheckIn.module.scss deleted file mode 100644 index 0d5f9ed16d..0000000000 --- a/src/views/EnrollmentCheckIn/EnrollmentCheckIn.module.scss +++ /dev/null @@ -1,19 +0,0 @@ -.enrollmentCheckIn { - .checkIn_header { - background-color: var(--mui-palette-primary-main); - color: var(--mui-palette-primary-contrastText); - padding: 30px; - font-size: 40px; - } - - .button_container { - Button:disabled { - background-color: var(--mui-palette-neutral-dark); - } - - :global(.MuiButton-contained) { - background-color: var(--mui-palette-secondary-main); - color: var(--mui-palette-secondary-contrastText); - } - } -} \ No newline at end of file diff --git a/src/views/EnrollmentCheckIn/components/EmergencyContactUpdate/index.jsx b/src/views/EnrollmentCheckIn/components/EmergencyContactUpdate/index.jsx index d013a56239..4ebe66127d 100644 --- a/src/views/EnrollmentCheckIn/components/EmergencyContactUpdate/index.jsx +++ b/src/views/EnrollmentCheckIn/components/EmergencyContactUpdate/index.jsx @@ -10,7 +10,6 @@ import { Typography, } from '@mui/material'; // @TODO CSSMODULES - outside directory -import styles from '../../EnrollmentCheckIn.module.css'; import { phoneMaskINTL, phoneMaskUS } from '../UpdatePhone'; const EmergencyContactUpdate = ({ @@ -114,7 +113,7 @@ function createEmergencyContactFields( - + First Name @@ -127,7 +126,7 @@ function createEmergencyContactFields( - + Last Name @@ -141,7 +140,7 @@ function createEmergencyContactFields( - + Relationship @@ -155,7 +154,7 @@ function createEmergencyContactFields( - + Home Phone @@ -181,7 +180,7 @@ function createEmergencyContactFields( - + Mobile Phone diff --git a/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MajorHolds/index.jsx b/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MajorHolds/index.jsx deleted file mode 100644 index d49dff8f96..0000000000 --- a/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MajorHolds/index.jsx +++ /dev/null @@ -1,41 +0,0 @@ -import { Grid, Typography } from '@mui/material'; - -const MajorHolds = ({ holds }) => ( - - - Review Your Holds - - - According to our systems, you should contact the following department(s) in order to clear up - certain administrative holds before beginning the check-in process. - -
    - {holds?.RegistrarHold && ( -
  • - You have a "Registration Hold". Please contact the Registrar's Office at{' '} - (978)-867-4243 or registrar@gordon.edu -
    • - )} - {holds?.HighSchoolTranscriptHold && ( -
  • - You have a "High School Transcript Hold". Please contact the Registrar's Office at{' '} - (978)-867-4243 or registrar@gordon.edu -
    • - )} - {holds?.FinancialHold && ( -
  • - You have a "Financial Hold". Please contact Student Financial Services at{' '} - (978) 867-4246 or sfs@gordon.edu. -
    • - )} - {holds?.MedicalHold && ( -
  • - You have a "Medical Hold". Please contact the Health Center at (978)-867-4300 or{' '} - healthcenter@gordon.edu. -
    • - )} -
- -); - -export default MajorHolds; diff --git a/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MinorHolds/index.jsx b/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MinorHolds/index.jsx deleted file mode 100644 index e32edd7b8a..0000000000 --- a/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/components/MinorHolds/index.jsx +++ /dev/null @@ -1,29 +0,0 @@ -import { Grid, Typography } from '@mui/material'; - -const MinorHolds = ({ holds }) => ( - - - Even though you can still check in while maintaining the following holds, you should contact - the following department(s) at your earliest availability: - -
    - {holds?.LaVidaHold && ( -
  • - You have a "La Vida Hold". Students are required to complete Discovery or La Vida in their - first year at Gordon College. Please contact the Registrar's Office at{' '} - (978) 867-4243 or registrar@gordon.edu so that - we can register you for Discovery or La Vida. -
    • - )} - {holds?.MajorHold && ( -
  • - You have a "Declaration of Major Hold". Please contact the Registrar's Office at{' '} - (978)-867-4243 or registrar@gordon.edu to - discuss declaring a major. -
    • - )} -
- -); - -export default MinorHolds; diff --git a/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/index.jsx b/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/index.jsx index a8dfc265ff..0d254554ad 100644 --- a/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/index.jsx +++ b/src/views/EnrollmentCheckIn/components/EnrollmentCheckInWelcome/index.jsx @@ -1,71 +1,167 @@ import { Grid, Typography } from '@mui/material'; -import { useUser } from 'hooks'; -// @TODO CSSMODULES - outside directory -import styles from '../../EnrollmentCheckIn.module.css'; -import MajorHolds from './components/MajorHolds'; -import MinorHolds from './components/MinorHolds'; const EnrollmentCheckInWelcome = ({ hasMajorHold, holds }) => { const hasMinorHold = holds?.LaVidaHold || holds?.DeclarationOfMajorHold; - const { profile } = useUser(); return ( - + - - Enrollment Check-In - - - Hello, {profile.FirstName}! Welcome to a new semester at Gordon College! Please take a few - moments to complete the check-in process in order to confirm your academic enrollment and - help Gordon College plan to provide services to you. + + Welcome to a new semester at Gordon College! Please take a few moments to complete the + check-in process in order to confirm your academic enrollment and help Gordon College plan + to provide services to you. -
- - {hasMajorHold && } - {holds?.MustRegisterForClasses && ( // If a student is not registered for courses they cannot check in - - - Register for Courses + {hasMajorHold && ( + + + Review Your Holds + + + According to our systems, you should contact the following department(s) in order to + clear up certain administrative holds before beginning the check-in process. + + + + )} + {holds?.MustRegisterForClasses && ( // If a student is not registered for courses they cannot check in + + + Register for Courses + + + Before you can check in, you must be registered for courses. + + {holds.NewStudent ? ( // If a student is first year and not registered, display a special prompt + + You will meet with your advisor during Orientation and he/she can register you. The + name of your advisor can be found by logging onto{' '} + + my.gordon.edu + {' '} + and clicking on the Student tab. You will see your advisor(s) listed under "My + Advisors and Majors". - - Before you can check in, you must be registered for courses. + ) : ( + // Otherwise display a standard registration prompt + + Please view the{' '} + + Course Schedule + {' '} + and send an email to{' '} + + registrar@gordon.edu + {' '} + with a list of courses you would like to register for. - {holds.NewStudent ? ( // If a student is first year and not registered, display a special prompt - - You will meet with your advisor during Orientation and he/she can register you. The - name of your advisor can be found by logging onto{' '} - - my.gordon.edu + )} + + )} + {hasMinorHold && ( + + + Even though you can still check in while maintaining the following holds, you should + contact the following department(s) at your earliest availability: + + + + )} + If you are planning to withdraw or take a leave of absence, please contact Student Life at{' '} - (978)-867-4263 or{' '} - studentlife@gordon.edu + + (978) 867-4263 + {' '} + or{' '} + + studentlife@gordon.edu + -
- - Begin the Check-In Process + + Begin the Check-In Process {hasMajorHold ? ( // If the student has a major hold, display this prompt to resolve them diff --git a/src/views/EnrollmentCheckIn/index.jsx b/src/views/EnrollmentCheckIn/index.jsx index f3f9f50c36..b457d96a1f 100644 --- a/src/views/EnrollmentCheckIn/index.jsx +++ b/src/views/EnrollmentCheckIn/index.jsx @@ -1,4 +1,4 @@ -import { Box, Button, Card, CardHeader, Grid } from '@mui/material'; +import { Button, Card, CardActions, CardContent, CardHeader, Grid } from '@mui/material'; import GordonUnauthenticated from 'components/GordonUnauthenticated'; import GordonLoader from 'components/Loader'; import { useUser } from 'hooks'; @@ -12,7 +12,6 @@ import CompletedCheckIn from './components/CompletedCheckIn'; import ConfirmCheckIn from './components/ConfirmCheckIn'; import PrivacyAgreement from './components/PrivacyAgreement'; // import RaceEthnicity from './components/RaceEthnicity'; -import styles from './EnrollmentCheckIn.module.css'; const steps = [ 'Main Form', @@ -265,152 +264,121 @@ const EnrollmentCheckIn = (props) => { return ; } else { return ( - + - + - - - - - - {activeStep === 0 && ( - - )} - - {activeStep === 1 && ( - - )} - - {activeStep === 2 && ( - - )} - - {activeStep === 3 && ( - - )} - - {/* {activeStep === 4 && ( + + {activeStep === 0 && ( + + )} + + {activeStep === 1 && ( + + )} + + {activeStep === 2 && ( + + )} + + {activeStep === 3 && ( + + )} + + {/* {activeStep === 4 && ( )} */} - {activeStep === 4 && ( - - )} - {activeStep === 5 && } - - - + {activeStep === 4 && ( + + )} + {activeStep === 5 && } + + + {activeStep > 0 && activeStep < steps.length - 1 && ( -
+ + )} + {activeStep < steps.length - 2 && ( - - - - - - - - - - - + {activeStep === 0 ? 'Begin Check-In' : 'Next'} + + + )} + {activeStep === steps.length - 2 && ( + + - - + )} +