Files

Jason Woltje f5792c40be feat: Complete fleet — 94 skills across 10+ domains

Pulled ALL skills from 15 source repositories:
- anthropics/skills: 16 (docs, design, MCP, testing)
- obra/superpowers: 14 (TDD, debugging, agents, planning)
- coreyhaines31/marketingskills: 25 (marketing, CRO, SEO, growth)
- better-auth/skills: 5 (auth patterns)
- vercel-labs/agent-skills: 5 (React, design, Vercel)
- antfu/skills: 16 (Vue, Vite, Vitest, pnpm, Turborepo)
- Plus 13 individual skills from various repos

Mosaic Stack is not limited to coding — the Orchestrator and
subagents serve coding, business, design, marketing, writing,
logistics, analysis, and more.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

2026-02-16 16:27:42 -06:00

3.3 KiB

Raw Permalink Blame History

name, description

name	description
vitepress-code-blocks	Syntax highlighting, line highlighting, colored diffs, focus, and line numbers

Code Blocks

VitePress uses Shiki for syntax highlighting with powerful code block features.

Syntax Highlighting

Specify language after opening backticks:

```js
export default {
  name: 'MyComponent'
}
```

Supports all languages available in Shiki.

Line Highlighting

Highlight specific lines:

```js{4}
export default {
  data() {
    return {
      msg: 'Highlighted!'  // Line 4 highlighted
    }
  }
}
```

Multiple lines and ranges:

```js{1,4,6-8}
// Line 1 highlighted
export default {
  data() {
    return {      // Line 4
      msg: 'Hi',
      foo: 'bar', // Lines 6-8
      baz: 'qux'
    }
  }
}
```

Inline highlighting with comment:

```js
export default {
  data() {
    return {
      msg: 'Highlighted!' // [!code highlight]
    }
  }
}
```

Focus

Blur other code and focus specific lines:

```js
export default {
  data() {
    return {
      msg: 'Focused!' // [!code focus]
    }
  }
}
```

Focus multiple lines:

// [!code focus:3]

Colored Diffs

Show additions and removals:

```js
export default {
  data() {
    return {
      msg: 'Removed' // [!code --]
      msg: 'Added'   // [!code ++]
    }
  }
}
```

Errors and Warnings

Color lines as errors or warnings:

```js
export default {
  data() {
    return {
      msg: 'Error',   // [!code error]
      msg: 'Warning'  // [!code warning]
    }
  }
}
```

Line Numbers

Enable globally:

// .vitepress/config.ts
export default {
  markdown: {
    lineNumbers: true
  }
}

Per-block override:

```ts:line-numbers
// Line numbers enabled
const a = 1
```

```ts:no-line-numbers
// Line numbers disabled
const b = 2
```

Start from specific number:

```ts:line-numbers=5
// Starts at line 5
const a = 1  // This is line 5
const b = 2  // This is line 6
```

Code Groups

Tabbed code blocks:

::: code-group

```js [JavaScript]
export default { /* ... */ }
```

```ts [TypeScript]
export default defineConfig({ /* ... */ })
```

:::

Import Code Snippets

From external files:

<<< @/snippets/snippet.js

With highlighting:

<<< @/snippets/snippet.js{2,4-6}

Specific region:

<<< @/snippets/snippet.js#regionName{1,2}

With language and line numbers:

<<< @/snippets/snippet.cs{1,2,4-6 c#:line-numbers}

In code groups:

::: code-group

<<< @/snippets/config.js [JavaScript]
<<< @/snippets/config.ts [TypeScript]

:::

File Labels

Add filename labels to code blocks:

```js [vite.config.js]
export default defineConfig({})
```

Key Points

Use // [!code highlight] for inline highlighting
Use // [!code focus] to focus with blur effect
Use // [!code ++] and // [!code --] for diffs
Use // [!code error] and // [!code warning] for status
:line-numbers and :no-line-numbers control line numbers per block
@ in imports refers to source root
Code groups create tabbed interfaces

3.3 KiB Raw Permalink Blame History