82 lines
2.8 KiB
TypeScript
82 lines
2.8 KiB
TypeScript
import { Container } from '../../components/Container'
|
|
import { Eyebrow, SectionHeader, P } from '../../components/Texts'
|
|
|
|
const integrationPoints = [
|
|
'Unified Mycelium networking provides secure access to GPU nodes.',
|
|
'Zero-trust security model extends to GPU operations automatically.',
|
|
'Quantum-safe storage available directly to GPU workloads.',
|
|
'Native Kubernetes support exposes GPUs through familiar resources.',
|
|
]
|
|
|
|
const yamlExample = `apiVersion: apps/v1
|
|
kind: Deployment
|
|
metadata:
|
|
name: gpu-workload
|
|
spec:
|
|
replicas: 1
|
|
selector:
|
|
matchLabels:
|
|
app: gpu-compute
|
|
template:
|
|
metadata:
|
|
labels:
|
|
app: gpu-compute
|
|
spec:
|
|
containers:
|
|
- name: gpu-compute
|
|
image: tensorflow/tensorflow:latest-gpu
|
|
resources:
|
|
limits:
|
|
nvidia.com/gpu: 1
|
|
env:
|
|
- name: MYCELIUM_GPU_REGION
|
|
value: "auto"`
|
|
|
|
export function GpuIntegration() {
|
|
return (
|
|
<section className="bg-gray-950 py-24 sm:py-32">
|
|
<Container>
|
|
<div className="mx-auto max-w-3xl text-center">
|
|
<Eyebrow className="tracking-[0.32em] uppercase text-cyan-300">
|
|
Cloud Integration
|
|
</Eyebrow>
|
|
<SectionHeader as="h2" color="light" className="mt-6">
|
|
Seamless with Mycelium Cloud infrastructure.
|
|
</SectionHeader>
|
|
<P color="lightSecondary" className="mt-6">
|
|
GPU workloads plug directly into the same mesh that powers Mycelium
|
|
Cloud. Networking, security, and storage policies flow with every
|
|
deployment.
|
|
</P>
|
|
</div>
|
|
<div className="mt-16 grid gap-10 lg:grid-cols-2">
|
|
<div className="space-y-4 rounded-3xl border border-white/10 bg-white/[0.04] p-8 text-left backdrop-blur-sm">
|
|
<h3 className="text-lg font-semibold text-white">
|
|
Platform alignment
|
|
</h3>
|
|
<ul className="space-y-3 text-sm text-gray-300">
|
|
{integrationPoints.map((point) => (
|
|
<li
|
|
key={point}
|
|
className="flex items-start gap-3 rounded-2xl border border-cyan-500/10 bg-cyan-500/5 p-3 leading-relaxed"
|
|
>
|
|
<span className="mt-1 inline-block size-2 rounded-full bg-cyan-300" />
|
|
<span>{point}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
<div className="rounded-3xl border border-white/10 bg-white/[0.04] p-8 backdrop-blur-sm">
|
|
<h3 className="text-lg font-semibold text-white">
|
|
Kubernetes deployment example
|
|
</h3>
|
|
<pre className="mt-6 overflow-x-auto rounded-2xl border border-white/10 bg-black/70 p-4 text-xs text-cyan-100">
|
|
<code>{yamlExample}</code>
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
)
|
|
}
|