fix: make navbar and website responsive across all screen sizes

[JANAKIRAM218]

Addressed Issues:

Fixes #30

Screenshots/Recordings:

Added responsive layout improvements across the website, including the mobile navbar, deployment pages, comparison sections, tables, and other responsive components.

Responsive behavior was tested across:

• 320px
• 360px
• 375px
• 414px
• 640px
• 768px
• 1024px
• 1280px

Additional Notes:

This PR improves the responsiveness of the website across different screen sizes, with particular focus on mobile devices.

Main changes include:

• Redesigned the mobile navbar into a clean single-column layout.
• Improved mobile wallet and network controls.
• Fixed horizontal overflow across multiple pages and components.
• Added mobile-friendly card layouts for wide tables.
• Improved responsive layouts for Deployments, Equity, Force Redemption, and Deployment Details.
• Fixed deployment links to use the correct canonical deployment IDs.
• Fixed Next.js image sizing warnings.
• Preserved the existing desktop layout and wallet functionality.

The changes were tested locally and the following checks passed:

• npm run lint
• npx tsc --noEmit
• npm run build

AI Usage Disclosure:

• This PR does not contain AI-generated code at all.
• This PR contains AI-generated code. I have read the AI Usage Policy and this PR complies with this policy. I have tested the code locally and I am responsible for it.

I have used the following AI models and tools:

• ChatGPT
• Cursor

Checklist

• My PR addresses a single issue, fixes a single bug or makes a single improvement.
• My code follows the project's code style and conventions
• If applicable, I have made corresponding changes or additions to the documentation
• If applicable, I have made corresponding changes or additions to tests
• My changes generate no new warnings or errors
• I have joined the Discord server and I will share a link to this PR with the project maintainers there
• I have read the Contribution Guidelines
• Once I submit my PR, CodeRabbit AI will automatically review it and I will address CodeRabbit's comments.
• I have filled this PR template completely and carefully, and I understand that my PR may be closed without review otherwise.

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yml

Review profile: ASSERTIVE

Plan: Team

Run ID: 183f3530-ec39-40d2-9dcd-16297089fd5f

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}