Redesign home page and add /build page - #479
Draft
sebbycorp wants to merge 6 commits into
Draft
Conversation
Rebuilds the marketing home page from the "kagent Home v4" artboard and adds a /build page from the "kagent Build" artboard, using Tailwind utilities on top of a small set of design tokens (kg-* colours, Figtree / DM Sans / DM Mono). - Home: centered hero, Agent Substrate section (resume, density, isolation panels), scroll-driven Build walkthrough with a manifest panel, pipeline cards, features grid, adopters, community CTA - /build: declarative-build hero with install terminal, the same walkthrough, "whole loop" terminal and numbered pipeline - Tokens in globals.css (:root light, .dark dark) exposed via tailwind.config.ts; legacy rd-* custom CSS removed - Compact footer per the design; navbar left unchanged to match kagent.dev - Default theme set to dark (design is dark-first) - Brand assets added under public/images/brand Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
In light mode the manifest editor and terminals stayed near-black while the YAML colours switched to their light-theme values, leaving the text almost invisible. The kg-term tokens now flip per theme (white pane, dark text in light mode) and the hard-coded white/black borders, status bar and green success colour use tokens instead. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
Borrow the dot-grid / corner-handle / dashed-chip language for the home page, as reusable Tailwind-only primitives in blueprint.tsx: - Hero: dot-grid ground fading down, and a wiring schematic above the headline (kubectl apply, skills, MCP servers, A2A feeding an "agents" frame). - Substrate: a "pod per agent vs agent substrate" panel showing the same agents with pod overhead paid once instead of per agent. - Pipeline and features: hairline grids with node dots at every intersection, one Lucide icon per feature. Dot colour is a theme token (--kg-dot) so the grid reads in both light and dark mode. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
The label used to mask the top border with a page-colour box, which showed as a lavender block over the hero gradient in light mode. Draw the top border as two runs either side of the label instead, so it needs no background, and use the primary text colour in light mode. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
Replace the three terminal-style substrate panels with diagrams in the same dot-grid / corner-handle language as the hero: - Suspend & resume: a worker pool of nine agents that suspend and resume live, each showing its resume time in ms, with a "last resume" readout. - Density: pod per agent against an Agent Substrate worker pool, with the pool deliberately oversubscribed and a 30x agents-per-pod readout. Heading is now "30x with Agent Substrate". - Isolation: the agent inside its sandbox, with egress decided per destination. Chip gains a muted state for idle units. The standalone architecture panel under the substrate intro is folded into the density panel. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Signed-off-by: Sebastian Maniak <sebastian@maniak.io>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Implements the kagent.dev redesign (Solo.io design system, "kagent Home v4" and "kagent Build" artboards) in the Next.js marketing site.
/buildpage: declarative-build hero with an install terminal, the same walkthrough, "whole loop" terminal and numbered pipeline cards.globals.cssas--kg-*variables (light on:root, dark on.dark) and are exposed askg-*colours, plus Figtree / DM Sans / DM Mono font families and a few keyframes intailwind.config.ts. The legacyrd-*custom CSS block from the previous redesign is removed.public/images/brand/.Notes for reviewers
/buildis not linked from the navbar yet; reachable by URL only.src/data/adopters.yamlas before (light variants on white tiles, per the design).Test plan
tsc --noEmitand ESLint clean/buildrendered in dark and light, desktop and mobile🤖 Generated with Claude Code