diff --git a/docs/plans/2026-03-29-homepage-update-impl.md b/docs/plans/2026-03-29-homepage-update-impl.md new file mode 100644 index 0000000..2b26af7 --- /dev/null +++ b/docs/plans/2026-03-29-homepage-update-impl.md @@ -0,0 +1,138 @@ +# Homepage Feature Update Implementation Plan + +> **For Claude:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task. + +**Goal:** Update the Astro homepage to reflect features from v1.2.0–v2.0.0 releases. + +**Architecture:** Three file edits — expand Features.astro from 3→6 cards, update Install.astro platform note, update Footer.astro tagline. No new files or structural changes. + +**Tech Stack:** Astro 6, CSS grid + +--- + +### Task 1: Update Features.astro — Replace 3 Cards with 6 + +**Files:** +- Modify: `homepage/src/components/Features.astro` + +**Step 1: Replace the features array (lines 2–18)** + +Replace the entire frontmatter features array with: + +```astro +--- +const features = [ + { + icon: '◈', + title: 'Interactive Knowledge Graph', + description: 'Visualize files, functions, and dependencies as an explorable graph with hierarchical drill-down and smart layout.', + }, + { + icon: '⬡', + title: 'Beyond Code Analysis', + description: 'Analyze your entire project — Dockerfiles, Terraform, SQL, Markdown, and 26+ file types mapped into one unified graph.', + }, + { + icon: '⊘', + title: 'Smart Filtering & Search', + description: 'Filter by node type, complexity, layer, or edge category. Fuzzy and semantic search to find anything instantly.', + }, + { + icon: '⎙', + title: 'Export & Share', + description: 'Export your knowledge graph as high-quality PNG, SVG, or filtered JSON — ready for docs, presentations, or further analysis.', + }, + { + icon: '⟿', + title: 'Dependency Path Finder', + description: 'Find the shortest path between any two components. Understand how parts of your system connect at a glance.', + }, + { + icon: '⟐', + title: 'Guided Tours & Onboarding', + description: 'AI-generated walkthroughs that teach the codebase step by step, plus onboarding guides for new team members.', + }, +]; +--- +``` + +**Step 2: Update the reveal delay logic (line 24)** + +The current `reveal-delay-${i + 1}` only has CSS for delays 1–3. With 6 cards in 2 rows, use modulo so each row staggers 1/2/3: + +```astro +
Works with Claude Code — Anthropic's official CLI for Claude.
+``` + +To: +```html +Works with Claude Code, Codex, OpenCode, Gemini CLI, and more.
+``` + +**Step 2: Commit** + +```bash +git add homepage/src/components/Install.astro +git commit -m "feat(homepage): update install note for multi-platform support" +``` + +--- + +### Task 3: Update Footer.astro — Tagline + +**Files:** +- Modify: `homepage/src/components/Footer.astro` + +**Step 1: Replace the tagline (line 13)** + +Change: +```html + +``` + +To: +```html + +``` + +**Step 2: Verify full build** + +Run: `cd homepage && npx astro build` +Expected: Clean build, no errors. + +**Step 3: Commit** + +```bash +git add homepage/src/components/Footer.astro +git commit -m "feat(homepage): update footer tagline for multi-platform" +```