Design UI components and pages

[kuv2707]

Figma file

This is a master issue tracking the development of various UI components which are used throughout the application.

We are in a way making our own framework. The directory src/library contains components which we will use throughout the application.
The directory src/pages contain components which make use of the library components to render the pages mapped to the router in App.tsx.

Reusing components from src/library will bring a uniformity in the UI. That said, the components should be flexible enough to be used at different places(ie, should be configurable via props)

Designing a component includes writing styles, implement the logic for its functionality etc.

Library components

• Design a button component #76
• Design customizable Heading component. #67
• Design a Toast Component. #68
• Design an input component #77

Page components

• Design an error page #21
• Design PlayOptions page #23
• Design the Login Page and the Sign In Page  #79
• Create the HomePage Component of the UNO page #78
• Implement the Game page #95

Notes

• When adding a component to the src/library directory, refactor the application to use that component wherever possible. (This will be done in the commit following the implementation of the library component).
• Make the components as flexible and reusable as possible.
• All design related discussions are being held in this whatsapp group

[sksmagr23]

Can I look after this? I can add create various components required. You can also please tell that what more other components are needed

[kuv2707]

@sksmagr23 You are supposed work on the sub-issues mentioned here. This issue is only there to track the overall progress.

[moksh1tha]

/assign

[shivansh-bhatnagar18]

Thanks for taking this issue! Let us know if you have any questions!

[kuv2707]

This issue is not meant to be assigned to anyone. Please work on the sub-issues