feat: add cloud services dropdown menu in header

- Replaced individual cloud service pages with CallToAction components for Compute, Storage and GPU
- Added dropdown menu in header to consolidate cloud service navigation options
- Removed redundant page components (Compute.tsx, Storage.tsx, Gpu.tsx) that shared identical layouts
- Updated route components to use new CallToAction components
- Added ChevronDownIcon to visually indicate dropdown functionality
This commit is contained in:
2025-10-24 15:50:12 +02:00
parent 11689fdd37
commit 752668b38d
9 changed files with 197 additions and 99 deletions

View File

@@ -1,4 +1,6 @@
import { Link } from 'react-router-dom'
import { Dropdown } from './ui/Dropdown'
import { ChevronDownIcon } from '@heroicons/react/20/solid'
import { Container } from './Container'
import { Button } from './Button'
import pmyceliumLogo from '../images/logos/pmyceliumlogo.png'
@@ -13,12 +15,20 @@ export function Header() {
<img src={pmyceliumLogo} alt="Mycelium" className="h-8 w-auto" />
</Link>
<div className="hidden lg:flex lg:gap-10">
<Link
to="/cloud"
className="text-base/7 tracking-tight text-gray-700 hover:text-cyan-500 transition-colors"
>
Cloud
</Link>
<Dropdown
buttonContent={
<>
Cloud
<ChevronDownIcon className="h-5 w-5" aria-hidden="true" />
</>
}
items={[
{ name: 'Cloud', href: '/cloud' },
{ name: 'Compute', href: '/compute' },
{ name: 'Storage', href: '/storage' },
{ name: 'GPU', href: '/gpu' },
]}
/>
<Link
to="/network"
className="text-base/7 tracking-tight text-gray-700 hover:text-cyan-500 transition-colors"