ourworld_web/www_projectmycelium_com
23
0
Fork 0
forked from emre/www_projectmycelium_com
Code Issues 3 Pull Requests Projects Releases Activity

fix: update navigation links to use clean URLs and close mobile menu on click

Browse Source 
- Removed hash-based routing (/#/) in favor of clean URL paths across all navigation links
- Added onClick handlers to close mobile menu when navigation items are clicked
This commit is contained in:
sasha-astiadi
2025-11-07 17:49:20 +01:00
parent 2b5f20f1e9
commit 1f267b057d
2 changed files with 19 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Footer.tsx
View File

@@ -15,16 +15,16 @@ export function Footer() {
</div>
</div>
<nav className="mt-10 flex gap-8">
<Link to="/#/" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
<Link to="/" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
Home
</Link>
<Link to="/#/cloud" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
<Link to="/cloud" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
Cloud
</Link>
<Link to="/#/network" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
<Link to="/network" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
Network
</Link>
<Link to="/#/agents" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
<Link to="/agents" className="text-sm text-gray-700 hover:text-cyan-500 transition-colors">
Agents
</Link>
</nav>
@@ -35,7 +35,7 @@ export function Footer() {
</div>
<div className="ml-4 lg:w-72">
<p className="text-base font-semibold text-gray-900">
<Link to="/#/download">
<Link to="/download">
<span className="absolute inset-0 sm:rounded-2xl" />
Download Mycelium Connector
</Link>

24
src/components/Header.tsx
View File

@@ -9,10 +9,10 @@ import { Dialog } from '@headlessui/react'
import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
const cloudNavItems = [
{ name: 'Cloud', href: '/#/cloud' },
{ name: 'Compute', href: '/#/compute' },
{ name: 'Storage', href: '/#/storage' },
{ name: 'GPU', href: '/#/gpu' },
{ name: 'Cloud', href: '/cloud' },
{ name: 'Compute', href: '/compute' },
{ name: 'Storage', href: '/storage' },
{ name: 'GPU', href: '/gpu' },
]
export function Header() {
@@ -47,13 +47,13 @@ export function Header() {
items={cloudNavItems}
/>
<Link
to="/#/network"
to="/network"
className="text-base/7 tracking-tight text-gray-700 hover:text-cyan-500 transition-colors"
>
Network
</Link>
<Link
to="/#/agents"
to="/agents"
className="text-base/7 tracking-tight text-gray-700 hover:text-cyan-500 transition-colors"
>
Agents
@@ -71,7 +71,7 @@ export function Header() {
>
Deploy Now
</Button>
<Button to="/#/download" variant="solid" color="cyan">
<Button to="/download" variant="solid" color="cyan">
Get Mycelium Connector
</Button>
</div>
@@ -117,19 +117,22 @@ export function Header() {
key={item.name}
to={item.href}
className="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"
onClick={() => setMobileMenuOpen(false)}
>
{item.name}
</Link>
))}
<Link
to="/#/network"
to="/network"
className="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"
onClick={() => setMobileMenuOpen(false)}
>
Network
</Link>
<Link
to="/#/agents"
to="/agents"
className="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"
onClick={() => setMobileMenuOpen(false)}
>
Agents
</Link>
@@ -142,10 +145,11 @@ export function Header() {
target="_blank"
rel="noopener noreferrer"
className="w-full"
onClick={() => setMobileMenuOpen(false)}
>
Start Deployment
</Button>
<Button to="/#/download" variant="solid" color="cyan" className="mt-4 w-full">
<Button to="/download" variant="solid" color="cyan" className="mt-4 w-full" onClick={() => setMobileMenuOpen(false)}>
Get Mycelium Connector
</Button>
</div>