Fix Up HomePage/Add Pinning to Event Page

[ava-sim]

Fix Up HomePage/Add Pinning to Event Page

Assigned to: Eddy and Haley
Due Date: Thursday Jan 22nd, by 6:30pm

Hellooooo devs!!! Welcome back 2 school! I hope your break was super relaxing and enjoyable :)

Before starting, make sure you’ve pulled the latest main branch and installed all dependencies! (git pull origin main npx prisma generate). Please use the extension prettier so everything is formatted nicely!

---

Summary:

For this ticket we already have the home page made but everything is hard coded. We need to make the page dynamic and make it so that the featured opportunities reroute to the real event (not the overall event page like it currently is doing). Also on the overall event page we want to add the backend that when the admin pins an event it will be shown on the home page (max 2 pinned events).

Recommend Approach

• In src/app/page.tsx is the current code for the homepage

  • Make the page dynamic (it should look good on phone screen width)
  • Bring the feature opportunities closer together (they are weirdly far apart)
  • Make featured opportunities "more details" link take the user to the event details page for that event (Example: /event/[eventId])
  • Double check the Figma and try to make the homepage look as similar as possible (I coded this super fast so some of the details might be off)

• [In src/app/event/page.tsx is the current code for the overall event page

• Add a button or a pin icon like in the Figma that when pressed we check how many pinned events there are (if there are less than 2, pin the event, if there are already 2 then nothing will happen for now)

• Once the event is pinned show it on the home screen

Assets:
Link to figma

Good luck guys! Lmk if you need anything :)