refactor: update collection mobile responsiveness for better UX

[CMI-James]

Description

Closes #128

Changes proposed

What were you told to do?

Tasked to improve the mobile responsiveness of the collection page

What did you do?

Check List (Check all the applicable boxes)

🚨Please review the contribution guideline for this repository.

• My code follows the code style of this project.
• This PR does not contain plagiarized content.
• The title and description of the PR is clear and explains the approach.
• I am making a pull request against the dev branch (left side).
• My commit messages styles matches our requested structure.
• My code additions will fail neither code linting checks nor unit test.
• I am only making changes to files I was requested to.

Screenshots/Videos

[netlify]

✅ Deploy Preview for starkbid ready!

Name	Link
🔨 Latest commit	744ebfc
🔍 Latest deploy log	https://app.netlify.com/projects/starkbid/deploys/6891147805cdd60008bfded5
😎 Deploy Preview	https://deploy-preview-143--starkbid.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.

[netlify]

✅ Deploy Preview for starkbid-stable ready!

Name	Link
🔨 Latest commit	744ebfc
🔍 Latest deploy log	https://app.netlify.com/projects/starkbid-stable/deploys/6891147859bf1600080f47cc
😎 Deploy Preview	https://deploy-preview-143--starkbid-stable.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.

[DioChuks]

this changes applies to screen size 425px, and it doesnt work well for 375px screen size.