Added Loading Animation

[ramith-kulal]

Title and Issue number

Title : Add loading animation for creating and joining rooms

Issue No. : #37

Code Stack : React, CSS

Close #37

Description

I've added loading animations for both creating and joining rooms. Initially, I included an artificial loading time for testing purposes, as seen in the provided screen recordings. However, I've updated the functionality so that the loading animation only appears during actual loading processes.

Video/Screenshots (mandatory)

https://github.com/sd012gfhkhhvh/Slate.AI/assets/142984776/a52b70fe-c449-4cec-b8d8-c9fdb991e18b

Checklist:

• [X] I have mentioned the issue number in my Pull Request.
• [X] I have commented my code, particularly in hard-to-understand areas
• [X] I have gone through the contributing.md file before contributing

  Additional context (Mandatory )

Are you contributing under any Open-source programme?

Working under JWOC

[vercel[bot]]

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

Name	Status	Preview	Comments	Updated (UTC)
slate-ai	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 24, 2024 3:39pm

[ramith-kulal]

@sd012gfhkhhvh consider this kind request , Could we change the tag from "Medium" to "Hard" on the pull request? It was a bit more challenging than expected.

[sd012gfhkhhvh]

@sd012gfhkhhvh consider this kind request , Could we change the tag from "Medium" to "Hard" on the pull request? It was a bit more challenging than expected.

kindly make pr to the dev branch.

[sd012gfhkhhvh]

@sd012gfhkhhvh consider this kind request , Could we change the tag from "Medium" to "Hard" on the pull request? It was a bit more challenging than expected.

You have created a custom loader in raw css which might feel challenging, you could have used some external libraries for ease. But for your effort of making a custom loader I will think of upgrading the level

[ramith-kulal]

@sd012gfhkhhvh have a look

[sd012gfhkhhvh]

@ramith-kulal ping me up with your full name, githubId,college name etc on discord to keep track of contributors in phase-2