Frontend: Build the Product List/grid view Component for both light and dark mode

[Lovelyfin00]

Issue Summary

The design for Product Product List/grid view as part of the Product component has been completed and now it needs to be built using our chosen tech stacks. The Product List/grid view has to be inside the Product component story

Figma link

The design for the Product List/grid view can be found here. Please make sure what you build follows the design.

Suggested fix

• Build the Product List / grid view component following the design in the Figma file.
• Make sure your codes are maintainable and legible.
• After coding the component using React and scss, create storybook for the component.
• Test it out on your end and make sure it's working properly.

Coding Rules

• Let your codes look neat and readable
• No unnecessary spacing and always leave one empty line after each code block
• Separate each word with a hyphen - in your scss classes, ids.

PR Rules

• Link the issue your PR is for by saying Fixes #PRNumber
• Add a description of what your PR is about
• Add screenshots or video of the working implementation of your PR

---

Preview

Light mode

---

Dark mode

[naveeng2402]

pl assign me to the issue

[Lovelyfin00]

Hey @naveeng2402
I'd like you to focus on one issue before showing interest in another

[naveeng2402]

Done👍

[Lovelyfin00]

Done with what exactly? @naveeng2402

[shivam-jainn]

Has this issue been assigned to someone else?

[Lovelyfin00]

No @shivam-jainn
You can work on it before I review your other PR

[tripathishipra]

Hi , I am contributor under GSSOC'23 and I am eager to showcase my skills and make a meaningful contribution to this project.
Kindly assign me this issue. @Lovelyfin00

[shivam-jainn]

I am working on it !

…

On Sat, 17 Jun, 2023, 8:27 pm Lovelyfin00, ***@***.***> wrote: No @shivam-jainn <https://github.com/shivam-jainn> You can work on it before I review your other PR — Reply to this email directly, view it on GitHub <#71 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AVSETADFMYPWKJOHN7HJCTLXLXAWRANCNFSM6AAAAAAY7OFQMM> . You are receiving this because you were mentioned.Message ID: ***@***.***>

[tripathishipra]

okay

[PatilHarshh]

@Lovelyfin00 this issue is still open, if yes , I am interested to contribute!

[Lovelyfin00]

Hey @PatilHarshh
It’s not available
There’s already a PR for it
You can checkout other frontend issues and new ones would be created tomorrow