Responsiveness and darkmode is added (#336)

Responsiveness and dark mode is added

## Issues Identification
#266 (Its not responsive


## Description

### Summary
Responsiveness ensures that a website adapts to various screen sizes and
devices, such as desktops, tablets, and smartphones. With mobile usage
continuing to grow, it’s essential for websites to provide a seamless
experience across all platforms. A responsive site enhances user
experience by eliminating the need for zooming or excessive scrolling,
leading to higher engagement and lower bounce rates. It also boosts SEO
performance, as search engines prioritize mobile-friendly websites.

Dark mode offers a darker color scheme with light text, which is
becoming increasingly popular among users. It reduces eye strain,
especially in low-light environments, making it more comfortable for
longer use. Dark mode is also energy-efficient on OLED screens, helping
conserve battery life. Additionally, offering dark mode as an option
caters to user preferences and improves accessibility for those with
certain visual sensitivities.
### Details



_Please check the boxes that apply_

- [ ok] My code follows the style guidelines of this project
- [ ok] I have performed a self-review of my own code
- [ ok] I have commented my code, particularly in hard-to-understand
areas
- [ ok] I have made corresponding changes to the documentation
- [ ok] My changes generate no new warnings
- [ ok] My changes do not break the current system and pass all existing
test cases
- [ok ] I have added tests that prove my fix is effective or that my
feature works
- [ ok] New and existing unit tests pass locally with my changes
- [ ok] Any dependent changes have been merged and published in
downstream modules

## Screenshots

![Screenshot 2024-10-16
154942](https://github.com/user-attachments/assets/9d4b5545-e2b8-4f43-a9db-a776eb71b373)
![Screenshot 2024-10-16
155026](https://github.com/user-attachments/assets/633476d0-ca74-4924-b656-44c469da0c25)
![Screenshot 2024-10-16
155044](https://github.com/user-attachments/assets/48866e19-c672-4f10-9c42-f2fb310328a1)
![Screenshot 2024-10-16
155056](https://github.com/user-attachments/assets/2cd056bc-5785-4ec4-b6e9-6e0c94a2bd4b)
![Screenshot 2024-10-16
155107](https://github.com/user-attachments/assets/ff5b4355-7f6d-4a91-aaf2-b5ec7c666717)
![Screenshot 2024-10-16
162430](https://github.com/user-attachments/assets/99cf0815-889f-4ebf-90e1-64e7f27cf5fb)
![Screenshot 2024-10-16
162510](https://github.com/user-attachments/assets/ccf35854-1a6d-45cf-b58d-4d8fdacae4db)

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}