Files
rohitg00__agentmemory/website/components/MemoryGraph.module.css
Rohit Ghumare 7193361b67 refactor(website): rebuild as Next.js 16 App Router app for Vercel
Replaces the vanilla HTML/CSS/JS landing with a production Next.js 16.2
app router build. Deploy target is Vercel; root directory should be
set to 'website/' in the Vercel project settings.

Stack:
- Next.js 16.2 + React 19 + TypeScript 5.7
- next/font for Archivo + JetBrains Mono (no external fetch)
- CSS Modules per component + one globals.css for tokens
- No Tailwind, no bundler config, no client-side routing

Component layout:
- app/layout.tsx           — <html>, font vars, metadata, viewport
- app/page.tsx             — composes all landing sections
- app/globals.css          — design tokens + shared utilities
- components/Nav.tsx       — hexagonal bull mark + menu
- components/Hero.tsx      — title, lede, CTAs
- components/MemoryGraph.tsx   — client canvas animation + hex pause
- components/ScrollProgress.tsx — fixed top gold progress rail
- components/Stats.tsx     — counter-up on first intersect
- components/Primitives.tsx — three cards with 3D mouse tilt
- components/LiveTerminal.tsx  — typewriter memory.recall demo
- components/Compare.tsx   — vs Mem0/Letta/Cognee table
- components/Agents.tsx    — supported-agents grid
- components/Install.tsx   — click-to-copy npm + console boxes
- components/Footer.tsx    — source / changelog / license links

Interactive elements are "use client" islands; static sections render
on the server. prefers-reduced-motion gated throughout.

Upgraded Next from 15.1.3 to 16.2.4 to clear CVE-2025-66478 during
setup. next build completes clean, all 3 routes prerender static.

Deploy:
  1. Import repo on Vercel, set Root Directory = website/
  2. Or: cd website && npx vercel
2026-04-18 19:15:11 +01:00

45 lines
618 B
CSS

.canvas {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}
.pause {
position: absolute;
right: 40px;
bottom: 56px;
z-index: 3;
transition: transform 200ms ease;
}
.pause:hover {
transform: scale(1.08);
}
.rail {
position: absolute;
left: 40px;
right: 40px;
bottom: 24px;
height: 1px;
background: rgba(255, 255, 255, 0.2);
}
.rail span {
display: block;
height: 100%;
width: 0;
background: var(--white);
transition: width 60ms linear;
}
@media (max-width: 640px) {
.pause {
right: 20px;
bottom: 36px;
}
.rail {
left: 20px;
right: 20px;
}
}