Changelog

Added

• •**SVG-Based Device Mockups** - Complete rewrite of iPhone mockup using pure SVG
• •**Device Mockup Guidelines** - Comprehensive documentation in CLAUDE.md

Changed

• •**DeviceShowcase Positioning** - Improved visual arrangement

Removed

• •**PNG-based iPhone Frame** - Replaced with SVG for accurate screen embedding

Changed

• •**Realistic Device Mockups** - Complete overhaul of hero device mockups

Added

• •**Stripe-Style Hero Layout** - Complete redesign with left-aligned text and device mockups
• •**Device Mockups Component** (`components/device-mockups.tsx`)

Changed

• •**Hero Section** - Now uses 2-column grid layout on desktop
• •**Hero Copy** - More descriptive content covering actual docs:

Changed

• •**Stripe-Style Hero Background Redesign** - Complete overhaul of the hero section

Fixed

• •**Hero Text Readability** - Headline "Claude Insider" now has proper contrast

Fixed

• •**Light/Dark Theme Consistency** - Fixed poor contrast on docs pages in light mode

Added

• •**Enhanced Code Block Language Colors** - 33 distinct colors organized by language family

Changed

• •**Code Block Color Guidelines** - Added mandatory guidelines section to CLAUDE.md

Added

• •**Voice Assistant Header Redesign** - Improved UX with collapsible settings panel

Changed

• •**Voice Assistant Title** - Renamed "Claude Insider Assistant" to "Claude AI Assistant"
• •**Voice Assistant Layout** - Header no longer spans 4-5 rows in narrow windows
• •**Settings Accessibility** - All voice settings accessible via single gear icon
• •**Footer Attribution** - "Powered by Claude AI" moved from header to footer

Fixed

• •**Infinite Loop Bug** (v0.24.1) - Fixed React useEffect infinite loop in navigation
• •**Voice Assistant Header** - Fixed cramped layout in narrow popup window

Added

• •**Stripe/Vercel/Linear-Inspired Visual Redesign** - Complete color scheme transformation
• •**New CSS Gradient Utilities** (150+ lines added to `globals.css`)
• •**Design System Token Updates** (`lib/design-system.ts`)

Changed

• •**Homepage** - Complete redesign with lens flare hero and gradient accents
• •**Header** - Gradient logo (`from-violet-600 via-blue-600 to-cyan-600`)
• •**Voice Assistant** - FAB, header, user messages, buttons all use new gradients
• •**Voice Assistant Demo** - Complete visual refresh with new gradient theme
• •**Search Modal** - Updated highlights and focus rings to blue/cyan
• •**Docs Layout** - Sidebar active state uses cyan, prose uses `prose-cyan`
• •**Docs Page** - Category cards use cyan hover states
• •**Footer** - Version updated to 0.24.0

Removed

• •All orange accent colors (`orange-400/500/600`, `amber-500/600`)
• •Static gradient orb background (replaced with animated lens flares)

Added

• •**Accessibility Refinements** - Seventh UX System pillar for comprehensive accessibility
• •**Focus Management Hooks**
• •**ARIA Live Region Hooks**
• •**Keyboard Shortcuts System**
• •**Accessible Modal Components**
• •**New Accessibility CSS Utilities**

Changed

• •Updated Search component with focus trap and focus return
• •Updated Voice Assistant with focus trap and ARIA announcements
• •UX System now has Seven Pillars (added Accessibility)

Added

• •**Micro-interactions & Animations** - Sixth UX System pillar for delightful interactions
• •**Animation Hooks**
• •**Animated Button Components**
• •**Animated Input Components**
• •**Animated Card Components**
• •**Page Transition Components**
• •**New CSS Animations**

UX System (Six Pillars - MANDATORY)

Added

• •**Error Boundaries with Style** - Graceful error handling as the fifth UX System pillar
• •**Error Boundary Components**
• •**Route-Specific Error Pages**
• •**Error Recovery Hooks**
• •**Error Reporting Infrastructure**
• •**New CSS Animations**

UX System (Five Pillars - MANDATORY)

Added

• •**Smart Prefetching System** - Anticipate user intent, preload before click
• •**Prefetch Queue Manager**
• •**Prefetch Hooks**
• •**Smart Link Components**
• •**New CSS Animations**

Technical Details

• •Intersection Observer with 100px root margin for early prefetch
• •Route priority based on path patterns (getting-started = critical)
• •100ms hover delay to avoid unnecessary prefetches
• •Popular routes prefetched 2 seconds after page load
• •All prefetch states tracked in singleton queue

UX System (Four Pillars - MANDATORY)

Added

• •**Content-Aware Loading System** - Intelligent lazy loading with route-based skeletons
• •**Lazy Section Components** - Defer loading until visible
• •**Lazy Image System** - Image optimization with blur-up effect
• •**Lazy Code Block** - Deferred syntax highlighting
• •**Route-Based Content Loader**
• •**New CSS Animations**

Technical Details

• •Intersection Observer with 50-100px root margin for pre-loading
• •Dynamic imports for highlight.js language modules (smaller bundles)
• •Blur-up uses CSS `filter: blur()` with scale for edge coverage
• •All animations are GPU-optimized (transform, opacity, filter)
• •Route detection uses `usePathname` for client-side skeleton selection

Documentation

• •Updated CLAUDE.md with Content-Aware Loading section
• •Added lazy loading guidelines to REQUIREMENTS.md
• •All new async content MUST use lazy loading patterns

UX System (Three Pillars - MANDATORY)

Added

• •**Optimistic UI System** - Instant UI feedback with automatic rollback on errors
• •**Toast Notification System** - User feedback for actions
• •**Skeleton Loading Components** - Visual feedback during async operations
• •**Enhanced Search with Loading States**
• •**New CSS Animations**

Changed

• •Root layout now wrapped with `ToastProvider` for app-wide toast access
• •Search modal uses design system styling (`cn()` utility)
• •Improved search result hover states

Technical Details

• •All optimistic updates use React 19's `useTransition` for non-blocking updates
• •Toast notifications use React Portal for proper z-index layering
• •Skeletons use CSS custom properties for theme-aware colors
• •Shimmer animation uses GPU-accelerated `background-position`

Documentation

• •Updated CLAUDE.md with comprehensive Optimistic UI section (MANDATORY guidelines)
• •Updated REQUIREMENTS.md with Design System & UX Guidelines section
• •All future development MUST follow these patterns for consistency

Added

• •**Vercel-Inspired Design System** - Comprehensive design tokens and utility system
• •**Updated Global Styles** (`globals.css`)
• •**Homepage Redesign** (`app/page.tsx`)
• •**Header Glass Effect** (`components/header.tsx`)
• •**Footer Updates** (`components/footer.tsx`)

Design System Colors

• •**Dark Theme**: Uses Vercel-style blacks (#0a0a0a background, #111111 cards, #1a1a1a hover)
• •**Light Theme**: White backgrounds, gray-50 cards, gray-200 borders
• •**Accent**: Orange gradient (from-orange-500 to-amber-600)

Technical Details

• •All animations use GPU-optimized properties (transform, opacity)
• •Staggered animations use inline `animationDelay` styles
• •`cn()` utility replaces ad-hoc class concatenation
• •Design system documented in CLAUDE.md for future development consistency

Documentation

• •Updated CLAUDE.md with comprehensive Design System section (MANDATORY guidelines)
• •Updated REQUIREMENTS.md with Phase 24: Design System
• •Design system rules persist for all future code additions

Added

• •**Dynamic Project Knowledge Generation** - RAG system now generates project knowledge from source files

Changed

• •RAG index upgraded to v2.0 with dynamic project knowledge
• •Total RAG chunks increased to 435 (423 docs + 12 project knowledge)
• •Project knowledge now includes:

Technical Details

• •`apps/web/scripts/generate-project-knowledge.cjs` - New dynamic knowledge generator
• •`apps/web/scripts/generate-rag-index.cjs` - Updated to use dynamic generator
• •`apps/web/data/system-prompt.ts` - Comprehensive AI persona and project context
• •`apps/web/lib/claude.ts` - Uses new buildComprehensiveSystemPrompt function
• •`apps/web/lib/rag.ts` - Imports PROJECT_KNOWLEDGE_CHUNKS for runtime fallback

Fixed

• •**Getting Started Sidebar Navigation Fix** - Fixed duplicate navigation config causing inconsistent sidebar

Technical Details

• •`apps/web/app/docs/getting-started/page.tsx` - Updated navigationConfig from 5 to 7 categories
• •Issue manifested as: `/docs/tutorials` showed 7 categories, `/docs/getting-started` showed only 5
• •This was NOT a Vercel caching issue - it was a code-level duplicate config that fell out of sync

Fixed

• •**Navigation Bug Fix** - Added missing Tutorials and Examples categories to navigation

Changed

• •`apps/web/app/docs/page.tsx` - Added Tutorials and Examples to DOCS_SECTIONS array
• •`apps/web/app/page.tsx` - Added Tutorials and Examples to CATEGORIES array, updated stats

Added

• •**Tutorials Category** - New documentation category with 4 pages
• •**Examples Category** - New documentation category with 2 pages

Changed

• •Documentation pages increased from 28 to 34 (Phase D complete)
• •RAG index now contains 423 document chunks (up from 360)
• •Updated navigation sidebar with Tutorials and Examples categories
• •Updated search index with 6 new page entries
• •Updated category mappings in RAG system

Technical Details

• •`apps/web/content/tutorials/` - 4 new MDX files
• •`apps/web/content/examples/` - 2 new MDX files
• •`apps/web/app/docs/[...slug]/page.tsx` - Added tutorials and examples navigation
• •`apps/web/lib/search.ts` - Added 6 new search entries
• •`apps/web/lib/rag.ts` - Added tutorials and examples categories
• •`apps/web/scripts/generate-rag-index.cjs` - Added tutorials and examples categories
• •`apps/web/data/rag-index.json` - Regenerated with 423 chunks

Added

• •**Build-Time RAG Index Generation** - Pre-computed document index for faster AI assistant responses

Changed

• •`prebuild` script now runs both build info update and RAG index generation
• •RAG system (`lib/rag.ts`) updated to support pre-built index loading

Technical Details

• •`apps/web/scripts/generate-rag-index.cjs` - New prebuild script for RAG index generation
• •`apps/web/lib/rag.ts` - Added `loadPrebuiltIndex()`, `isIndexPrebuilt()`, `clearIndex()` functions
• •`apps/web/data/rag-index.json` - Pre-computed index with chunks, TF-IDF scores, and IDF values
• •`apps/web/package.json` - Updated prebuild to run RAG generation

Added

• •**21 Additional Syntax Highlighting Languages** - Expanded code block support from 12 to 33 languages

Technical Details

• •`apps/web/components/code-block.tsx` - Added 21 new highlight.js language imports and registrations
• •Added colored language tags: Java (red), C (dark blue), C++ (blue), C# (purple), PHP (indigo), Ruby (red), Swift (orange), Kotlin (violet), Scala (light red), Docker (sky blue), GraphQL (pink), R (light blue), Perl (slate), Lua (indigo), TOML (amber), Diff (emerald), Makefile (lime), Nginx (green), Apache (rose)

Fixed

• •**Demo Animation Timing** - Fixed animation showing for too short a time

Technical Details

• •`apps/web/components/voice-assistant-demo.tsx` - Refactored useEffect timing logic

Added

• •**Fullscreen Popup Mode** - Voice assistant now supports fullscreen overlay mode
• •**Expand/Minimize Toggle** - Button to toggle between chat window and fullscreen view
• •**External Open Function** - `openAssistant()` function to open popup from other components
• •**OpenAssistantButton Component** - Reusable button to trigger assistant popup
• •**Extended Demo Animation** - Demo now 46 seconds with longer reading pauses

Changed

• •**Homepage "Try the Assistant" Button** - Now opens popup instead of navigating to /assistant
• •**`/assistant` Page** - Now redirects to homepage (assistant is popup-only)
• •**Escape Key Behavior** - First minimizes fullscreen, then closes popup on second press
• •**Demo Timing** - Extended from 32s to 46s with 3-second pause before loop

Technical Details

• •`voice-assistant.tsx` - Added `isFullscreen` state, `openAssistant()` export, fullscreen backdrop
• •`open-assistant-button.tsx` - New client component for triggering assistant popup
• •`app/page.tsx` - Replaced Link to /assistant with OpenAssistantButton
• •`app/assistant/page.tsx` - Simplified to redirect to homepage

Fixed

• •**Voice Assistant Browser Error** - Fixed "dangerouslyAllowBrowser" error by separating Anthropic SDK from client code
• •Client components now import from `claude-utils.ts` instead of `claude.ts` to prevent SDK bundling

Added

• •**Client-Safe Utilities Module** - New `lib/claude-utils.ts` with types and markdown functions
• •**Server-Only Directive** - Added `import "server-only"` to `lib/claude.ts` to prevent accidental client imports
• •**Error Boundary Integration** - Added error boundary wrapper to `/assistant` page
• •**Debug Error Display** - Error boundary now shows actual error message for easier debugging

Technical Details

• •`apps/web/lib/claude-utils.ts` - New file with Message type, markdownToDisplayText, markdownToSpeakableText
• •`apps/web/lib/claude.ts` - Now server-only, re-exports from claude-utils for backwards compatibility
• •`apps/web/components/voice-assistant.tsx` - Updated imports to use claude-utils
• •`apps/web/components/voice-assistant-full.tsx` - Updated imports to use claude-utils
• •`apps/web/lib/assistant-context.ts` - Updated imports to use claude-utils

Added

• •**Dedicated `/assistant` Page** - Full-page voice assistant at `/assistant` route
• •**Enhanced Homepage Demo** - Longer 32-second animation with two Q&A exchanges
• •**Audio Waveform Animation** - Visual audio bars during TTS playback in demo
• •**Voice Assistant Demo Component** - Animated showcase on homepage

Changed

• •Homepage "Try the Assistant" now links to dedicated `/assistant` page
• •Demo animation extended from 8s to 32s for better readability
• •Chat area height increased from 300px to 380px in demo
• •Added "Speaking..." indicator with animated waveform bars

Technical Details

• •`apps/web/app/assistant/page.tsx` - New route handler for assistant page
• •`apps/web/components/voice-assistant-full.tsx` - Full-page voice assistant component
• •`apps/web/components/voice-assistant-demo.tsx` - Enhanced demo with audio visualization

Added

• •**Environment Variables Guide** - Complete reference for Claude Code environment configuration
• •**Permissions & Security Guide** - Understanding and configuring permissions for safe operation
• •**Debugging Guide** - Effective techniques for debugging code with Claude as AI pair programmer
• •**Streaming Responses Guide** - Implementing real-time streaming with the Claude API
• •**Error Handling Guide** - Comprehensive error handling patterns and best practices
• •**Rate Limits Guide** - Understanding and working within API rate limits
• •**Model Comparison Guide** - Comparing Claude models to choose the right one
• •**GitHub Actions Integration** - CI/CD automation with Claude Code
• •**Docker Integration** - Running Claude Code in containerized environments
• •**Database Integration** - Connecting to databases via MCP servers
• •**Markdown Display Cleanup** - Chat responses now display without markdown syntax (##, **, ```)
• •**TTS Markdown Handling** - ElevenLabs TTS now converts markdown to speakable text

Changed

• •Documentation pages increased from 19 to 28
• •Chat assistant system prompt updated to discourage markdown syntax for better readability
• •TTS now uses `markdownToSpeakableText()` for cleaner speech output
• •Voice assistant message display now uses `markdownToDisplayText()` for clean rendering
• •Updated navigation sidebar with all new documentation pages
• •Updated search index with all new pages

Technical Details

• •Added `markdownToDisplayText()` and `markdownToSpeakableText()` utility functions
• •System prompt instructs Claude to use plain text formatting
• •Both streaming and stored messages are now converted for display
• •CSS optimization enabled in Next.js (`experimental.optimizeCss: true`)
• •Production source maps disabled for smaller bundle size
• •Voice assistant voices array memoized with `useMemo`

Added

• •**Troubleshooting Guide** - New documentation page covering common issues and solutions
• •**Migration Guide** - Guide for transitioning from GitHub Copilot, Cursor, Codeium, ChatGPT
• •**Advanced Prompting Techniques** - Deep dive into CLAUDE.md patterns, meta-prompting, and more
• •**Voice Preference Persistence** - Selected voice saved to localStorage and restored on page load
• •**Voice Preview Button** - Preview voices before selecting them
• •**TTS Loading Indicator** - Visual feedback during audio generation
• •**Conversation Export** - Copy chat history to clipboard with formatting
• •**Error Boundary** - Graceful error handling for voice assistant component
• •**Analytics Tracking** - Track voice assistant interactions (voice changes, TTS plays, exports, etc.)

Changed

• •Documentation pages increased from 16 to 19
• •Voice assistant now shows loading spinner during TTS generation
• •Improved error resilience in voice assistant component

Technical Details

• •8 analytics events tracked for voice assistant interactions
• •localStorage used for voice preference persistence
• •Error boundary wraps voice assistant component

Added

• •**ElevenLabs TTS Integration** - Premium text-to-speech with 42 natural voices
• •**Streaming TTS** - Voice starts speaking after first sentence (faster perceived response)
• •**Scrollable Voice Selector** - Browse all 42 voices with descriptions

Changed

• •Replaced OpenAI TTS with ElevenLabs for much higher voice quality
• •Default voice changed to "Sarah" (soft, young female)
• •TTS now uses `eleven_turbo_v2_5` model for fast, high-quality audio
• •Voice selector now shows voice count and scrolls for easy browsing

Technical Details

• •Uses `@elevenlabs/elevenlabs-js` SDK
• •Sentence-by-sentence TTS queuing during streaming
• •MP3 output at 44.1kHz/128kbps quality

Environment Variables

• •Added `ELEVENLABS_API_KEY` (required for TTS)
• •`OPENAI_API_KEY` no longer required

Added

• •**AI Voice Assistant** - Interactive voice assistant with chat interface
• •**Speech-to-Text** - Voice input with real-time transcription feedback
• •**Streaming Chat** - Claude AI integration with Server-Sent Events (SSE)
• •**RAG System** - Retrieval-Augmented Generation with TF-IDF search for intelligent documentation retrieval
• •**Auto-speak Mode** - Automatically read responses aloud
• •**Voice Selector Dropdown** - Choose TTS voice with click-outside handling
• •`components/voice-assistant.tsx` - Main voice assistant React component
• •`app/api/assistant/chat/route.ts` - Streaming chat endpoint with Claude AI
• •`app/api/assistant/speak/route.ts` - TTS endpoint
• •`lib/claude.ts` - Anthropic Claude client and system prompts
• •`lib/rag.ts` - RAG system with TF-IDF search algorithm
• •`lib/speech-recognition.ts` - Speech recognition utilities
• •`lib/assistant-context.ts` - Assistant context management

Changed

• •Smart sentence splitting for technical content (avoids pausing on file extensions like .md, .ts)
• •Updated CSP headers to allow API connections
• •Updated permissions headers to enable microphone access

Technical Details

• •Uses `@anthropic-ai/sdk` for Claude AI streaming
• •Web Speech API for browser-native speech recognition
• •TF-IDF algorithm for document relevance scoring
• •SSE (Server-Sent Events) for real-time streaming responses
• •Browser TTS fallback when API is unavailable

Added

• •**RSS Feed** (`/feed.xml`) - Subscribe to documentation updates via RSS 2.0
• •**Changelog Page** (`/changelog`) - Public changelog page parsing CHANGELOG.md
• •**Edit on GitHub Links** - "Edit this page on GitHub" link on all doc pages
• •**Reading Time Estimates** - Estimated reading time displayed on all doc pages
• •**Search History** - Remember recent searches in localStorage (up to 5 items)
• •**Language Selector** - i18n preparation with language selector (English US only initially)
• •`lib/reading-time.ts` - Reading time calculation utility (200 WPM)
• •`lib/search-history.ts` - Search history localStorage utilities
• •`lib/i18n.ts` - i18n configuration for future multi-language support
• •`components/edit-on-github.tsx` - Edit link component with GitHub icon
• •`components/language-selector.tsx` - Language dropdown component

Changed

• •Updated `docs-layout.tsx` with reading time and edit link props
• •Updated `[...slug]/page.tsx` to calculate and pass reading time and edit path
• •Updated `search.tsx` with recent searches UI (shows when query is empty)
• •Updated `header.tsx` with language selector
• •Updated `footer.tsx` with changelog link
• •Updated `layout.tsx` with RSS autodiscovery link

Content Expansion Plan

• •Troubleshooting guide - Common issues and solutions
• •Migration guide - Migrating from other AI tools
• •Environment variables reference
• •Permissions and security settings
• •Advanced prompting techniques
• •Debugging with Claude Code
• •Streaming responses guide
• •Error handling patterns
• •Rate limits and quotas
• •Model comparison guide
• •GitHub Actions CI/CD integration
• •Docker and containerization
• •Database integrations
• •Tutorials category: Code review, documentation generation, test generation, refactoring
• •Examples category: Real-world projects, starter templates

Added

• •Vercel Analytics integration for privacy-focused usage tracking
• •Content Security Policy (CSP) headers for XSS protection
• •Permissions-Policy header (disables camera, microphone, geolocation, FLoC tracking)

Changed

• •Updated Privacy Policy with comprehensive Vercel Analytics disclosure
• •Updated Terms of Service with new Section 10: Privacy and Analytics

Security

• •CSP directives: default-src, script-src, style-src, font-src, img-src, connect-src, frame-ancestors
• •Permissions-Policy: camera=(), microphone=(), geolocation=(), interest-cohort=()
• •Upgrade-insecure-requests enabled

Added

• •ContentMeta component (`components/content-meta.tsx`) for source citations
• •AI generation metadata on all 16 MDX content pages
• •Links to official Anthropic documentation sources on every content page
• •Sources include: docs.anthropic.com, modelcontextprotocol.io, anthropic.com/engineering
• •Dynamic build ID from `NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA` environment variable

Content Attribution

• •Each content page now displays sources section with clickable links
• •"Generated with AI using Claude AI by Anthropic" notice on all content
• •Model information (Claude Opus 4.5), generation date, and build ID displayed
• •ContentMeta exported via mdx-components.tsx for MDX usage

Sources Added Per Category

• •Getting Started: Claude Code Docs, GitHub Repository, Best Practices
• •Configuration: Memory Docs, Settings Docs, Best Practices
• •Tips & Tricks: Prompt Engineering Guide, Best Practices
• •API Reference: API Reference, Messages API, Tool Use Docs
• •Integrations: MCP Protocol Docs, Hooks Docs, IDE Integration Docs

Added

• •Shared Footer component with copyright attribution and legal links
• •Privacy Policy page (`/privacy`) - GDPR, CCPA, Serbian law compliant
• •Terms of Service page (`/terms`) - international coverage with Serbian governing law
• •Disclaimer page (`/disclaimer`) - non-affiliation with Anthropic, accuracy warnings
• •Accessibility Statement page (`/accessibility`) - WCAG 2.1 AA conformance documentation
• •Auto-updating build info in footer (version, build date, commit SHA)
• •Prebuild script (`scripts/update-build-info.cjs`) for automatic version updates

Legal Compliance

• •Privacy Policy covers EU GDPR, US CCPA, and Serbian Data Protection Law
• •Terms of Service preserves EU/US consumer rights while using Serbian jurisdiction
• •Disclaimer prominently states non-affiliation with Anthropic
• •Accessibility Statement documents all implemented accessibility features

Changed

• •Footer now displays on all pages with consistent styling
• •Footer includes copyright with link to GitHub repository
• •Footer links: Privacy Policy, Terms, Disclaimer, Accessibility
• •Footer displays version, build date, and git commit SHA at bottom
• •Version sourced from package.json, updates automatically on each build

Added

• •Syntax highlighting for code blocks using highlight.js
• •Colored language tags above code blocks (e.g., blue for TypeScript, yellow for JavaScript)
• •Support for 15+ languages: JavaScript, TypeScript, Python, Bash, JSON, HTML, CSS, YAML, SQL, Go, Rust, etc.

Changed

• •Code blocks now display language name in a colored pill badge
• •Improved code block styling with better padding for language tag
• •Enhanced visual distinction between different programming languages

Added

• •PWA (Progressive Web App) support with service worker for offline access
• •Web app manifest with app icons
• •Skip to main content link for keyboard navigation
• •ARIA labels and roles throughout the application
• •Focus states with visible outlines on all interactive elements

Accessibility Improvements

• •Search modal: proper dialog role, aria-modal, aria-labelledby
• •Search results: listbox pattern with aria-selected, aria-activedescendant
• •All SVG icons marked with aria-hidden="true"
• •Skip link for keyboard users to bypass navigation
• •Focus rings on all buttons, links, and form elements
• •Live region for search "no results" message

Changed

• •Search button now theme-aware (light/dark mode)
• •Search modal styling improved for light theme
• •All interactive elements have visible focus indicators
• •Input type changed to "search" for better semantics

Added

• •JSON-LD structured data for all documentation pages (TechArticle schema)
• •Organization and WebSite schema in root layout
• •BreadcrumbList schema for navigation
• •SearchAction schema for site search
• •Font optimization with `display: swap` and preloading
• •DNS prefetch and preconnect for external resources
• •Security headers (X-Content-Type-Options, X-Frame-Options, X-XSS-Protection, Referrer-Policy)
• •Viewport meta configuration with theme colors

Changed

• •Updated Next.js config with performance optimizations
• •Enabled image optimization with AVIF/WebP formats
• •Removed X-Powered-By header for security
• •Updated OpenGraph URL to production domain (www.claudeinsider.com)
• •Added metadataBase for proper URL generation
• •Updated author metadata to Vladimir Dukelic

Performance

• •Font swap for faster initial render
• •DNS prefetching for Google Fonts
• •Compression enabled
• •Image size optimization configured

Added

• •Table of Contents component with scroll spy and smooth scrolling
• •Mobile navigation menu with hamburger toggle
• •Dynamic sitemap.xml generation for all documentation pages
• •robots.txt for search engine optimization

Changed

• •Header component now supports light/dark theme properly
• •Improved mobile responsiveness across all pages
• •DocsLayout now includes Table of Contents sidebar on XL screens

Infrastructure

• •Deployed to Vercel with Root Directory set to `apps/web`
• •Domain redirects verified working (claudeinsider.com → www.claudeinsider.com)
• •All 16 documentation pages tested and verified

Added

• •Shared Header component (`header.tsx`) for consistent navigation across all pages
• •React Portal rendering for search modal to fix z-index layering issues

Fixed

• •Search modal now displays correctly on all pages (fixed clipping on content pages)
• •Search and Theme Toggle now appear consistently on `/docs` and `/docs/getting-started` pages
• •Removed duplicate header implementations from individual page files

Changed

• •Refactored `apps/web/app/page.tsx` to use shared Header component
• •Refactored `apps/web/app/docs/page.tsx` to use shared Header component
• •Refactored `apps/web/app/docs/getting-started/page.tsx` to use shared Header component
• •Refactored `apps/web/components/docs-layout.tsx` to use shared Header component
• •Updated search component to use `createPortal` for rendering at document.body level

Added

• •MDX content support with dynamic routing (`[...slug]/page.tsx`)
• •16 documentation pages across 5 categories:
• •Fuzzy search with Fuse.js (Cmd/Ctrl+K keyboard shortcut)
• •Dark/Light/System theme toggle with localStorage persistence
• •Code copy-to-clipboard functionality for all code blocks
• •Custom MDX components (headings with anchors, code blocks, tables, links)
• •Light theme CSS with variable overrides
• •Search modal with keyboard navigation
• •Theme-aware styling throughout

Changed

• •Updated homepage to include Search and Theme Toggle in header
• •Updated docs layout to include Search and Theme Toggle
• •Expanded globals.css with light theme support
• •Added Fuse.js dependency for search

Fixed

• •GitHub repository structure - moved all files from nested `claude-insider/` subfolder to root
• •Reset git history with clean initial commit
• •All project files now correctly at repository root

Notes

• •Repository ready for Vercel deployment (set Root Directory to `apps/web`)

Added

• •Vercel deployment configuration (`vercel.json`)
• •Added `next` to root devDependencies for Vercel detection

Fixed

• •Vercel build configuration for Turborepo monorepo
• •Documentation updated with Vercel Root Directory instructions

Notes

• •Vercel deployment requires setting Root Directory to `apps/web` in project settings

Added

• •Homepage with hero section, category cards, and features
• •Documentation index page with all section links
• •Getting Started introduction page with Claude overview
• •Dark theme with orange/amber accent colors
• •Custom scrollbar and code block styling
• •SEO metadata and Open Graph tags
• •Responsive navigation header and footer
• •Sidebar navigation for documentation pages
• •Breadcrumb navigation
• •Documentation directory structure:

Changed

• •Updated root package.json name to "claude-insider"
• •Added `format` and `clean` scripts to root package.json
• •Updated turbo.json with format and clean tasks
• •Customized globals.css with dark theme variables

Added

• •Initial Turborepo monorepo setup with pnpm
• •Next.js 16.0.7 with App Router in `apps/web`
• •Secondary docs app in `apps/docs`
• •Shared packages:
• •Project documentation:

Technical Details

• •TypeScript 5.9.2 with strict mode
• •Tailwind CSS 4.1.5
• •ESLint 9.x with flat config
• •Prettier 3.6.0 with Tailwind plugin
• •pnpm 10.19.0 workspaces

Content Expansion (Planned)

• •[x] Troubleshooting guide - Common issues and solutions (v0.12.1)
• •[x] Migration guide - Migrating from other AI tools (v0.12.1)
• •[x] Environment variables reference (v0.13.0)
• •[x] Permissions and security settings (v0.13.0)
• •[x] Advanced prompting techniques (v0.12.1)
• •[x] Debugging with Claude Code (v0.13.0)
• •[x] Streaming responses guide (v0.13.0)
• •[x] Error handling patterns (v0.13.0)
• •[x] Rate limits and quotas (v0.13.0)
• •[x] Model comparison guide (v0.13.0)
• •[x] GitHub Actions CI/CD integration (v0.13.0)
• •[x] Docker and containerization (v0.13.0)
• •[x] Database integrations (v0.13.0)
• •[x] Tutorials category: Code review, documentation generation, test generation (v0.16.0)
• •[x] Examples category: Real-world projects (v0.16.0)

Technical Enhancements (Optional)

• •[ ] GitHub Actions CI/CD pipeline (Vercel handles deployment)
• •[ ] Additional syntax highlighting languages
• •[ ] Multi-language support (i18n) - infrastructure ready

Completed Features

• •[x] Voice preference persistence and preview (v0.12.1)
• •[x] Troubleshooting, Migration, Advanced Prompting docs (v0.12.1)
• •[x] Voice assistant analytics and error boundary (v0.12.1)
• •[x] ElevenLabs TTS with 42 voices (v0.12.0)
• •[x] AI Voice Assistant with wake word detection (v0.11.0)
• •[x] RAG search for documentation retrieval (v0.11.0)
• •[x] Streaming chat with Claude AI (v0.11.0)
• •[x] RSS feed for documentation updates (v0.10.0)
• •[x] Public changelog page (v0.10.0)
• •[x] Edit on GitHub links (v0.10.0)
• •[x] Reading time estimates (v0.10.0)
• •[x] Search history persistence (v0.10.0)
• •[x] Language selector / i18n preparation (v0.10.0)
• •[x] Vercel Analytics (v0.9.1)
• •[x] Source citations and AI generation metadata (v0.9.0)
• •[x] Legal pages - Privacy, Terms, Disclaimer, Accessibility (v0.8.0)
• •[x] Syntax highlighting for code blocks (v0.7.0)
• •[x] PWA offline support (v0.6.0)
• •[x] Accessibility audit (v0.6.0)