migrate over docs ssite

Author: macalinao

apps/docs/.gitignore

@@ -8,7 +8,7 @@
 
 # test & build
 /coverage
-/.next/
+.next/
 /out/
 /build
 *.tsbuildinfo

apps/docs/README.md

@@ -1,45 +1,75 @@
-# coda-docs
+# Coda Documentation
 
-This is a Next.js application generated with
-[Create Fumadocs](https://github.com/fuma-nama/fumadocs).
+This is the documentation site for Coda, built with [Fumadocs](https://fumadocs.vercel.app) and Next.js.
 
-Run development server:
+## Development
 
 ```bash
-npm run dev
-# or
-pnpm dev
-# or
-yarn dev
+# Install dependencies
+bun install
+
+# Start development server
+bun run dev
+
+# Build for production
+bun run build
 ```
 
-Open http://localhost:3000 with your browser to see the result.
+## Structure
 
-## Explore
+```
+apps/docs/
+├── content/          # Documentation content (MDX files)
+│   └── docs/        # Main documentation pages
+├── src/
+│   ├── app/         # Next.js app directory
+│   │   ├── (home)/  # Home page layout
+│   │   └── docs/    # Documentation layout
+│   └── lib/         # Library code
+└── scripts/         # Build scripts
+```
 
-In the project, you can see:
+## Adding Documentation
 
-- `lib/source.ts`: Code for content source adapter, [`loader()`](https://fumadocs.dev/docs/headless/source-api) provides the interface to access your content.
-- `lib/layout.shared.tsx`: Shared options for layouts, optional but preferred to keep.
+1. Create MDX files in `content/docs/`
+2. Update navigation in `content/docs/meta.json` if needed
+3. Run `bun run dev` to preview changes
 
-| Route                     | Description                                            |
-| ------------------------- | ------------------------------------------------------ |
-| `app/(home)`              | The route group for your landing page and other pages. |
-| `app/docs`                | The documentation layout and pages.                    |
-| `app/api/search/route.ts` | The Route Handler for search.                          |
+## Configuration
 
-### Fumadocs MDX
+- **Layout**: Site configuration in `src/lib/layout.shared.tsx`
+- **MDX**: MDX processing in `source.config.ts`
+- **Styling**: Global styles in `src/app/global.css` (Tailwind v4)
 
-A `source.config.ts` config file has been included, you can customise different options like frontmatter schema.
+## Technologies
 
-Read the [Introduction](https://fumadocs.dev/docs/mdx) for further details.
+- **Framework**: Next.js 15 with App Router
+- **Documentation**: Fumadocs UI
+- **Styling**: Tailwind CSS v4
+- **MDX**: Fumadocs MDX with Shiki syntax highlighting
+- **Package Manager**: Bun
 
-## Learn More
+## Using the Cards Component
 
-To learn more about Next.js and Fumadocs, take a look at the following
-resources:
+For better documentation layout, use the `<Cards>` component for link grids:
+
+```mdx
+<Cards>
+  <Card 
+    title="Installation" 
+    description="Step-by-step guide to install Coda"
+    href="/docs/installation"
+  />
+  <Card 
+    title="Quick Start" 
+    description="Generate your first TypeScript client"
+    href="/docs/quick-start"
+  />
+</Cards>
+```
+
+## Learn More
 
-- [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.
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API
 - [Fumadocs](https://fumadocs.vercel.app) - learn about Fumadocs
+- [Coda Repository](https://github.com/macalinao/coda) - main Coda repository

apps/docs/content/docs/api/meta.json

@@ -1,4 +1,4 @@
 {
   "title": "API Reference",
-  "pages": ["index", "cli", "configuration", "visitors"]
+  "pages": ["index", "clients"]
 }

apps/docs/content/docs/index.mdx

@@ -25,49 +25,25 @@ The generated code is built on [Codama](https://github.com/codama-idl/codama), t
 
 ## Where to start?
 
-<div className="grid sm:grid-cols-2 gap-6 mt-8">
-  <a
+<Cards>
+  <Card 
+    title="Installation" 
+    description="Step-by-step guide to install Coda. Set up your local development environment."
     href="/docs/installation"
-    className="group relative rounded-lg border border-border bg-card p-6 transition-colors hover:bg-accent"
-  >
-    <h3 className="font-semibold text-lg mb-2">Installation</h3>
-    <p className="text-sm text-muted-foreground">
-      Step-by-step guide to install Coda. Set up your local
-      development environment.
-    </p>
-  </a>
-
-  <a
+  />
+  <Card 
+    title="Quick Start" 
+    description="Generate your first TypeScript client from an Anchor IDL. No configuration required."
     href="/docs/quick-start"
-    className="group relative rounded-lg border border-border bg-card p-6 transition-colors hover:bg-accent"
-  >
-    <h3 className="font-semibold text-lg mb-2">Quick Start</h3>
-    <p className="text-sm text-muted-foreground">
-      Generate your first TypeScript client from an Anchor IDL. No configuration
-      required.
-    </p>
-  </a>
-</div>
-
-<div className="grid sm:grid-cols-2 gap-6 mt-6">
-  <a
+  />
+  <Card 
+    title="Why Coda?" 
+    description="Learn how Coda simplifies Solana development."
     href="/docs/why-coda"
-    className="group relative rounded-lg border border-border bg-card p-6 transition-colors hover:bg-accent"
-  >
-    <h3 className="font-semibold text-lg mb-2">Why Coda?</h3>
-    <p className="text-sm text-muted-foreground">
-      Learn how Coda simplifies Solana development.
-    </p>
-  </a>
-
-  <a
+  />
+  <Card 
+    title="Configuration" 
+    description="Advanced configuration options for customizing code generation to your specific needs."
     href="/docs/configuration"
-    className="group relative rounded-lg border border-border bg-card p-6 transition-colors hover:bg-accent"
-  >
-    <h3 className="font-semibold text-lg mb-2">Configuration</h3>
-    <p className="text-sm text-muted-foreground">
-      Advanced configuration options for customizing code generation to your
-      specific needs.
-    </p>
-  </a>
-</div>
+  />
+</Cards>

apps/docs/content/docs/meta.json

@@ -1,4 +1,11 @@
 {
   "title": "Documentation",
-  "pages": ["index", "installation", "configuration", "api", "...api/clients"]
+  "pages": [
+    "index",
+    "installation",
+    "quick-start",
+    "why-coda",
+    "configuration",
+    "api"
+  ]
 }