Enhance UI and Add New Functionalities for Interactive Map and Theme …

[smog-root]

Issue: #254

Kindly add all labels and assign me! @multiverseweb

1. Preloader Enhancements:

• Adds a 3-second preloader display before the main content loads.
• Hides the preloader after load completion, ensuring a smooth initial load experience.

2. Navbar Scroll Behavior:

• Implements scroll-based visibility for the navbar, hiding it on scroll down and showing it on scroll up for better visibility of the main content.

3. Dynamic Map Markers:

• Fetches and displays markers for multiple cities on the map using OpenStreetMap API.
• Adds error handling for API requests and displays markers only when coordinates are available.

4. Dark and Light Mode with System Default Support:

• Adds theme toggling with options for light, dark, and system-default themes.
• Saves the theme preference to localStorage to persist settings across sessions.
• Includes smooth indicator animations for active theme display.

5. Form Validation and Local Storage Support:

• Implements validation for the feedback form to ensure all fields are filled and the email format is correct.
• Saves form data to localStorage on successful validation.

6. Section Animation on Scroll:

• Adds animation effects to each section on scroll for a more engaging user experience.

7. Miscellaneous Updates:

• Adds copyright display with the current year.
• Refactors event listeners and utility functions for better readability and modularity.

Testing:

• Manually tested all features across different themes and browser windows.
• Verified map markers load correctly for predefined cities.

[github-actions]

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

[netlify]

✅ Deploy Preview for multiverse-dataverse ready!

Name	Link
🔨 Latest commit	8e3d289
🔍 Latest deploy log	https://app.netlify.com/sites/multiverse-dataverse/deploys/67257881f83aae00085d8d5e
😎 Deploy Preview	https://deploy-preview-259--multiverse-dataverse.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.

[smog-root]

@multiverseweb merge it!!

[smog-root]

I have solved conflict!! merge it! @multiverseweb

[github-actions]

🎉🎉 Thank you for your contribution! Your PR #259 has been merged! 🎉🎉

[multiverseweb]

@smog-root there are some bugs this PR has introduced in the website, so I'm reverting it. Kindly fix the bugs and create a new PR for the same. Here are the bugs:

• Auto scroll of examples not working
  

• Angle of airplane in the map not changing
  

And many more.....
Look for the functions you have removed from script.js file.
Examples of such removed functions are autoScroll, updateAngle, etc. you can find them here.