Mobile Project Card

[MathyouMB]

As a user, I want the project card component to display horizontally on mobile so it uses space more efficiently and improves the browsing experience.

---

🧠 Context

Currently, on mobile devices, each project card component stacks its contents vertically—image on top, text below. This layout causes each card to take up significant vertical space, making it harder to browse multiple projects at once.

To improve usability and compactness, we should update the project card layout to display horizontally on small screens (e.g., using a flex row layout). This way, the image and text can sit side-by-side, reducing vertical scrolling.

---

🛠️ Implementation Plan

Utilize a media query and flexbox's flex-direction: {column vs row} to change the way the card is styled

---

✅ Acceptance Criteria

• On small screens, project cards are displayed horizontally with image and text side-by-side
• On larger screens, the current vertical layout is preserved

[nolandruid]

I'm starting work on this issue today. Here's my plan:

Implementation approach: as directed above

Timeline: Before weekend; June 28, 2025

Questions: will direct to discord development channel.

[nolandruid]

Feature has been implemented in a new branch. PR made and status changed.