Skip to content

Comments

Redesign landing site with light/dark mode and interactive visualizations#2

Open
pranavp311 wants to merge 3 commits intojustrach:mainfrom
pranavp311:feat/landing-redesign
Open

Redesign landing site with light/dark mode and interactive visualizations#2
pranavp311 wants to merge 3 commits intojustrach:mainfrom
pranavp311:feat/landing-redesign

Conversation

@pranavp311
Copy link

Summary

  • Light/dark mode: Light mode as default with a toggle button in the navbar. Dark mode persists via localStorage. All pages, canvas components, and code blocks adapt to the active theme.
  • Interactive 3D VectorBadge: Physics-based rotating vector lines with depth sorting, smooth mouse tracking, and hover effects. Replaces the old architecture diagram.
  • TypewriterText: Headline cycles "Evolution is here." → "Evolution is emergent." with a blinking cursor that persists after completion.
  • PerformanceRace: Animated horizontal bar comparison (EmergentDB vs ChromaDB vs LanceDB) with scale selector (1K/10K/50K), speedup callouts, and recall stats.
  • CodeBlock: VS Code Dark+ syntax highlighting for Rust and shell code. Used on home page and all docs code blocks.
  • Page transitions: Smooth fade-in + slide-up animation on route changes via Framer Motion.
  • Smooth scrolling: CSS scroll-behavior: smooth on the html element.
  • Hero stats row: <1ms latency, 9.6/10 RAG quality, 12M/s inserts, 1M vectors tested.
  • Background particles: Theme-aware RetrievalViz with increased visibility and mouse-proximity connecting lines.
  • Removed: ArchitectureDiagram, BenchmarkBar, BenchmarkRunner, Vercel analytics packages.

Test plan

  • cd frontend && bun run build compiles all 5 routes with 0 errors
  • Light mode renders correctly on all pages
  • Dark mode toggle works and persists across page reloads
  • TypewriterText types "here.", deletes, types "emergent.", stops with blinking cursor
  • VectorBadge rotates, responds to mouse, adapts colors in dark mode
  • PerformanceRace bars animate on scroll, scale tabs re-trigger animation
  • Code blocks show syntax highlighting on home and docs pages
  • Page transitions animate smoothly between routes
  • Background particles visible and interactive in both themes

pranavp311 and others added 3 commits February 7, 2026 14:06
   Next.js 14 marketing site with:
   - Dark theme with neon lime accent (#CCFF00)
   - Interactive neural retrieval field hero visualization (Canvas 2D)
   - Enterprise carousel, feature cards, pricing tiers
   - BetterAuth (Postgres) email/password authentication
   - Stripe Checkout subscription flow for Pro tier
   - Pages: home, docs, pricing, contact, login, checkout success/cancel

   NOTE: Setup required before running — see landing/SETUP.md
   Requires: Postgres, BetterAuth secrets, Stripe keys in .env.local
Remove the standalone landing/ directory with auth and Stripe code.
Instead, build landing pages directly on the existing frontend/ using
Next.js 16.1, React 19, Tailwind v4, and App Router.

Changes:
- Add NavBar, Footer, and RetrievalViz (canvas hero) components
- Rewrite home page with real benchmark data and Rust API examples
- Add /docs page with real REST API + Rust library documentation
- Add /pricing page (UI only, no checkout integration)
- Add /contact page with working mailto: form
- Update existing components (StatCard, BenchmarkRunner, etc.) to
  use CSS custom property var(--accent) for lime (#CCFF00) theme
- Add framer-motion dependency
- Remove landing/ (auth, Stripe, Pages Router code) entirely

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…ighting

- Add light mode as default with dark mode toggle (persists to localStorage)
- Replace architecture diagram and benchmark runner with animated PerformanceRace component
- Add interactive 3D VectorBadge with physics-based rotation and hover effects
- Add TypewriterText component cycling "here." → "emergent." with blinking cursor
- Add CodeBlock component with VS Code-style syntax highlighting for Rust and shell
- Add smooth page transitions using Framer Motion
- Add smooth scrolling via CSS
- Update all pages to use CSS custom properties for theme-aware styling
- Make background particle viz (RetrievalViz) respond to dark/light mode
- Update hero section with stats row and revised copy
- Remove Vercel analytics dependencies
- Remove unused ArchitectureDiagram, BenchmarkBar, BenchmarkRunner components
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant