FIxes #76 feat(timer): Added the countdown feature

[ritankarsaha]

Overview

1. This PR fixes or fixes part of #76 .
2. This PR does the following:
   1. Adds the countdown option to efficiently count down to the final date.
   2. Adds the necessary styling component.
   3. Adds responsiveness to the components for all screens.
   4. Displays a text "BSoC'24 has ended" when the countdown reaches 0 0 0 0 .
   5. The countdown option is updated after every second

      Essential Checklist

• [x ] The PR title starts with "Fix #bugnum: ", followed by a short, clear summary of the changes. (If this PR fixes part of an issue, prefix the title with "Fix part of #bugnum: ...".)
• [x ] "Allow edits from maintainers" is checked. (See here for instructions on how to enable it.)
• [x ] The PR is made from a branch that's not called "main/master".

Proof that changes are correct

https://github.com/bsoc-bitbyte/BSoC-Website/assets/136831315/dfe5761d-1bc5-4c3f-a9ec-4b17a7276899

This video shows the countdown going live.

https://github.com/bsoc-bitbyte/BSoC-Website/assets/136831315/8a289343-1d04-4140-8571-848da631494f

This video shows the counter reaching 0 and finally displaying the text.

PR Pointers

• If you need a review or an answer to a question, and don't have permissions to assign people, leave a comment like the following: "{{Question/comment}} @{{reviewer_username}} PTAL".
• Never force push. If you do, your PR will be closed.

[netlify[bot]]

✅ Deploy Preview for bitbytesummerofcode ready!

Name	Link
🔨 Latest commit	56a7d44c6065ab1ee827f8533909bf6be4c7ce9e
🔍 Latest deploy log	https://app.netlify.com/sites/bitbytesummerofcode/deploys/666950b3e112370008fbe3ab
😎 Deploy Preview	https://deploy-preview-79--bitbytesummerofcode.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 site configuration.

[ritankarsaha]

@ramG-reddy fixed the issue #76 and opened a PR for the same #79

[ramG-reddy]

Yeah implementation looks fine

• I think it would be better if you give it some more margin on top to separate the section from FAQs
• The heading seems small on mobile devices
• The digits are bouncing around as different digits occupy different widths in the font, you could see that happening in the countdown reaching zero video when it changes from 2sec to 1sec and to 0sec. there is some css property which rectifies that behavior.

[ritankarsaha]

@ramG-reddy

Made the necessary changes as desired,

1. gave it an increased top margin to separate it properly from the FAQs section
2. made the heading for smaller devices
3. fixed the bouncing of digits while countdown by adding the monospace attribute in the fonts-family.

Thank You

[ritankarsaha]

@ramG-reddy made the changes

https://github.com/bsoc-bitbyte/BSoC-Website/assets/136831315/7c70881e-f8bc-4481-8e46-ae6478e72adc

Fixed the jumpy nature of digits.

Responsive for smaller devices as well

Fixed the default styles already present in the website