add max-width to images on learnign-paths

[Touriist]

Current Behavior

The chapters in the learning paths have some humongous images, simply because they take up the full width of the container (width: 100%).

Desired Situation

• add a max-width

---

Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

• 📚 See contributing instructions.
• 🎨 Wireframes and designs for Layer5 site in Figma (open invite)
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack.

Join the Layer5 Community by submitting your community member form.

[Jivi-this-side]

Greetings, @Touriist ! Based on the issue mentioned, I believe the necessary changes should be made here:

layer5/src/components/Learn-Components/Card-Component/learn-card.style.js

Lines 85 to 88 in 711ee7a

	img{
	height: 8.5rem;
	width: 8.5rem;
	}

Specifically, the following adjustments are required:

            max-width: 100%; { to Add max-width }
            object-fit: contain; { Ensures proper image scaling }

Please let me know if my understanding is accurate. I would be delighted to contribute and work on resolving this issue.

Thank you! 🌻

[vr-varad]

Sure! @Jivi-this-side LGTM

[Jivi-this-side]

Greeetings, @vr-varad ! I have submitted the pull request for your review. I kindly request your valuable time to assess the proposed changes.

Thank you for your attention and consideration. I sincerely appreciate the opportunity to contribute. Wishing you a wonderful day ahead!
Thank you ! 🌻