chore: migrate postprocessing docs to Nuxt + Nuxt UI

apps/cientos-docs/app/components/TheLogo.vue

@@ -1,14 +1,6 @@
 <template>
   <div class="flex items-center">
-    <img
-      src="/logo.svg"
-      alt="cientos.js"
-      class="h-3 mr-4"
-    />
-    <a
-      class="font-bold text-dark font-sans text-sm"
-      href="/"
-      title="Home"
-    >Cientos</a>
+    <img src="/logo.svg" alt="cientos.js" class="h-3 mr-4" />
+    <a class="font-bold text-dark font-sans text-sm" href="/" title="Home">Cientos</a>
   </div>
 </template>

apps/postprocessing-docs/.editorconfig

@@ -0,0 +1,11 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true

apps/postprocessing-docs/.gitignore

@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example

apps/postprocessing-docs/.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

apps/postprocessing-docs/CLAUDE.md

@@ -0,0 +1,283 @@
+# Post-processing docs - CLAUDE.md
+
+This is the documentation site for `@tresjs/post-processing` built with Nuxt v4 and Nuxt UI v4.
+
+## Overview
+
+This app provides docs for TresJS post-processing effects (pmndrs + three native) with:
+
+- Nuxt v4 with compatibility mode enabled
+- Nuxt UI v4 for beautiful, accessible components
+- Nuxt Content for markdown-based content
+- TresJS integration for 3D examples
+- Full-text search functionality
+- Dark mode support
+- SEO optimization
+
+## Architecture
+
+### App Structure
+
+```
+app/
+├── app.config.ts           # UI theme and app configuration
+├── app.vue                 # Root application component
+├── error.vue               # Error page component
+├── assets/css/             # Global styles
+├── components/             # Vue components
+│   ├── content/            # MDC prose components
+│   └── diagrams/           # Custom diagram components
+├── composables/            # Composable functions (useNavigation)
+├── layouts/                # Page layouts (docs.vue)
+├── pages/                  # Route pages
+│   ├── index.vue           # Landing page
+│   └── [...slug].vue       # Dynamic docs pages
+└── utils/                  # Utility functions
+```
+
+### Content Structure
+
+Content is organized in numbered directories for ordering:
+
+```
+content/
+├── index.md                # Landing page content
+├── 1.getting-started/      # Introduction + installation
+├── 2.api/
+│   ├── 1.pmndrs/           # 29 pmndrs effect pages
+│   └── 2.three/            # 6 three native effect pages
+└── 3.advanced/             # Advanced guide
+```
+
+## Key Features
+
+### Nuxt UI v4
+
+- Uses Nuxt UI v4 components (`UApp`, `UPage`, `UMain`, etc.)
+- Custom theme configuration in `app.config.ts`
+- Pink (`#FF7BAC`) color scheme as primary, anchored at `-300` shade
+- Custom CSS variables for patterns and gradients
+
+### Nuxt Content
+
+- Markdown with MDC (Markdown Components) syntax
+- Collection-based content management
+- Automatic table of contents generation
+- Search integration
+
+### TresJS Integration
+
+- Vue template compiler options configured for TresJS
+- Support for 3D scene components
+- Ready for interactive 3D examples
+
+### SEO & Meta
+
+- Configured SEO meta tags
+- Open Graph and Twitter card support
+- Dynamic titles and descriptions
+- Sitemap generation ready
+
+## Configuration
+
+### Theme Customization
+
+Edit `app/app.config.ts` to customize:
+
+```ts
+ui: {
+  colors: {
+    primary: 'pink',      // Post-processing brand palette
+    neutral: 'zinc',
+  },
+}
+```
+
+### Navigation
+
+Edit `app/composables/useNavigation.ts` to modify header navigation links.
+
+### Content Collections
+
+Content is organized using Nuxt Content collections defined in `content.config.ts`:
+
+- `landing` - Landing page (index.md)
+- `docs` - All documentation pages
+
+### LLM Documentation
+
+The `nuxt-llms` module is configured to generate LLM-friendly documentation at `/llms.txt` and `/llms-full.txt`.
+
+## Components
+
+### Layout Components
+
+- **AppHeader** - Site header with navigation, search, and color mode toggle
+- **AppFooter** - Footer with links and copyright
+- **AppSide** - Sidebar navigation for docs layout
+
+### Content Components
+
+- **ProseA** - Enhanced anchor links in markdown content
+
+### Diagram Components
+
+Custom SVG diagram components for technical documentation.
+
+## Development
+
+### Prerequisites
+
+- Node.js 18+
+- pnpm package manager
+
+### Commands
+
+```bash
+# Install dependencies
+pnpm install
+
+# Development server
+pnpm dev
+
+# Build for production
+pnpm build
+
+# Preview production build
+pnpm preview
+
+# Lint code
+pnpm lint
+
+# Type checking
+pnpm typecheck
+```
+
+## Styling
+
+### CSS Architecture
+
+- **Tailwind CSS v4** via `@import 'tailwindcss'`
+- **Nuxt UI** styles via `@import '@nuxt/ui'`
+- Custom theme variables in `main.css`
+- Pattern backgrounds (`.pattern-bg`, `.pattern-dot-bg`)
+
+### Color Palette
+
+Two custom color palettes are defined:
+
+- **Pink** (50-950) - Primary brand color, anchor `#FF7BAC` at `-300`
+- **Teal** (50-950) - Accent color for landing / highlights
+
+### Dark Mode
+
+Automatic dark mode with theme-aware pattern backgrounds and custom favicon switching.
+
+## Content Writing
+
+### Markdown Format
+
+```md
+---
+title: Page Title
+description: Page description for SEO
+---
+
+# Heading
+
+Content here with **bold** and *italic* text.
+
+::callout
+Custom MDC component
+::
+```
+
+### MDC Components
+
+Use Vue components directly in markdown:
+
+```md
+::block-hero
+---
+cta:
+  - Get started
+  - /getting-started
+---
+
+#title
+Hero Title
+
+#description
+Hero description
+::
+```
+
+## Deployment
+
+### Static Site Generation
+
+Configured for static site generation with Nitro prerendering:
+
+```ts
+nitro: {
+  prerender: {
+    routes: ['/'],
+    crawlLinks: true,
+  },
+}
+```
+
+### Environment Variables
+
+Create `.env` file for environment-specific configuration (use `.env.example` as reference).
+
+## Best Practices
+
+1. **Content Organization** - Use numbered prefixes for ordering
+2. **Component Naming** - Use PascalCase for components
+3. **MDC Syntax** - Leverage MDC for rich content
+4. **Accessibility** - All UI components are accessible by default
+5. **Performance** - Images are optimized via @nuxt/image
+6. **SEO** - Always include title and description frontmatter
+
+## Extending the Boilerplate
+
+### Adding New Sections
+
+1. Create new directory in `content/`
+2. Add index page with navigation
+3. Update `useNavigation.ts` if needed (Get Started, API, Advanced)
+4. Update `llms` configuration in `nuxt.config.ts`
+
+### Custom Components
+
+1. Add components in `app/components/`
+2. MDC components go in `app/components/content/`
+3. Auto-imported by Nuxt
+
+### Styling Customization
+
+1. Update theme variables in `app.config.ts`
+2. Add custom CSS in `app/assets/css/main.css`
+3. Use Tailwind utilities for component styles
+
+## Troubleshooting
+
+### Build Issues
+
+- Ensure Node.js 18+ is installed
+- Clear `.nuxt` and `node_modules`, reinstall
+- Check `pnpm-workspace.yaml` includes `apps/*`
+
+### Content Not Rendering
+
+- Check frontmatter syntax
+- Verify collection configuration in `content.config.ts`
+- Ensure files use `.md` extension
+
+## Resources
+
+- [Nuxt Documentation](https://nuxt.com)
+- [Nuxt UI Documentation](https://ui.nuxt.com)
+- [Nuxt Content Documentation](https://content.nuxt.com)
+- [TresJS Documentation](https://docs.tresjs.org)