mcpField
D
docs-page

docs-page

github.com/nexu-io设计与 UI9.3k41 次安装2 周前更新
代码仓库

关于 docs-page

用于制作 API 或教程文档单页的设计技能,侧重长文阅读体验。页面包含固定侧栏导航、正文与滚动目录,并提供搜索、版本和主题切换等顶栏元素。

主要功能

  1. 01固定的侧栏章节导航
  2. 02含代码块、提示框和表格的正文
  3. 03滚动跟随目录
  4. 04顶栏搜索与版本显示
  5. 05主题切换

适用场景

  1. 01设计 API 参考文档页面
  2. 02制作带目录的技术教程
  3. 03为长文档添加章节导航和搜索

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/nexu-io/html-anything --skill docs-page

安装后在 Claude Code 中输入/docs-page确认已加载。

附带文件example.html

README 原文English

来自项目 README

README 暂无中文译文,以下为英文原文;中文介绍见上方。

【模板: 技术文档页】 【意图】API / 教程文档单页, 长读体验优先。 【布局】

  • Inline-start nav (sections + sticky)
  • Article body (含代码块, callouts, 表格)
  • Inline-end TOC (sticky, scroll-spy)
  • 顶栏 search + version + 主题切换 【设计细节】
  • 代码块: 圆角 + dark + 语言标签 + 复制按钮
  • callout: info / warn / danger 三色

评论

支持 Markdown