Contact us

[Anuragcr07]

Description:
This PR refactors the Contact Us page to align with the overall website theme and design.
The previous version lacked visual consistency and modern styling, which made the page feel disconnected from the rest of the site.

Key Updates:
Redesigned layout using consistent typography, colors, and spacing.
Improved accessibility with proper hierarchy, contrast, and ARIA-friendly elements.
Added motion-based animations (using Framer Motion) for a modern and engaging user experience.
Created a clearer structure for contact details (Mail, Phone, Email, Matrix Chat).
Revamped the social connect section, making community links more interactive and visually cohesive.
Ensured responsiveness across desktop, tablet, and mobile viewports.

Outcome:

A modern, cohesive, and user-friendly Contact Us page that seamlessly integrates with the website’s branding and design language while making it easier for visitors to get in touch with Sugar Labs.

Fixes #446

[github-actions]

❌ Checks Failed

Status: 🚫 Not ready to merge

Please fix the following issues before merging:

📝 Code Linting Failed

Issue: Code formatting or style violations detected.

Specific problems:

• Code formatting issues detected

How to fix:

Platform	Command	Description
🐧 Unix/macOS/Linux	npm run format	Auto-fix all formatting issues
🪟 Windows	npm run format:file <filename>	Fix specific files
🔍 Check Only	npm run format:check	Check formatting without fixing

Need help with linting? Check out the Linting Guide for Windows Users for detailed instructions.

---

🛠️ Next Steps

1. Fix the issues mentioned above
2. Test locally to ensure everything works
3. Push your fixes to this branch
4. Wait for re-check - This bot will automatically run again

🤖 This comment will be updated automatically when you push new commits

[github-actions]

🎉 All Checks Passed!

Status: ✅ Ready to merge

✅ Completed Workflows

Workflow	Status	Details
🔨 Continuous Integration	✅ Passed	Build completed successfully
📝 Code Linting	✅ Passed	All formatting and style checks passed

---

🚀 This PR is ready for review and can be safely merged to main branch!

Great work! Your code meets all quality standards. 👏

[github-actions]

🎉 All Checks Passed!

Status: ✅ Ready to merge

✅ Completed Workflows

Workflow	Status	Details
🔨 Continuous Integration	✅ Passed	Build completed successfully
📝 Code Linting	✅ Passed	All formatting and style checks passed

---

🚀 This PR is ready for review and can be safely merged to main branch!

Great work! Your code meets all quality standards. 👏

[sa-fw-an]

I would suggest you create a mockup page before coding the page, if the design is good, then you can code the page.

[omsuneri]

I would suggest you create a mockup page before coding the page, if the design is good, then you can code the page.

@Anuragcr07 this is what we followed in making of whole website !!

[sa-fw-an]

Thanks for trying @Anuragcr07 , this issue has been fixed in the commit

• Contact-Us UI #467