Implements a static documentation site for RazorConsole to provide structured component reference and onboarding materials.

Structure

• Home (/) - Feature overview, inline quick start, links to examples
• Quick Start (/quick-start) - Installation, project setup, first component
• Components (/components) - Interactive reference for all 17 built-in components with category filtering (Layout, Input, Display, Utilities), code examples, and parameter tables
• Advanced (/advanced) - Hot Reload, Custom Translators, Keyboard Events, Focus Management

Stack

• Vite + React + TypeScript
• TailwindCSS with dark mode
• shadcn/ui (Button, Card, Tabs)
• React Router for client-side routing

Component Documentation Format

Each component includes:

• Description and category badge
• Tabbed interface: Examples | Parameters
• Syntax-highlighted code snippets
• Parameter reference table (type, default, description)

Example for TextButton:

<TextButton 
  Content="Click me"
  OnClick="HandleClick"
  BackgroundColor="Color.Grey"
  FocusedColor="Color.Blue" 
/>

Structure

website/
├── src/
│   ├── components/
│   │   ├── ui/          # shadcn components
│   │   └── Layout.tsx   # Header, nav, footer
│   ├── pages/           # Route pages
│   ├── data/
│   │   └── components.ts  # Component metadata
│   └── lib/utils.ts
├── vite.config.ts       # Path aliases (@/*)
└── tailwind.config.js

Screenshots

Home Page

Components Page

Usage

cd website
npm install
npm run dev     # http://localhost:5173
npm run build   # → dist/

• Fixes website #62

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.