docs: write explainer documentation

Author: LeadcodeDev

apps/docs/src/content/docs/another-lib/_meta.json

@@ -0,0 +1,4 @@
+{
+  "icon": "book-open",
+  "title": "Explainer"
+}

apps/docs/src/content/docs/another-lib/v1/en/getting-started.mdx

@@ -0,0 +1,5 @@
+{
+  "title": "Blog",
+  "icon": "newspaper",
+  "order": 7
+}

apps/docs/src/content/docs/another-lib/v2/en/getting-started.mdx

@@ -0,0 +1,76 @@
+---
+title: Overview
+description: Learn about the Explainer blog app, its content structure, and features.
+icon: newspaper
+order: 1
+---
+
+# Blog
+
+The blog is a standalone Astro app at `apps/blog/` running on port **4322**. It supports posts with tags, authors, cover images, drafts, and an RSS feed.
+
+## Content location
+
+Blog posts are MDX files in:
+
+```text
+apps/blog/src/content/posts/*.mdx
+```
+
+## Frontmatter schema
+
+```mdx [my-post.mdx]
+---
+title: Introducing Explainer v2
+description: A new documentation boilerplate built with Astro, React, and Tailwind CSS 4.
+date: 2026-03-10
+tags: [announcement, release]
+cover: /images/cover.png
+draft: false
+author: leadcode_dev
+---
+```
+
+| Field | Type | Required | Description |
+|-------|------|----------|-------------|
+| `title` | `string` | Yes | Post title |
+| `description` | `string` | Yes | Short description for cards and SEO |
+| `date` | `date` | Yes | Publication date (future dates are hidden) |
+| `tags` | `string[]` | No | Tags for filtering (default: `[]`) |
+| `cover` | `string` | No | Cover image path |
+| `draft` | `boolean` | No | Draft posts are hidden from listing (default: `false`) |
+| `author` | `string` | No | Author key matching the authors map |
+
+## Features
+
+- **Draft mode** — Set `draft: true` to hide a post from listings while still accessible by direct URL during development
+- **Tag filtering** — Posts can be filtered by tag on the blog index page
+- **RSS feed** — An RSS feed is automatically generated at `/rss.xml`
+- **Reading time** — Estimated reading time is calculated at 200 words per minute
+- **Featured posts** — The first posts are displayed in a larger card layout on the index
+- **Pagination** — Posts are paginated at 10 per page
+
+## Authors
+
+Authors are defined in `apps/blog/src/lib/authors.ts`:
+
+```typescript [authors.ts]
+export const authors: Record<string, Author> = {
+  leadcode_dev: {
+    name: 'Baptiste Parmantier',
+    title: 'Creator of Explainer',
+    avatar: 'https://avatars.githubusercontent.com/u/8946317?v=4',
+    href: 'https://github.com/LeadcodeDev',
+  },
+}
+```
+
+Reference an author by their key in the post frontmatter: `author: leadcode_dev`.
+
+## Development
+
+```bash
+pnpm dev --filter @explainer/blog
+```
+
+The blog runs on `http://localhost:4322`.

apps/docs/src/content/docs/another-lib/v2/en/guides/_meta.json

@@ -0,0 +1,6 @@
+{
+  "title": "Code Blocks",
+  "icon": "code",
+  "order": 5,
+  "type": "group"
+}

apps/docs/src/content/docs/another-lib/v2/en/guides/migration.mdx

@@ -0,0 +1,109 @@
+---
+title: Diffs & Focus
+description: Show code additions, removals, focus areas, and error highlights.
+icon: git-compare
+order: 4
+---
+
+# Diffs & Focus
+
+Highlight code changes, focus areas, and errors using inline comment annotations.
+
+## Diff notation
+
+Mark lines as added or removed using `// [!code ++]` and `// [!code --]`:
+
+````mdx
+```typescript
+function createUser(name: string) {
+  const user = { name }       // [!code --]
+  const user = { name, id: generateId() }  // [!code ++]
+  return user
+}
+```
+````
+
+Renders as:
+
+```typescript
+function createUser(name: string) {
+  const user = { name }       // [!code --]
+  const user = { name, id: generateId() }  // [!code ++]
+  return user
+}
+```
+
+Removed lines are highlighted in red, added lines in green.
+
+## Focus mode
+
+Use `// [!code focus]` to dim all lines except the focused ones:
+
+````mdx
+```typescript
+import { defineConfig } from 'astro/config'
+import react from '@astrojs/react'
+import mdx from '@astrojs/mdx'
+
+export default defineConfig({
+  integrations: [
+    react(),  // [!code focus]
+    mdx(),    // [!code focus]
+  ]
+})
+```
+````
+
+Renders as:
+
+```typescript
+import { defineConfig } from 'astro/config'
+import react from '@astrojs/react'
+import mdx from '@astrojs/mdx'
+
+export default defineConfig({
+  integrations: [
+    react(),  // [!code focus]
+    mdx(),    // [!code focus]
+  ]
+})
+```
+
+## Error highlighting
+
+Mark lines with `// [!code error]` to highlight them as errors:
+
+````mdx
+```typescript
+const port = process.env.PORT
+app.listen(port) // [!code error]
+app.listen(Number(port)) // [!code highlight]
+```
+````
+
+Renders as:
+
+```typescript
+const port = process.env.PORT
+app.listen(port) // [!code error]
+app.listen(Number(port)) // [!code highlight]
+```
+
+## Combining annotations
+
+You can use multiple annotation types in the same code block:
+
+```typescript
+function connect(url: string) {
+  const oldClient = createClient(url)    // [!code --]
+  const newClient = createClient(url, {  // [!code ++]
+    retry: true,                         // [!code ++]
+    timeout: 5000,                       // [!code ++]
+  })                                     // [!code ++]
+  return newClient                       // [!code focus]
+}
+```
+
+:::callout{variant="info"}
+The inline comments (`// [!code ...]`) are stripped from the rendered output — readers only see the visual highlights.
+:::