feat: redesign archgw -> plano + website in Next.js (#613)

* feat: redesign archgw -> plano + website * feat(www): refactor landing page sections, add new diagrams and UI improvements * feat(www): sections enhanced for clarify & diagrams added * feat(www): improvements to mobile design, layout of diagrams * feat(www): clean + typecheck * feat(www): feedback loop changes * feat(www): fix type error * fix lib/utils error * feat(www): ran biome formatting * feat(www): graphic changes * feat(www): web analytics * fea(www): changes * feat(www): introduce monorepo This change brings Turborepo monorepo to independently handle the marketing website, the docs website and any other future use cases for mutli-platform support. They are using internal @katanemo package handlers for the design system and logic. * fix(www): transpiler failure * fix(www): tsconfig issue * fix(www): next.config issue * feat(docs): hold off on docs * Delete next.config.ts * feat(www): content fix * feat(www): introduce blog * feat(www): content changes * Update package-lock.json * feat: update text * Update IntroSection.tsx * feat: Turbopack issue * fix * Update IntroSection.tsx * feat: updated Research page * refactor(www): text clarity, padding adj. * format(www) * fix: add missing lib/ files to git - fixes Vercel GitHub deployment - Updated .gitignore to properly exclude Python lib/ but include Next.js lib/ directories - Added packages/ui/src/lib/utils.ts (cn utility function) - Added apps/www/src/lib/sanity.ts (Sanity client configuration) - Fixes module resolution errors in Vercel GitHub deployments (case-sensitive filesystem) * Update .gitignore * style(www): favicon + metadata * fix(www): links * fix(www): add analytics * fix(www): add * fix(www): fix links + image * fix(www): fix links + image * fix(www): fix links * fix(www): remove from tools testing.md
2026-04-25 08:46:24 +02:00 · 2025-12-18 15:55:15 -08:00 · 2025-12-18 15:55:15 -08:00 · 0c3efdbef2
commit 0c3efdbef2
parent 48bbc7cce7
119 changed files with 27142 additions and 266 deletions
--- a/apps/www/src/components/Hero.tsx
+++ b/apps/www/src/components/Hero.tsx
@ -0,0 +1,68 @@
+import React from "react";
+import { Button } from "@katanemo/ui";
+import Link from "next/link";
+import { NetworkAnimation } from "./NetworkAnimation";
+
+export function Hero() {
+  return (
+    <section className="relative pt-8 sm:pt-12 lg:pt-1 pb-6 px-4 sm:px-6 lg:px-8 overflow-hidden">
+      <div className="max-w-[81rem] mx-auto relative">
+        <div className="hidden lg:block absolute inset-0 pointer-events-none ">
+          <NetworkAnimation />
+        </div>
+        <div className="lg:hidden absolute inset-0 pointer-events-none">
+          <NetworkAnimation className="!w-[300px] !h-[300px] left-82! top-1! opacity-90! " />
+        </div>
+        <div className="max-w-3xl mb-3 sm:mb-4 relative z-10">
+          {/* Version Badge */}
+          <div className="mb-4 sm:mb-6">
+            <div className="inline-flex flex-wrap items-center gap-1.5 sm:gap-2 px-3 sm:px-4 py-1 rounded-full bg-[rgba(185,191,255,0.4)] border border-[var(--secondary)] shadow backdrop-blur">
+              <span className="text-xs sm:text-sm font-medium text-black/65">
+                v0.4
+              </span>
+              <span className="text-xs sm:text-sm font-medium text-black ">
+                —
+              </span>
+              <span className="text-xs sm:text-sm font-[600] tracking-[-0.6px]! text-black leading-tight">
+                <span className="hidden sm:inline">
+                  Unified /v1/responses API with state management
+                </span>
+                <span className="sm:hidden">Unified /v1/responses API</span>
+              </span>
+            </div>
+          </div>
+
+          {/* Main Heading */}
+          <h1 className="text-4xl sm:text-4xl md:text-5xl lg:text-7xl font-normal leading-tight tracking-tighter text-black flex flex-col gap-0 sm:-space-y-2 lg:-space-y-3">
+            <span className="font-sans">Delivery Infrastructure </span>
+            <span className="font-sans font-medium text-[var(--secondary)]">
+              for Agentic Apps
+            </span>
+          </h1>
+        </div>
+
+        {/* Subheading with CTA Buttons */}
+        <div className="max-w-7xl relative z-10">
+          <p className="text-base sm:text-lg md:text-xl lg:text-[22px] font-sans font-[400] tracking-[-1.0px] sm:tracking-[-1.22px]! text-black max-w-76 sm:max-w-2xl mb-6">
+            Build agents faster, and deliver them reliably to production - by
+            offloading the critical plumbing work to Plano.
+          </p>
+
+          {/* CTA Buttons */}
+          <div className="flex flex-col sm:flex-row items-stretch sm:items-start gap-3 sm:gap-4">
+            <Button asChild className="w-full sm:w-auto">
+              <Link href="https://docs.planoai.dev/get_started/quickstart" target="_blank" rel="noopener noreferrer">
+                Get started
+              </Link>
+            </Button>
+            <Button variant="secondary" asChild className="w-full sm:w-auto">
+              <Link href="https://docs.planoai.dev" target="_blank" rel="noopener noreferrer">
+                Documentation
+              </Link>
+            </Button>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}