feat(challenges): created challenges pages

[magali-la]

🎯Type of Change:

• Feat ✨: New feature or functionality.

This PR...

Adds challenge selection page and challenge tile component variants

---

📝 What I Did:

• Created ChallengeTile.jsx component with Tailwind Variants
• Added responsive height for large tile variant in tablet and mobile screens for uniformity
• Created responsive grid layout for the tiles
• Added flex-1 property on the tags paragraph to avoid the circle nav button from shrinking in width on large tiles

---

🧪 How to Test:

1. Navigate to /challenges page in the Netlify preview.
2. Go to inspect to check responsiveness, ensure all tiles are the same height in column layout
3. Ensure Daily journal tile button routes to the journal page

---

🤔 What I learned:

Learned how flex-1 works in a flex row to distribute space and allow sibling elements from shrinking. Due to the tags being much longer on the large tiles, the flex container was shrinking the button width and looked oval-shaped. Adding the property to the tags

allowed the tags to take up any remaining space without shrinking the button

[netlify]

✅ Deploy Preview for mint-chip ready!

Name	Link
🔨 Latest commit	057b5c4
🔍 Latest deploy log	https://app.netlify.com/projects/mint-chip/deploys/69232ea97e4bed00082677f7
😎 Deploy Preview	https://deploy-preview-29--mint-chip.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.