[YI | CLAIRE] CONNECTING STUDENTS AND THEIR CLASSES

[lillian-tran]

Task Description:

YAY STUDENTS IN CLASS!
We want students to easily manage their classes. When you login using a student account you’ll be taken to the student page, where students can see the classes they’re enrolled in, and actually be able to enroll/unenroll themselves. Style the StudentPortal.jsx page to look similar to this:

Fetching the student’s classes and storing them in an array has already been done, so you’ll just need to actually display them using the Class component. Instead of the plus button for now, you can use the existing Button component with the label “Add” to redirect the user to the main Levels page. For the schedule, we recommend using a table with columns for each day, with the level and time of any classes they’re enrolled in displated. Don’t worry if your work doesn’t look exactly like the screenshot because the design will change, but try your best to get the general layout down. It may be helpful to use map() to display the table columns!

Acceptance Criteria:

• Did you link the ticket/issue number with your branch using the pull request template?
• Does the general layout look similar to the screenshot above (enrolled classes are displayed and there’s a schedule)?
• Does the add/plus button take the user to the Levels page?

References and Resources:

Helpful for displaying table:
https://tailwindcss.com/docs/display
https://tailwindcss.com/docs/table-layout