header enhancement index.html

[tejasam571]

Description

This pull request introduces significant enhancements to the header section of the Dataverse web application, aimed at improving both usability and aesthetics. The header is designed using Flexbox, providing a responsive and structured layout that allows for better alignment of elements. The logo is accompanied by two versions—one static and one glowing—to enhance visual appeal and brand recognition. The navigation menu has been centered, ensuring easy access to important links, which are now styled to offer hover effects, enhancing user interactivity and engagement. External stylesheets have been included for Leaflet and Font Awesome, adding functionality and graphical icons that enrich the user experience. The overall code structure is clean and organized, utilizing semantic HTML elements that improve accessibility. Additionally, the use of a placeholder <main> section indicates where future content will be integrated, maintaining a clear separation between the header and the main body of the webpage. These improvements significantly elevate the project's quality, making it more attractive and easier for users to navigate. Forking the project head in GitHub is recommended to integrate these positive updates seamlessly into the existing framework.

Related Issue

Fixes # (issue)

Type of change

• [x] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist

• [x] My code follows the style guidelines of this project
• [x] I have performed a self-review of my own code
• [x] I have commented on my code, particularly in hard-to-understand areas
• [x] I have added tests that prove my fix is effective or that my feature works
• [x] New and existing unit tests pass locally with my changes
• [x] Any dependent changes have been merged and published in downstream modules

before it looked :

now after the changes :

[netlify[bot]]

✅ Deploy Preview for multiverse-dataverse ready!

Name	Link
🔨 Latest commit	12aa8f0f11d214acccf972df77f52bcece414489
🔍 Latest deploy log	https://app.netlify.com/sites/multiverse-dataverse/deploys/6704adbf2d7ade00084ec124
😎 Deploy Preview	https://deploy-preview-85--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.

[tejasam571]

i am both contributing in hacktober fest and gssoc! please do consider .

[tejasam571]

CONTIBUTION of the project "DATAVERSE " on the issue raised is completed ! @say-het @sanjay-kv @shubhrangipathak @MastanSayyad

[MastanSayyad]

@tejasam571 you don't need to tag everyone on your PR just tag the project admin @multiverseweb and it's mentors.

[jency1]

@tejasam571 The option for changing to light mode and dark mode is not there. Hovering Effect can also be improved.

Also in light mode, the text is not visible. So fix all issues to get the PR merged.

[tejasam571]

Sure , I'll send this by today! 🙂