@programinglive/dev-workflow-mcp-server 1.5.7 → 1.6.0

package/.husky/pre-commit

@@ -1 +1,2 @@
-npm test
+#!/usr/bin/env sh
+# Pre-commit hook - tests are run only during release

package/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [1.6.0](https://github.com/programinglive/dev-workflow-mcp-server/compare/v1.5.11...v1.6.0) (2025-12-06)
+
+
+### ✨ Features
+
+* add responsive vertical monitor support and dark/light mode toggle ([5565765](https://github.com/programinglive/dev-workflow-mcp-server/commit/5565765f5e5db63d5239c9b82371ae1853a72085))
+
+### [1.5.11](https://github.com/programinglive/dev-workflow-mcp-server/compare/v1.5.10...v1.5.11) (2025-12-05)
+
+### [1.5.10](https://github.com/programinglive/dev-workflow-mcp-server/compare/v1.5.9...v1.5.10) (2025-12-05)
+
+### [1.5.9](https://github.com/programinglive/dev-workflow-mcp-server/compare/v1.5.8...v1.5.9) (2025-12-05)
+
+### [1.5.8](https://github.com/programinglive/dev-workflow-mcp-server/compare/v1.5.7...v1.5.8) (2025-12-05)
+
+
+### 🐛 Bug Fixes
+
+* **release:** amend tag to include release notes, remove build-docs.js and dist/docs ([a3cea9b](https://github.com/programinglive/dev-workflow-mcp-server/commit/a3cea9b612ee2d8f970bf7dd93bcbeef98ba0924))
+
 ### [1.5.7](https://github.com/programinglive/dev-workflow-mcp-server/compare/v1.5.6...v1.5.7) (2025-12-05)
 
 

package/docs/release-notes/RELEASE_NOTES.md

@@ -4,6 +4,21 @@ Authoritative history of user-visible changes for the Development Workflow MCP S
 
 ## Unreleased
 
+## 1.5.11 — 2025-12-05
+- See CHANGELOG for details.
+
+## 1.5.10 — 2025-12-05
+- See CHANGELOG for details.
+
+## 1.5.9 — 2025-12-05
+- See CHANGELOG for details.
+
+## 1.5.8 — 2025-12-05 — 🐛 Bug Fixes
+- **release:** amend tag to include release notes, remove build-docs.js and dist/docs (a3cea9b)
+
+## 1.5.7 — 2025-12-05 — 🐛 Bug Fixes
+- **ci:** checkout main branch for release notes and remove RELEASE_NOTES.html generation (5d50dc0)
+
 ## 1.5.6 — 2025-12-05 — 🐛 Bug Fixes
 - **ci:** update github release workflow to use github-script (0990808)
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@programinglive/dev-workflow-mcp-server",
-  "version": "1.5.7",
+  "version": "1.6.0",
   "description": "MCP server to enforce development workflow discipline",
   "homepage": "https://devworkflow.programinglive.com/",
   "mcpName": "io.github.programinglive/dev-workflow-mcp-server",
@@ -14,7 +14,6 @@
     "build:server": "vite build",
     "build:web": "npm run build --prefix web",
     "watch:web": "npm run dev --prefix web",
-    "postbuild": "node scripts/build-docs.js",
     "dev": "node --watch index.js",
     "start": "node index.js",
     "local": "node index.js",
@@ -54,7 +53,7 @@
   "devDependencies": {
     "@commitlint/cli": "^20.2.0",
     "@commitlint/config-conventional": "^20.2.0",
-    "@programinglive/commiter": "^1.1.8",
+    "@programinglive/commiter": "^1.2.8",
     "autoprefixer": "^10.4.22",
     "husky": "^9.1.7",
     "postcss": "^8.5.6",

package/scripts/release.cjs

@@ -190,7 +190,6 @@ function runRelease({
 
   return releaseResult;
 }
-
 if (require.main === module) {
   try {
     const result = runRelease();

package/scripts/update-release-notes.cjs

@@ -67,29 +67,33 @@ function updateReleaseNotes({
 
 function insertReleaseNotesEntry({ content, version, releaseDate, highlight, sectionHeading, detailBullets }) {
   const lines = content.split('\n');
-
-  // Find the "## Unreleased" section
-  const unreleasedIndex = lines.findIndex((line) => line.trim().startsWith('## Unreleased'));
-  if (unreleasedIndex === -1) {
-    throw new Error('Unable to locate "## Unreleased" section in release notes.');
+  const headerSeparatorIndex = lines.findIndex((line) => line.trim().startsWith('|---------'));
+  if (headerSeparatorIndex === -1) {
+    throw new Error('Unable to locate release notes table header.');
   }
 
+  const newRow = `| ${version} | ${releaseDate} | ${escapePipes(highlight)} |`;
+  lines.splice(headerSeparatorIndex + 1, 0, newRow);
+
   const sectionLines = [];
   sectionLines.push('');
   const trimmedHeading = typeof sectionHeading === 'string' ? sectionHeading.trim() : '';
-  const headingSuffix = trimmedHeading ? ` — ${trimmedHeading}` : '';
-
-  // Format: ## [Version] — [Date]
-  sectionLines.push(`## ${version} — ${releaseDate}${headingSuffix}`);
-
+  const headingSuffix = trimmedHeading ? ` – ${trimmedHeading}` : '';
+  sectionLines.push(`## ${version}${headingSuffix}`);
+  sectionLines.push('');
+  sectionLines.push(`Released on **${releaseDate}**.`);
+  sectionLines.push('');
   for (const bullet of detailBullets) {
     sectionLines.push(`- ${bullet}`);
   }
+  sectionLines.push('');
 
-  // Insert after the Unreleased header (and potentially some blank lines)
-  // We want to keep "## Unreleased" empty and add the new version below it.
-  // So we insert after the Unreleased line.
-  lines.splice(unreleasedIndex + 1, 0, ...sectionLines);
+  const firstSectionIndex = lines.findIndex((line, idx) => idx > headerSeparatorIndex && line.startsWith('## '));
+  if (firstSectionIndex === -1) {
+    lines.push(...sectionLines);
+  } else {
+    lines.splice(firstSectionIndex, 0, ...sectionLines);
+  }
 
   return lines.join('\n');
 }

package/tests/build.test.js

@@ -8,7 +8,7 @@ import path from 'path';
 const exec = promisify(execCallback);
 
 test('build generates dist/index.mjs file', async () => {
-  const { stderr } = await exec('npm run build:server && npm run postbuild');
+  const { stderr } = await exec('npm run build:server');
   // Allow the known vite warning about node:process
   const knownWarning = '[plugin vite:resolve] Module "node:process" has been externalized for browser compatibility';
   const tailwindOutput = '≈ tailwindcss';
@@ -27,15 +27,6 @@ test('build generates dist/index.mjs file', async () => {
   const content = await readFile(distPath, 'utf-8');
   assert(content.includes('main'), 'Bundle should contain main function');
   assert(content.length > 1000, 'Bundle should be substantial');
-
-  const docDir = path.join(process.cwd(), 'dist', 'docs');
-  const docFiles = ['README.html', 'web-dashboard.html'];
-  for (const file of docFiles) {
-    const fullPath = path.join(docDir, file);
-    await access(fullPath);
-    const docContent = await readFile(fullPath, 'utf-8');
-    assert(docContent.includes('<h1'), `${file} should contain HTML output`);
-  }
 });
 
 test('build script exists in package.json', async () => {

package/verify-build.js

@@ -0,0 +1,176 @@
+#!/usr/bin/env node
+
+/**
+ * Build Verification Script
+ * Verifies that the website builds successfully and key features are present
+ */
+
+import { execSync } from 'child_process';
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const webDir = path.join(__dirname, 'web');
+const outDir = path.join(webDir, 'out');
+
+let passedTests = 0;
+let failedTests = 0;
+
+function test(name, fn) {
+  try {
+    fn();
+    console.log(`✓ ${name}`);
+    passedTests++;
+  } catch (error) {
+    console.error(`✗ ${name}`);
+    console.error(`  Error: ${error.message}`);
+    failedTests++;
+  }
+}
+
+console.log('\n🧪 Running Build Verification Tests...\n');
+
+// Test 1: Build succeeds
+test('Build completes successfully', () => {
+  try {
+    execSync('npm run build', { cwd: webDir, stdio: 'pipe' });
+  } catch (error) {
+    throw new Error('Build failed');
+  }
+});
+
+// Test 2: Output directory exists
+test('Output directory exists', () => {
+  if (!fs.existsSync(outDir)) {
+    throw new Error('Output directory not found');
+  }
+});
+
+// Test 3: Index HTML exists
+test('Homepage HTML generated', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  if (!fs.existsSync(indexPath)) {
+    throw new Error('index.html not found');
+  }
+});
+
+// Test 4: Check for key page content
+test('Homepage contains "Dev Workflow"', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('Dev Workflow')) {
+    throw new Error('Dev Workflow text not found');
+  }
+});
+
+// Test 5: Check for hero section
+test('Homepage contains hero section', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('Master Your') || !content.includes('Workflow')) {
+    throw new Error('Hero section not found');
+  }
+});
+
+// Test 6: Check for dark mode support
+test('Dark mode classes included', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('dark:')) {
+    throw new Error('Dark mode classes not found');
+  }
+});
+
+// Test 7: Check for responsive design
+test('Responsive design classes included', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('sm:') || !content.includes('md:') || !content.includes('lg:')) {
+    throw new Error('Responsive classes not found');
+  }
+});
+
+// Test 8: Check for features section
+test('Features section present', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('Your Coding Conscience')) {
+    throw new Error('Features section not found');
+  }
+});
+
+// Test 9: Check for history section
+test('History section present', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('Workflow History')) {
+    throw new Error('History section not found');
+  }
+});
+
+// Test 10: Check for theme toggle
+test('Theme toggle button present', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  // Check for theme toggle in minified form or readable form
+  if (!content.includes('toggleTheme') && !content.includes('theme') && !content.includes('Moon') && !content.includes('Sun')) {
+    throw new Error('Theme toggle not found');
+  }
+});
+
+// Test 11: Check for viewport meta tag
+test('Viewport meta tag for mobile', () => {
+  const indexPath = path.join(outDir, 'index.html');
+  const content = fs.readFileSync(indexPath, 'utf-8');
+  if (!content.includes('viewport') || !content.includes('width=device-width')) {
+    throw new Error('Viewport meta tag not found');
+  }
+});
+
+// Test 12: Check for localStorage theme persistence
+test('Theme persistence in Navbar component', () => {
+  const navbarPath = path.join(webDir, 'components', 'Navbar.tsx');
+  const content = fs.readFileSync(navbarPath, 'utf-8');
+  if (!content.includes('localStorage')) {
+    throw new Error('localStorage not found in Navbar');
+  }
+});
+
+// Test 13: Check for system preference detection
+test('System color scheme preference detection', () => {
+  const navbarPath = path.join(webDir, 'components', 'Navbar.tsx');
+  const content = fs.readFileSync(navbarPath, 'utf-8');
+  if (!content.includes('prefers-color-scheme')) {
+    throw new Error('prefers-color-scheme not found');
+  }
+});
+
+// Test 14: Check for responsive Navbar
+test('Responsive Navbar implementation', () => {
+  const navbarPath = path.join(webDir, 'components', 'Navbar.tsx');
+  const content = fs.readFileSync(navbarPath, 'utf-8');
+  if (!content.includes('md:hidden') && !content.includes('hidden md:')) {
+    throw new Error('Responsive Navbar not found');
+  }
+});
+
+// Test 15: Check for vertical monitor optimization
+test('Vertical monitor responsive design', () => {
+  const heroPath = path.join(webDir, 'components', 'Hero.tsx');
+  const content = fs.readFileSync(heroPath, 'utf-8');
+  if (!content.includes('xl:grid-cols-2')) {
+    throw new Error('Vertical monitor optimization not found');
+  }
+});
+
+console.log(`\n📊 Test Results: ${passedTests} passed, ${failedTests} failed\n`);
+
+if (failedTests > 0) {
+  process.exit(1);
+} else {
+  console.log('✅ All tests passed!\n');
+  process.exit(0);
+}

package/web/README.md

@@ -1,36 +1,133 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+# Dev Workflow Website
+
+A modern, responsive website for the Dev Workflow MCP Server built with Next.js, React, and Tailwind CSS.
+
+## Features
+
+- ✅ **Responsive Design** - Optimized for all screen sizes including vertical/portrait monitors
+- 🌓 **Dark/Light Mode Toggle** - User preference persisted to localStorage with system preference detection
+- 📱 **Mobile First** - Fully responsive with adaptive layouts for sm, md, lg, and xl breakpoints
+- ⚡ **Static Export** - Pre-rendered static HTML for fast Netlify deployment
+- 🎨 **Modern UI** - Built with Tailwind CSS and Lucide React icons
+- ♿ **Accessible** - Semantic HTML and proper ARIA labels
 
 ## Getting Started
 
-First, run the development server:
+### Development
 
 ```bash
 npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
 ```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+Open [http://localhost:3000](http://localhost:3000) to see the site.
+
+### Build
+
+```bash
+npm run build
+```
+
+Generates static HTML in the `out/` directory.
+
+## Features Overview
+
+### Responsive Vertical Monitor Support
+- Grid layout switches from 2-column to single-column on smaller screens
+- Terminal visualization hidden on screens smaller than xl breakpoint
+- Responsive padding and text sizes scale appropriately
+
+### Dark/Light Mode
+- Toggle button in navbar (Sun/Moon icons)
+- Theme preference stored in localStorage
+- Respects system color scheme preference on first visit
+- Smooth transitions between modes
+
+## Deployment
+
+### Netlify
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+1. **Prerequisites**: Install Netlify CLI
+   ```bash
+   npm install -g netlify-cli
+   ```
 
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
+2. **Build the site**
+   ```bash
+   npm run build
+   ```
 
-## Learn More
+3. **Deploy**
+   ```bash
+   netlify deploy --prod --dir=out
+   ```
+
+4. **Or connect GitHub for automatic deployments**
+   - Push to GitHub
+   - Connect repo to Netlify
+   - Netlify automatically builds and deploys on push
+
+### Environment Setup
+
+Create a `.env.local` file if needed for environment variables (currently not required).
+
+## Testing
+
+Run the build verification tests:
+
+```bash
+node verify-build.js
+```
+
+Tests verify:
+- Build completes successfully
+- All pages generate correctly
+- Dark mode classes are included
+- Responsive design classes present
+- Theme toggle functionality
+- Viewport meta tags for mobile
+- Vertical monitor optimization
+
+## Project Structure
+
+```
+web/
+├── app/
+│   ├── layout.tsx          # Root layout with ThemeProvider
+│   ├── page.tsx            # Homepage
+│   ├── globals.css         # Global styles
+│   └── docs/               # Documentation pages
+├── components/
+│   ├── Navbar.tsx          # Navigation with theme toggle
+│   ├── Hero.tsx            # Hero section
+│   ├── Features.tsx        # Features grid
+│   ├── History.tsx         # Workflow history section
+│   ├── Terminal.tsx        # Animated terminal demo
+│   ├── Footer.tsx          # Footer
+│   └── ThemeProvider.tsx   # Theme context provider
+├── public/                 # Static assets
+├── tailwind.config.ts      # Tailwind configuration
+├── next.config.ts          # Next.js configuration
+└── package.json
+```
 
-To learn more about Next.js, take a look at the following resources:
+## Technologies
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+- **Framework**: Next.js 16 with Turbopack
+- **Styling**: Tailwind CSS 3
+- **Icons**: Lucide React
+- **Language**: TypeScript
+- **Deployment**: Netlify (static export)
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
+## Browser Support
 
-## Deploy on Vercel
+- Chrome/Edge (latest)
+- Firefox (latest)
+- Safari (latest)
+- Mobile browsers (iOS Safari, Chrome Mobile)
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+## Performance
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+- Static HTML export for instant page loads
+- Optimized images with Next.js Image component
+- Minimal JavaScript bundle
+- CSS-in-JS with Tailwind for efficient styling

package/web/app/layout.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import "./globals.css";
 import Navbar from "@/components/Navbar";
 import Footer from "@/components/Footer";
+import { ThemeProvider } from "@/components/ThemeProvider";
 
 export const metadata: Metadata = {
   title: "Dev Workflow Dashboard",
@@ -26,10 +27,12 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en" className="scroll-smooth">
-      <body className="antialiased bg-[#0a0a0f] text-white">
-        <Navbar />
-        {children}
-        <Footer />
+      <body className="antialiased bg-white dark:bg-[#0a0a0f] text-gray-900 dark:text-white transition-colors duration-300">
+        <ThemeProvider>
+          <Navbar />
+          {children}
+          <Footer />
+        </ThemeProvider>
       </body>
     </html>
   );

package/web/components/Features.tsx

@@ -2,10 +2,10 @@ import { ShieldCheck, TestTube, FileText, GitBranch, History, Zap } from "lucide
 
 export default function Features() {
     return (
-        <section id="features" className="py-20 px-4">
+        <section id="features" className="py-12 sm:py-16 lg:py-20 px-3 sm:px-4 bg-gray-50 dark:bg-transparent transition-colors duration-300">
             <div className="max-w-7xl mx-auto">
-                <h2 className="text-3xl md:text-4xl font-bold text-center mb-16">Your Coding Conscience</h2>
-                <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+                <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold text-center mb-8 sm:mb-12 lg:mb-16 text-gray-900 dark:text-white">Your Coding Conscience</h2>
+                <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6">
                     <FeatureCard
                         icon={<ShieldCheck className="w-6 h-6 text-indigo-400" />}
                         title="Enforced Discipline"
@@ -50,12 +50,12 @@ export default function Features() {
 
 function FeatureCard({ icon, title, description, bg }: { icon: React.ReactNode, title: string, description: string, bg: string }) {
     return (
-        <div className="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
+        <div className="p-6 rounded-xl bg-white dark:bg-white/5 border border-gray-200 dark:border-white/10 hover:bg-gray-100 dark:hover:bg-white/10 transition">
             <div className={`w-12 h-12 rounded-lg ${bg} flex items-center justify-center mb-4`}>
                 {icon}
             </div>
-            <h3 className="text-xl font-semibold mb-2">{title}</h3>
-            <p className="text-gray-400">{description}</p>
+            <h3 className="text-xl font-semibold mb-2 text-gray-900 dark:text-white">{title}</h3>
+            <p className="text-gray-600 dark:text-gray-400">{description}</p>
         </div>
     );
 }

package/web/components/Footer.tsx

@@ -1,7 +1,7 @@
 export default function Footer() {
     return (
-        <footer className="py-12 px-4 border-t border-white/10">
-            <div className="max-w-7xl mx-auto text-center text-gray-400">
+        <footer className="py-12 px-4 border-t border-gray-200 dark:border-white/10 bg-white dark:bg-transparent transition-colors duration-300">
+            <div className="max-w-7xl mx-auto text-center text-gray-600 dark:text-gray-400">
                 <p>Built with ❤️ for developers who care about quality</p>
             </div>
         </footer>

package/web/components/Hero.tsx

@@ -27,9 +27,9 @@ export default function Hero() {
     };
 
     return (
-        <section className="min-h-screen flex items-center justify-center px-4 pt-16 relative overflow-hidden">
-            <div className="absolute inset-0 bg-gradient-to-br from-indigo-500/10 via-purple-500/10 to-pink-500/10"></div>
-            <div className="max-w-7xl mx-auto grid lg:grid-cols-2 gap-12 items-center relative z-10">
+        <section className="min-h-screen flex items-center justify-center px-3 sm:px-4 pt-16 relative overflow-hidden bg-white dark:bg-transparent transition-colors duration-300">
+            <div className="absolute inset-0 bg-gradient-to-br from-indigo-500/5 dark:from-indigo-500/10 via-purple-500/5 dark:via-purple-500/10 to-pink-500/5 dark:to-pink-500/10"></div>
+            <div className="max-w-7xl mx-auto grid xl:grid-cols-2 gap-6 sm:gap-8 lg:gap-12 items-center relative z-10">
                 {/* Left Column - Content */}
                 <div>
                     <div className="animate-fade-in-up" style={{ animationDelay: "0.1s" }}>
@@ -39,47 +39,47 @@ export default function Hero() {
                         </div>
                     </div>
 
-                    <h1 className="text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-bold mb-6 leading-tight animate-fade-in-up" style={{ animationDelay: "0.2s" }}>
+                    <h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl xl:text-7xl font-bold mb-4 sm:mb-6 leading-tight animate-fade-in-up" style={{ animationDelay: "0.2s" }}>
                         Master Your<br />
                         <span className="bg-gradient-to-r from-indigo-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">Workflow</span>
                     </h1>
-                    <p className="text-lg md:text-xl text-gray-400 mb-8 max-w-xl animate-fade-in-up" style={{ animationDelay: "0.3s" }}>
+                    <p className="text-base sm:text-lg md:text-xl text-gray-600 dark:text-gray-400 mb-6 sm:mb-8 max-w-xl animate-fade-in-up" style={{ animationDelay: "0.3s" }}>
                         An MCP server that acts as your coding conscience. Enforce test-driven development, ensure documentation, and never skip a step in your release process.
                     </p>
                     <div className="flex flex-col sm:flex-row gap-4 mb-8 animate-fade-in-up" style={{ animationDelay: "0.4s" }}>
-                        <Link href="#history" className="px-6 py-3 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg font-semibold hover:shadow-lg hover:shadow-indigo-500/50 transition inline-flex items-center justify-center gap-2">
+                        <Link href="#history" className="px-6 py-3 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg font-semibold hover:shadow-lg hover:shadow-indigo-500/50 transition inline-flex items-center justify-center gap-2 text-white">
                             View History <ArrowRight className="w-4 h-4" />
                         </Link>
-                        <Link href="/docs" className="px-6 py-3 bg-white/5 border border-white/10 rounded-lg font-semibold hover:bg-white/10 transition text-center">
+                        <Link href="/docs" className="px-6 py-3 bg-gray-200 dark:bg-white/5 border border-gray-300 dark:border-white/10 rounded-lg font-semibold hover:bg-gray-300 dark:hover:bg-white/10 transition text-center text-gray-900 dark:text-white">
                             Documentation
                         </Link>
                     </div>
-                    <div className="flex flex-wrap gap-6 sm:gap-8 text-sm animate-fade-in-up" style={{ animationDelay: "0.5s" }}>
+                    <div className="flex flex-wrap gap-4 sm:gap-6 lg:gap-8 text-xs sm:text-sm animate-fade-in-up" style={{ animationDelay: "0.5s" }}>
                         <div>
-                            <div className="text-2xl font-bold">{version ?? "..."}</div>
-                            <div className="text-gray-500">Latest Version</div>
+                            <div className="text-xl sm:text-2xl font-bold text-gray-900 dark:text-white">{version ?? "..."}</div>
+                            <div className="text-gray-600 dark:text-gray-500">Latest Version</div>
                         </div>
                         <div>
-                            <div className="text-2xl font-bold">MIT</div>
-                            <div className="text-gray-500">License</div>
+                            <div className="text-xl sm:text-2xl font-bold text-gray-900 dark:text-white">MIT</div>
+                            <div className="text-gray-600 dark:text-gray-500">License</div>
                         </div>
                         <div>
-                            <div className="text-2xl font-bold">Node 18+</div>
-                            <div className="text-gray-500">Compatibility</div>
+                            <div className="text-xl sm:text-2xl font-bold text-gray-900 dark:text-white">Node 18+</div>
+                            <div className="text-gray-600 dark:text-gray-500">Compatibility</div>
                         </div>
                         {downloads !== null && (
                             <div>
-                                <div className="text-2xl font-bold">{formatDownloads(downloads)}</div>
-                                <div className="text-gray-500">Downloads/mo</div>
+                                <div className="text-xl sm:text-2xl font-bold text-gray-900 dark:text-white">{formatDownloads(downloads)}</div>
+                                <div className="text-gray-600 dark:text-gray-500">Downloads/mo</div>
                             </div>
                         )}
                     </div>
                 </div>
                 {/* Right Column - Terminal */}
-                <div className="hidden lg:block">
+                <div className="hidden xl:block">
                     <div className="relative">
                         <div className="absolute inset-0 bg-gradient-to-r from-indigo-500/20 to-purple-500/20 blur-3xl"></div>
-                        <div className="relative bg-[#1a1a24] rounded-xl border border-white/10 p-6 shadow-2xl">
+                        <div className="relative bg-[#1a1a24] rounded-xl border border-white/10 p-4 sm:p-6 shadow-2xl">
                             <div className="flex items-center gap-2 mb-4">
                                 <div className="w-3 h-3 rounded-full bg-red-500"></div>
                                 <div className="w-3 h-3 rounded-full bg-yellow-500"></div>

package/web/components/History.tsx

@@ -25,30 +25,15 @@ export default function History() {
     });
 
     const loadData = async () => {
-        const params = new URLSearchParams({
-            page: page.toString(),
-            pageSize: "20",
-            ...(filters.userId && { user: filters.userId }),
-            ...(filters.startDate && { startDate: filters.startDate }),
-            ...(filters.endDate && { endDate: filters.endDate }),
+        // Placeholder for future API integration
+        // For now, show empty state
+        setHistory([]);
+        setTotalPages(1);
+        setSummary({
+            summary: {
+                totalTasks: 0,
+            },
         });
-
-        try {
-            const res = await fetch(`/api/history?${params}`);
-            const data = await res.json();
-            setHistory(data.data || []);
-            setTotalPages(data.totalPages || 1);
-        } catch (err) {
-            console.error("Failed to load history", err);
-        }
-
-        try {
-            const res = await fetch(`/api/summary?${params}`);
-            const data = await res.json();
-            setSummary(data);
-        } catch (err) {
-            console.error("Failed to load summary", err);
-        }
     };
 
     useEffect(() => {
@@ -61,34 +46,34 @@ export default function History() {
     };
 
     return (
-        <section id="history" className="py-20 px-4 bg-white/5">
+        <section id="history" className="py-12 sm:py-16 lg:py-20 px-3 sm:px-4 bg-gray-50 dark:bg-white/5 transition-colors duration-300">
             <div className="max-w-7xl mx-auto">
-                <h2 className="text-3xl md:text-4xl font-bold mb-8">Workflow History</h2>
-                <p className="text-gray-400 mb-12">Track your development progress and analyze your workflow patterns.</p>
-                <div className="bg-[#0a0a0f] rounded-xl border border-white/10 p-6">
-                    <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6">
+                <h2 className="text-2xl sm:text-3xl md:text-4xl font-bold mb-4 sm:mb-8 text-gray-900 dark:text-white">Workflow History</h2>
+                <p className="text-sm sm:text-base text-gray-600 dark:text-gray-400 mb-8 sm:mb-12">Track your development progress and analyze your workflow patterns.</p>
+                <div className="bg-white dark:bg-[#0a0a0f] rounded-xl border border-gray-200 dark:border-white/10 p-4 sm:p-6 transition-colors duration-300">
+                    <div className="grid gap-3 sm:gap-4 grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 mb-6">
                         <input
                             type="text"
                             placeholder="User ID"
                             value={filters.userId}
                             onChange={(e) => setFilters({ ...filters, userId: e.target.value })}
-                            className="px-4 py-2 bg-white/5 border border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 text-white"
+                            className="px-4 py-2 bg-gray-100 dark:bg-white/5 border border-gray-300 dark:border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400"
                         />
                         <input
                             type="date"
                             value={filters.startDate}
                             onChange={(e) => setFilters({ ...filters, startDate: e.target.value })}
-                            className="px-4 py-2 bg-white/5 border border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 [color-scheme:dark]"
+                            className="px-4 py-2 bg-gray-100 dark:bg-white/5 border border-gray-300 dark:border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 text-gray-900 dark:text-white [color-scheme:light] dark:[color-scheme:dark]"
                         />
                         <input
                             type="date"
                             value={filters.endDate}
                             onChange={(e) => setFilters({ ...filters, endDate: e.target.value })}
-                            className="px-4 py-2 bg-white/5 border border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 [color-scheme:dark]"
+                            className="px-4 py-2 bg-gray-100 dark:bg-white/5 border border-gray-300 dark:border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 text-gray-900 dark:text-white [color-scheme:light] dark:[color-scheme:dark]"
                         />
                         <button
                             onClick={handleApplyFilters}
-                            className="px-4 py-2 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg font-semibold hover:shadow-lg hover:shadow-indigo-500/50 transition"
+                            className="px-4 py-2 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg font-semibold hover:shadow-lg hover:shadow-indigo-500/50 transition text-white"
                         >
                             Apply Filters
                         </button>
@@ -96,25 +81,25 @@ export default function History() {
 
                     {summary && (
                         <div className="mb-6">
-                            <h3 className="text-lg font-semibold mb-4">Project Summary</h3>
-                            <div className="text-gray-400">
+                            <h3 className="text-lg font-semibold mb-4 text-gray-900 dark:text-white">Project Summary</h3>
+                            <div className="text-gray-600 dark:text-gray-400">
                                 <p>Total tasks: {summary.summary?.totalTasks || 0}</p>
                             </div>
                         </div>
                     )}
 
                     <div>
-                        <h3 className="text-lg font-semibold mb-4">Recent History</h3>
+                        <h3 className="text-lg font-semibold mb-4 text-gray-900 dark:text-white">Recent History</h3>
                         <div className="space-y-3">
                             {history.length > 0 ? (
                                 history.map((row, i) => (
-                                    <div key={i} className="p-4 rounded-lg bg-white/5 border border-white/10">
-                                        <div className="font-semibold">{row.task_description}</div>
-                                        <div className="text-sm text-gray-400 mt-1">{new Date(row.created_at).toLocaleString()}</div>
+                                    <div key={i} className="p-4 rounded-lg bg-gray-100 dark:bg-white/5 border border-gray-200 dark:border-white/10">
+                                        <div className="font-semibold text-gray-900 dark:text-white">{row.task_description}</div>
+                                        <div className="text-sm text-gray-600 dark:text-gray-400 mt-1">{new Date(row.created_at).toLocaleString()}</div>
                                     </div>
                                 ))
                             ) : (
-                                <p className="text-gray-500">No history yet.</p>
+                                <p className="text-gray-500 dark:text-gray-400">No history yet.</p>
                             )}
                         </div>
 
@@ -122,15 +107,15 @@ export default function History() {
                             <button
                                 onClick={() => setPage(p => Math.max(1, p - 1))}
                                 disabled={page <= 1}
-                                className="px-4 py-2 bg-white/5 border border-white/10 rounded-lg hover:bg-white/10 disabled:opacity-50"
+                                className="px-4 py-2 bg-gray-100 dark:bg-white/5 border border-gray-300 dark:border-white/10 rounded-lg hover:bg-gray-200 dark:hover:bg-white/10 disabled:opacity-50 text-gray-900 dark:text-white transition"
                             >
                                 Previous
                             </button>
-                            <span className="text-sm text-gray-400">Page {page} of {totalPages}</span>
+                            <span className="text-sm text-gray-600 dark:text-gray-400">Page {page} of {totalPages}</span>
                             <button
                                 onClick={() => setPage(p => Math.min(totalPages, p + 1))}
                                 disabled={page >= totalPages}
-                                className="px-4 py-2 bg-white/5 border border-white/10 rounded-lg hover:bg-white/10 disabled:opacity-50"
+                                className="px-4 py-2 bg-gray-100 dark:bg-white/5 border border-gray-300 dark:border-white/10 rounded-lg hover:bg-gray-200 dark:hover:bg-white/10 disabled:opacity-50 text-gray-900 dark:text-white transition"
                             >
                                 Next
                             </button>

package/web/components/Navbar.tsx

@@ -1,57 +1,100 @@
 "use client";
 
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import Link from "next/link";
-import { Github, Menu, X } from "lucide-react";
+import { Github, Menu, X, Moon, Sun } from "lucide-react";
 import Image from "next/image";
 
 export default function Navbar() {
     const [isOpen, setIsOpen] = useState(false);
+    const [theme, setTheme] = useState<"light" | "dark">("dark");
+
+    useEffect(() => {
+        // Get theme from localStorage or system preference
+        const savedTheme = localStorage.getItem("theme") as "light" | "dark" | null;
+        if (savedTheme) {
+            setTheme(savedTheme);
+        } else {
+            const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+            setTheme(prefersDark ? "dark" : "light");
+        }
+    }, []);
+
+    const toggleTheme = () => {
+        const newTheme = theme === "dark" ? "light" : "dark";
+        setTheme(newTheme);
+        localStorage.setItem("theme", newTheme);
+        document.documentElement.classList.toggle("dark", newTheme === "dark");
+    };
 
     return (
-        <nav className="fixed top-0 left-0 right-0 z-50 bg-[#0a0a0f]/80 backdrop-blur-lg border-b border-white/10">
-            <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-                <div className="flex items-center justify-between h-16">
+        <nav className="fixed top-0 left-0 right-0 z-50 bg-white/80 dark:bg-[#0a0a0f]/80 backdrop-blur-lg border-b border-gray-200 dark:border-white/10 transition-colors duration-300">
+            <div className="max-w-7xl mx-auto px-3 sm:px-4 lg:px-8">
+                <div className="flex items-center justify-between h-14 sm:h-16">
                     <Link href="/" className="flex items-center gap-2">
-                        <Image src="/assets/logo.png" alt="Dev Workflow" width={32} height={32} className="rounded-lg" />
-                        <span className="text-lg font-bold">Dev Workflow</span>
+                        <Image src="/assets/logo.png" alt="Dev Workflow" width={28} height={28} className="rounded-lg w-7 h-7 sm:w-8 sm:h-8" />
+                        <span className="text-sm sm:text-lg font-bold text-gray-900 dark:text-white">Dev Workflow</span>
                     </Link>
-                    <div className="hidden md:flex items-center gap-6">
-                        <Link href="/#features" className="text-gray-300 hover:text-white transition">Features</Link>
-                        <Link href="/#history" className="text-gray-300 hover:text-white transition">History</Link>
-                        <Link href="/#api" className="text-gray-300 hover:text-white transition">API</Link>
-                        <Link href="/docs" className="text-gray-300 hover:text-white transition">Docs</Link>
+                    <div className="hidden md:flex items-center gap-3 lg:gap-6">
+                        <Link href="/#features" className="text-xs lg:text-sm text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition">Features</Link>
+                        <Link href="/#history" className="text-xs lg:text-sm text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition">History</Link>
+                        <Link href="/#api" className="text-xs lg:text-sm text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition">API</Link>
+                        <Link href="/docs" className="text-xs lg:text-sm text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition">Docs</Link>
+                        <button
+                            onClick={toggleTheme}
+                            className="flex items-center justify-center w-8 h-8 rounded-lg bg-gray-100 dark:bg-white/10 hover:bg-gray-200 dark:hover:bg-white/20 transition text-gray-900 dark:text-white"
+                            aria-label="Toggle theme"
+                        >
+                            {theme === "dark" ? (
+                                <Sun className="w-4 h-4" />
+                            ) : (
+                                <Moon className="w-4 h-4" />
+                            )}
+                        </button>
                         <a
                             href="https://github.com/programinglive/dev-workflow-mcp-server"
                             target="_blank"
                             rel="noopener noreferrer"
-                            className="flex items-center gap-2 px-4 py-2 bg-white/5 hover:bg-white/10 rounded-lg transition"
+                            className="flex items-center gap-1.5 px-3 py-1.5 lg:px-4 lg:py-2 bg-gray-100 dark:bg-white/5 hover:bg-gray-200 dark:hover:bg-white/10 rounded-lg transition text-xs lg:text-sm text-gray-900 dark:text-white"
                         >
-                            <Github className="w-4 h-4" />
+                            <Github className="w-3.5 h-3.5 lg:w-4 lg:h-4" />
                             GitHub
                         </a>
                     </div>
-                    <button
-                        className="md:hidden p-2 rounded-lg hover:bg-white/5"
-                        onClick={() => setIsOpen(!isOpen)}
-                    >
-                        {isOpen ? <X className="w-6 h-6" /> : <Menu className="w-6 h-6" />}
-                    </button>
+                    <div className="md:hidden flex items-center gap-2">
+                        <button
+                            onClick={toggleTheme}
+                            className="p-2 rounded-lg bg-gray-100 dark:bg-white/10 hover:bg-gray-200 dark:hover:bg-white/20 transition text-gray-900 dark:text-white"
+                            aria-label="Toggle theme"
+                        >
+                            {theme === "dark" ? (
+                                <Sun className="w-5 h-5" />
+                            ) : (
+                                <Moon className="w-5 h-5" />
+                            )}
+                        </button>
+                        <button
+                            className="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-white/5 transition text-gray-900 dark:text-white"
+                            onClick={() => setIsOpen(!isOpen)}
+                        >
+                            {isOpen ? <X className="w-6 h-6" /> : <Menu className="w-6 h-6" />}
+                        </button>
+                    </div>
                 </div>
             </div>
             {/* Mobile Menu */}
             {isOpen && (
-                <div className="md:hidden border-t border-white/10 bg-[#0a0a0f]">
+                <div className="md:hidden border-t border-gray-200 dark:border-white/10 bg-white dark:bg-[#0a0a0f] transition-colors duration-300">
                     <div className="px-4 py-4 space-y-3">
-                        <Link href="/#features" className="block text-gray-300 hover:text-white transition" onClick={() => setIsOpen(false)}>Features</Link>
-                        <Link href="/#history" className="block text-gray-300 hover:text-white transition" onClick={() => setIsOpen(false)}>History</Link>
-                        <Link href="/#api" className="block text-gray-300 hover:text-white transition" onClick={() => setIsOpen(false)}>API</Link>
-                        <Link href="/docs" className="block text-gray-300 hover:text-white transition" onClick={() => setIsOpen(false)}>Docs</Link>
+                        <Link href="/#features" className="block text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition" onClick={() => setIsOpen(false)}>Features</Link>
+                        <Link href="/#history" className="block text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition" onClick={() => setIsOpen(false)}>History</Link>
+                        <Link href="/#api" className="block text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition" onClick={() => setIsOpen(false)}>API</Link>
+                        <Link href="/docs" className="block text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition" onClick={() => setIsOpen(false)}>Docs</Link>
                         <a
                             href="https://github.com/programinglive/dev-workflow-mcp-server"
                             target="_blank"
                             rel="noopener noreferrer"
-                            className="flex items-center gap-2 text-gray-300 hover:text-white transition"
+                            className="flex items-center gap-2 text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition"
                         >
                             <Github className="w-4 h-4" />
                             GitHub

package/web/components/Terminal.tsx

@@ -107,7 +107,7 @@ export default function Terminal() {
     };
 
     return (
-        <div ref={containerRef} className="font-mono text-sm space-y-2 min-h-[400px]">
+        <div ref={containerRef} className="font-mono text-xs sm:text-sm space-y-1.5 sm:space-y-2 min-h-[300px] sm:min-h-[400px]">
             {lines}
         </div>
     );

package/web/components/ThemeProvider.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import { createContext, useContext, useEffect, useState } from "react";
+
+type Theme = "light" | "dark";
+
+interface ThemeContextType {
+  theme: Theme;
+  toggleTheme: () => void;
+}
+
+const ThemeContext = createContext<ThemeContextType | undefined>(undefined);
+
+export function ThemeProvider({ children }: { children: React.ReactNode }) {
+  const [theme, setTheme] = useState<Theme>("dark");
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+    // Check localStorage for saved theme preference
+    const savedTheme = localStorage.getItem("theme") as Theme | null;
+    if (savedTheme) {
+      setTheme(savedTheme);
+      document.documentElement.classList.toggle("dark", savedTheme === "dark");
+    } else {
+      // Check system preference
+      const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+      const initialTheme = prefersDark ? "dark" : "light";
+      setTheme(initialTheme);
+      document.documentElement.classList.toggle("dark", prefersDark);
+    }
+  }, []);
+
+  const toggleTheme = () => {
+    const newTheme = theme === "dark" ? "light" : "dark";
+    setTheme(newTheme);
+    localStorage.setItem("theme", newTheme);
+    document.documentElement.classList.toggle("dark", newTheme === "dark");
+  };
+
+  if (!mounted) {
+    return <>{children}</>;
+  }
+
+  return (
+    <ThemeContext.Provider value={{ theme, toggleTheme }}>
+      {children}
+    </ThemeContext.Provider>
+  );
+}
+
+export function useTheme() {
+  const context = useContext(ThemeContext);
+  if (context === undefined) {
+    throw new Error("useTheme must be used within a ThemeProvider");
+  }
+  return context;
+}

package/web/tailwind.config.ts

@@ -6,6 +6,7 @@ const config: Config = {
         "./components/**/*.{js,ts,jsx,tsx,mdx}",
         "./app/**/*.{js,ts,jsx,tsx,mdx}",
     ],
+    darkMode: "class",
     theme: {
         extend: {
             colors: {

package/web/tests/build.test.js

@@ -0,0 +1,69 @@
+/**
+ * Build Verification Tests
+ * Tests that the website builds successfully and key features are present
+ */
+
+import { execSync } from 'child_process';
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const webDir = path.join(__dirname, '..');
+const outDir = path.join(webDir, 'out');
+
+describe('Build Tests', () => {
+  test('should build successfully', () => {
+    execSync('npm run build', { cwd: webDir, stdio: 'pipe' });
+    expect(fs.existsSync(outDir)).toBe(true);
+  });
+
+  test('should generate homepage', () => {
+    const indexPath = path.join(outDir, 'index.html');
+    expect(fs.existsSync(indexPath)).toBe(true);
+    const content = fs.readFileSync(indexPath, 'utf-8');
+    expect(content).toContain('Dev Workflow');
+  });
+
+  test('should include dark mode support', () => {
+    const indexPath = path.join(outDir, 'index.html');
+    const content = fs.readFileSync(indexPath, 'utf-8');
+    expect(content).toContain('dark:');
+  });
+
+  test('should include responsive design', () => {
+    const indexPath = path.join(outDir, 'index.html');
+    const content = fs.readFileSync(indexPath, 'utf-8');
+    expect(content).toContain('sm:');
+    expect(content).toContain('md:');
+    expect(content).toContain('lg:');
+  });
+});
+
+describe('Theme Toggle Tests', () => {
+  test('should have theme persistence', () => {
+    const navbarPath = path.join(webDir, 'components', 'Navbar.tsx');
+    const content = fs.readFileSync(navbarPath, 'utf-8');
+    expect(content).toContain('localStorage');
+  });
+
+  test('should detect system preference', () => {
+    const navbarPath = path.join(webDir, 'components', 'Navbar.tsx');
+    const content = fs.readFileSync(navbarPath, 'utf-8');
+    expect(content).toContain('prefers-color-scheme');
+  });
+});
+
+describe('Responsive Design Tests', () => {
+  test('should optimize for vertical monitors', () => {
+    const heroPath = path.join(webDir, 'components', 'Hero.tsx');
+    const content = fs.readFileSync(heroPath, 'utf-8');
+    expect(content).toContain('xl:grid-cols-2');
+  });
+
+  test('should have responsive navbar', () => {
+    const navbarPath = path.join(webDir, 'components', 'Navbar.tsx');
+    const content = fs.readFileSync(navbarPath, 'utf-8');
+    expect(content).toContain('md:hidden');
+  });
+});

package/scripts/build-docs.js

@@ -1,58 +0,0 @@
-import { readFile, writeFile, mkdir } from 'node:fs/promises';
-import path from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { marked } from 'marked';
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const projectRoot = path.join(__dirname, '..');
-
-const docs = [
-  {
-    key: 'README.md',
-    source: path.join(projectRoot, 'README.md'),
-    output: 'README.html',
-  },
-  {
-    key: 'web-dashboard.md',
-    source: path.join(projectRoot, 'docs', 'web-dashboard.md'),
-    output: 'web-dashboard.html',
-  },
-  {
-    key: 'GETTING-STARTED.md',
-    source: path.join(projectRoot, 'docs', 'antigravity', 'GETTING-STARTED.md'),
-    output: 'GETTING-STARTED.html',
-  },
-  {
-    key: 'EXAMPLES.md',
-    source: path.join(projectRoot, 'docs', 'antigravity', 'EXAMPLES.md'),
-    output: 'EXAMPLES.html',
-  },
-  {
-    key: 'WORKFLOW-TEMPLATES.md',
-    source: path.join(projectRoot, 'docs', 'antigravity', 'WORKFLOW-TEMPLATES.md'),
-    output: 'WORKFLOW-TEMPLATES.html',
-  },
-  {
-    key: 'TROUBLESHOOTING.md',
-    source: path.join(projectRoot, 'docs', 'antigravity', 'TROUBLESHOOTING.md'),
-    output: 'TROUBLESHOOTING.html',
-  },
-];
-
-const distDocDir = path.join(projectRoot, 'dist', 'docs');
-
-async function buildDocs() {
-  await mkdir(distDocDir, { recursive: true });
-
-  for (const doc of docs) {
-    const markdown = await readFile(doc.source, 'utf-8');
-    const html = marked.parse(markdown);
-    await writeFile(path.join(distDocDir, doc.output), html, 'utf-8');
-  }
-}
-
-buildDocs().catch((error) => {
-  console.error('Failed to build documentation assets:', error);
-  process.exitCode = 1;
-});