Fixes #197: Redesign shop single item view

[alvyynm]

Have you read the contributing guidelines ?

What is the purpose of your pull request?

• [X] Bug fix
• [ ] New feature

Proposed changes

This PR fixes #197.

It changes the design of a single item view from this 👇:

https://github.com/SpaceyaTech/SYT-Web-Redesign/assets/40637276/e92cf7bd-fefd-4818-98ae-d81d1d24dea5

To this 👇:

https://github.com/SpaceyaTech/SYT-Web-Redesign/assets/40637276/282461ee-2371-4059-9dee-896183239b26

Additionally, I've made some extra improvements:

• Fixed several accessibility and SEO performance issues
• Created a formatPrice utility function to display prices in the form 2,000 (or 200 if < 1000) instead of 2000.00

NOTE

• I created a dummyCartData array to use in order to redesign the cart drawer found at src/APP/components/shop/CartDrawer.jsx. I chose this approach to save time because there's an existing bug that prevents items from being added to the cart. We can prioritise bug fixing later.
• The design changes won't be visible because of an existing issue I raised (#205). Unless, of course, the fix I submitted in (#206) is merged.

Warning

Please read these points carefully and answer honestly with an X into all the boxes. Example : [X]

Before submitting a pull request make sure you have:

• [X] Read the guidelines for contributing.
• [ ] Wrote some tests.
• [X] Respected the linting guidelines.

• ---

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
syt-web-redesign	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 9, 2024 8:28am

[alvyynm]

I've noticed there's a lot of merge conflicts with the Dev branch. Some changes included in #199 touch the entire shop section of the website. And, as we discussed with @sonylomo on WhatsApp, there's also style issues especially on the homepage.

Perhaps we can reverse #199 first? I know these will be hectic to resolve for anyone working on the shop and created a branch before the PR. I've tried it and I can't tell what to keep and what to remove (Or could it be a skill issue? 😆).

What do you guys think @sonylomo @bridgitkanini @Ase020

[Ase020]

I've noticed there's a lot of merge conflicts with the Dev branch. Some changes included in #199 touch the entire shop section of the website. And, as we discussed with @sonylomo on WhatsApp, there's also style issues especially on the homepage.

Perhaps we can reverse #199 first? I know these will be hectic to resolve for anyone working on the shop and created a branch before the PR. I've tried it and I can't tell what to keep and what to remove (Or could it be a skill issue? 😆).

What do you guys think @sonylomo @bridgitkanini @Ase020

@alvyynm I've also noticed and tried to resolve the conflict on the Dev. I've seen dust there 😂. We could schedule a meeting and come up with a way on how to handle. @JimmyOty is a good DevOps engineer he could also help us with this.

[alvyynm]

@Ase020 😂 I thought it's a skill issue on my end. Well, let's wait and see what other members have to say.