refactor: add responsive vertical translation to animation SVGs with lg breakpoint

- Changed vertical translate classes to only apply on large screens (lg:) across agent animations (AgentCoordination, DeterministicExecution, Fungistor, Herodb, MOSSandboxes, MyceliumMesh)
- Changed NoCentral home animation from -translate-y-10 to lg:-translate-y-10
- Updated pods animations with mobile-first approach: Connectivity (-translate-y-12 mobile, lg:translate-y-0), DataControl (maintains -translate-y-12 on
This commit is contained in:
2025-11-19 19:01:17 +01:00
parent 3c4da26ecb
commit 7d8ae1d26d
11 changed files with 11 additions and 11 deletions

View File

@@ -132,7 +132,7 @@ export default function AgentCoordination({
aria-label="Agent coordination and sovereign workflow management"
style={{ background: bg }}
>
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full -translate-y-6" preserveAspectRatio="xMidYMid slice">
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full lg:-translate-y-6" preserveAspectRatio="xMidYMid slice">
{/* background */}
<defs>

View File

@@ -103,7 +103,7 @@ export default function DeterministicExecution({
aria-label="Deterministic deployment and verifiable code execution"
style={{ background: bg }}
>
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full -translate-y-6" preserveAspectRatio="xMidYMid slice">
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full lg:-translate-y-6" preserveAspectRatio="xMidYMid slice">
{/* background grid */}
<defs>

View File

@@ -126,7 +126,7 @@ export default function FungiStor({
aria-label="FungiStor, a distributed long-term AI memory"
style={{ background: bg }}
>
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full -translate-y-16" preserveAspectRatio="xMidYMid slice">
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full lg:-translate-y-16" preserveAspectRatio="xMidYMid slice">
{/* Background grid */}
<defs>
<pattern id="grid-dark" width="28" height="28" patternUnits="userSpaceOnUse">

View File

@@ -178,7 +178,7 @@ export default function Herodb({
aria-label="HeroDB, active AI memory retrieval"
style={{ background: bg }}
>
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full -translate-y-18" preserveAspectRatio="xMidYMid slice">
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full lg:-translate-y-18" preserveAspectRatio="xMidYMid slice">
{/* Background grid */}
<defs>
<pattern id="grid-dark" width="28" height="28" patternUnits="userSpaceOnUse">

View File

@@ -124,7 +124,7 @@ export default function MOSSandboxes({
aria-label="MOS Secure Agent Sandboxes"
style={{ background: bg }}
>
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full -translate-y-16" preserveAspectRatio="xMidYMid slice">
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full lg:-translate-y-16" preserveAspectRatio="xMidYMid slice">
{/* BACKGROUND GRID */}
<defs>
<pattern id="grid-dark" width="28" height="28" patternUnits="userSpaceOnUse">

View File

@@ -145,7 +145,7 @@ export default function MyceliumMesh({
aria-label="Mycelium Mesh, a secure communication network"
style={{ background: bg }}
>
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full -translate-y-4" preserveAspectRatio="xMidYMid slice">
<svg viewBox={`0 0 ${W} ${H}`} className="w-full h-full lg:-translate-y-4" preserveAspectRatio="xMidYMid slice">
{/* Background grid */}
<defs>
<pattern id="grid-dark" width="28" height="28" patternUnits="userSpaceOnUse">