forked from Gitlink/gitlink-cli
401 lines
20 KiB
HTML
401 lines
20 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>gitlink-cli · 功能全景</title>
|
|
<style>
|
|
:root {
|
|
--bg: #0d1117;
|
|
--bg-subtle: #161b22;
|
|
--bg-inset: #010409;
|
|
--border: #30363d;
|
|
--border-muted: #21262d;
|
|
--text: #c9d1d9;
|
|
--text-muted: #8b949e;
|
|
--accent: #58a6ff;
|
|
--accent-soft: rgba(56,139,253,0.15);
|
|
--green: #3fb950;
|
|
--green-soft: rgba(63,185,80,0.12);
|
|
--purple: #bc8cff;
|
|
--radius: 12px;
|
|
}
|
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
html { scroll-behavior: smooth; }
|
|
body {
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
|
|
"Microsoft YaHei", "Hiragino Sans GB", Helvetica, Arial, sans-serif;
|
|
line-height: 1.55;
|
|
-webkit-font-smoothing: antialiased;
|
|
min-height: 100vh;
|
|
background-image:
|
|
radial-gradient(900px 380px at 100% -8%, rgba(56,139,253,0.10), transparent 60%),
|
|
radial-gradient(800px 360px at -8% -4%, rgba(188,140,255,0.08), transparent 60%);
|
|
background-attachment: fixed;
|
|
}
|
|
|
|
/* ---------- Header ---------- */
|
|
header {
|
|
position: sticky; top: 0; z-index: 50;
|
|
backdrop-filter: blur(12px);
|
|
background: rgba(13,17,23,0.78);
|
|
border-bottom: 1px solid var(--border);
|
|
}
|
|
.header-inner {
|
|
max-width: 1200px; margin: 0 auto;
|
|
padding: 22px 24px 18px;
|
|
display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
|
|
}
|
|
.brand { display: flex; align-items: center; gap: 12px; margin-right: auto; }
|
|
.logo {
|
|
width: 44px; height: 44px; border-radius: 11px;
|
|
background: linear-gradient(135deg, #2f81f7, #8957e5);
|
|
display: grid; place-items: center;
|
|
font-size: 24px; color: #fff; font-weight: 800;
|
|
box-shadow: 0 4px 14px rgba(56,139,253,0.45);
|
|
}
|
|
.brand h1 { font-size: 20px; font-weight: 650; letter-spacing: -0.3px; }
|
|
.brand .sub { font-size: 12.5px; color: var(--text-muted); }
|
|
|
|
.search-wrap { position: relative; flex: 0 1 320px; min-width: 200px; }
|
|
.search-wrap svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--text-muted); }
|
|
input#search {
|
|
width: 100%; padding: 10px 14px 10px 38px;
|
|
background: var(--bg-inset); color: var(--text);
|
|
border: 1px solid var(--border); border-radius: 9px;
|
|
font-size: 14px; outline: none; transition: .15s;
|
|
}
|
|
input#search:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
|
|
.kbd {
|
|
position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
|
|
font-size: 11px; color: var(--text-muted);
|
|
border: 1px solid var(--border); border-radius: 5px; padding: 1px 6px;
|
|
background: var(--bg-subtle);
|
|
}
|
|
|
|
/* ---------- Stats ---------- */
|
|
.stats {
|
|
max-width: 1200px; margin: 0 auto;
|
|
padding: 26px 24px 6px;
|
|
display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
|
|
}
|
|
.stat {
|
|
background: var(--bg-subtle);
|
|
border: 1px solid var(--border-muted);
|
|
border-radius: var(--radius);
|
|
padding: 16px 18px;
|
|
position: relative; overflow: hidden;
|
|
}
|
|
.stat::after {
|
|
content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
|
|
background: var(--accent);
|
|
}
|
|
.stat.green::after { background: var(--green); }
|
|
.stat.purple::after { background: var(--purple); }
|
|
.stat.muted::after { background: var(--text-muted); }
|
|
.stat .num { font-size: 28px; font-weight: 700; letter-spacing: -1px; }
|
|
.stat .label { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; }
|
|
|
|
/* ---------- Layout ---------- */
|
|
main { max-width: 1200px; margin: 0 auto; padding: 22px 24px 64px; }
|
|
.grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
|
|
|
|
/* ---------- Category card ---------- */
|
|
.card {
|
|
background: var(--bg-subtle);
|
|
border: 1px solid var(--border-muted);
|
|
border-radius: var(--radius);
|
|
overflow: hidden; transition: border-color .15s;
|
|
}
|
|
.card:hover { border-color: var(--border); }
|
|
.card-head {
|
|
display: flex; align-items: center; gap: 12px;
|
|
padding: 15px 18px; cursor: pointer; user-select: none;
|
|
transition: background .12s;
|
|
}
|
|
.card-head:hover { background: rgba(177,186,196,0.04); }
|
|
.card-icon { font-size: 20px; line-height: 1; }
|
|
.card-title { font-size: 15px; font-weight: 600; flex: 1; }
|
|
.count-badge {
|
|
font-size: 12px; color: var(--text-muted);
|
|
background: var(--bg-inset); border: 1px solid var(--border);
|
|
padding: 2px 9px; border-radius: 20px; font-variant-numeric: tabular-nums;
|
|
}
|
|
.chev { color: var(--text-muted); transition: transform .2s; flex-shrink: 0; }
|
|
.card.open .chev { transform: rotate(90deg); }
|
|
|
|
.card-body { max-height: 0; overflow: hidden; transition: max-height .25s ease; }
|
|
.card.open .card-body { max-height: 2400px; }
|
|
|
|
.row {
|
|
border-top: 1px solid var(--border-muted);
|
|
padding: 11px 18px;
|
|
cursor: pointer; transition: background .12s;
|
|
}
|
|
.row:hover { background: rgba(56,139,253,0.06); }
|
|
.row-main { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
|
|
.cmd {
|
|
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
|
|
font-size: 13px; color: var(--accent); font-weight: 600;
|
|
}
|
|
.tag {
|
|
font-size: 10.5px; font-weight: 600; letter-spacing: .3px;
|
|
padding: 2px 7px; border-radius: 20px; white-space: nowrap;
|
|
}
|
|
.tag.auth { color: var(--green); background: var(--green-soft); }
|
|
.tag.public { color: var(--accent); background: var(--accent-soft); }
|
|
.desc { color: var(--text-muted); font-size: 13px; flex: 1; min-width: 120px; }
|
|
|
|
.example {
|
|
max-height: 0; overflow: hidden; transition: max-height .2s ease;
|
|
}
|
|
.row.expanded .example { max-height: 140px; padding-top: 8px; }
|
|
.example code {
|
|
display: block;
|
|
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
|
|
font-size: 12px; color: var(--text);
|
|
background: var(--bg-inset);
|
|
border: 1px solid var(--border-muted); border-left: 3px solid var(--accent);
|
|
border-radius: 7px; padding: 10px 12px;
|
|
white-space: pre-wrap; word-break: break-all;
|
|
}
|
|
|
|
/* ---------- Empty / footer ---------- */
|
|
#empty {
|
|
text-align: center; padding: 60px 20px; color: var(--text-muted);
|
|
display: none;
|
|
}
|
|
#empty .big { font-size: 40px; margin-bottom: 10px; }
|
|
footer {
|
|
max-width: 1200px; margin: 0 auto;
|
|
padding: 0 24px 40px; text-align: center;
|
|
color: var(--text-muted); font-size: 12.5px;
|
|
}
|
|
footer a { color: var(--accent); text-decoration: none; }
|
|
footer a:hover { text-decoration: underline; }
|
|
|
|
@media (max-width: 760px) {
|
|
.stats { grid-template-columns: repeat(2, 1fr); }
|
|
.grid { grid-template-columns: 1fr; }
|
|
.search-wrap { flex: 1 1 100%; }
|
|
.header-inner { gap: 12px; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<header>
|
|
<div class="header-inner">
|
|
<div class="brand">
|
|
<div class="logo">G</div>
|
|
<div>
|
|
<h1>gitlink-cli · 功能全景</h1>
|
|
<div class="sub">交互式命令浏览仪表盘</div>
|
|
</div>
|
|
</div>
|
|
<div class="search-wrap">
|
|
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M11.5 7a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0Zm-.82 4.74a6 6 0 1 1 1.06-1.06l3.04 3.04a.75.75 0 1 1-1.06 1.06l-3.04-3.04Z"/></svg>
|
|
<input id="search" type="text" placeholder="搜索命令或描述… ( 按 / 聚焦 )" autocomplete="off">
|
|
<span class="kbd">/</span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<section class="stats">
|
|
<div class="stat"><div class="num" id="st-cat">0</div><div class="label">功能分类</div></div>
|
|
<div class="stat purple"><div class="num" id="st-total">0</div><div class="label">Shortcuts 总数</div></div>
|
|
<div class="stat green"><div class="num" id="st-auth">0</div><div class="label">需认证命令</div></div>
|
|
<div class="stat muted"><div class="num" id="st-public">0</div><div class="label">公开命令</div></div>
|
|
</section>
|
|
|
|
<main>
|
|
<div class="grid" id="grid"></div>
|
|
<div id="empty">
|
|
<div class="big">🔍</div>
|
|
<div>没有匹配的命令，换个关键词试试。</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer>
|
|
Generated by <strong>gitlink-code-insight</strong> skill ·
|
|
<a href="https://gitlink.org.cn" target="_blank" rel="noopener">Gitlink</a> ·
|
|
共 <span id="ft-total">0</span> 个命令
|
|
</footer>
|
|
|
|
<script>
|
|
const DATA = [
|
|
{ cat: "仓库管理", icon: "📦", items: [
|
|
{ cmd: "repo +list", desc: "仓库列表", auth: false, ex: "gitlink-cli repo +list --user zhangsan" },
|
|
{ cmd: "repo +info", desc: "仓库详情", auth: false, ex: "gitlink-cli repo +info --owner Gitlink --repo forgeplus" },
|
|
{ cmd: "repo +create", desc: "创建仓库", auth: true, ex: 'gitlink-cli repo +create --name my-project --description "项目描述"' },
|
|
{ cmd: "repo +fork", desc: "Fork 仓库", auth: true, ex: "gitlink-cli repo +fork --owner Gitlink --repo forgeplus" },
|
|
{ cmd: "repo +delete", desc: "删除仓库（不可逆）", auth: true, ex: "gitlink-cli repo +delete --owner myuser --repo old-project" },
|
|
{ cmd: "repo +batch-create", desc: "批量创建仓库", auth: true, ex: "gitlink-cli repo +batch-create --from repos.csv" },
|
|
{ cmd: "repo +batch-update", desc: "批量更新仓库", auth: true, ex: "gitlink-cli repo +batch-update --from updates.csv" },
|
|
{ cmd: "repo +add-member", desc: "添加仓库成员", auth: true, ex: "gitlink-cli repo +add-member --owner myuser --repo myrepo --user newmember --role developer" },
|
|
]},
|
|
{ cat: "分支管理", icon: "🌿", items: [
|
|
{ cmd: "branch +list", desc: "分支列表", auth: false, ex: "gitlink-cli branch +list --owner Gitlink --repo forgeplus" },
|
|
{ cmd: "branch +create", desc: "创建分支", auth: true, ex: "gitlink-cli branch +create --name feature/new-feature" },
|
|
{ cmd: "branch +delete", desc: "删除分支（不可逆）", auth: true, ex: "gitlink-cli branch +delete --name feature/old-feature" },
|
|
{ cmd: "branch +protect", desc: "保护分支", auth: true, ex: "gitlink-cli branch +protect --name main" },
|
|
{ cmd: "branch +unprotect", desc: "取消保护", auth: true, ex: "gitlink-cli branch +unprotect --name main" },
|
|
]},
|
|
{ cat: "Issue 管理", icon: "🐛", items: [
|
|
{ cmd: "issue +list", desc: "Issue 列表", auth: false, ex: "gitlink-cli issue +list --owner Gitlink --repo forgeplus --state open" },
|
|
{ cmd: "issue +view", desc: "Issue 详情", auth: false, ex: "gitlink-cli issue +view --owner Gitlink --repo forgeplus --number 4" },
|
|
{ cmd: "issue +create", desc: "创建 Issue", auth: true, ex: 'gitlink-cli issue +create --owner myuser --repo myrepo --title "Bug: 登录失败" --body "复现步骤"' },
|
|
{ cmd: "issue +update", desc: "更新 Issue", auth: true, ex: 'gitlink-cli issue +update --number 4 --title "新标题" --body "更新描述"' },
|
|
{ cmd: "issue +close", desc: "关闭 Issue", auth: true, ex: "gitlink-cli issue +close --number 4" },
|
|
{ cmd: "issue +batch-close", desc: "批量关闭 Issue", auth: true, ex: "gitlink-cli issue +batch-close --numbers 123,124 --dry-run" },
|
|
{ cmd: "issue +comment", desc: "添加评论", auth: true, ex: 'gitlink-cli issue +comment --number 4 --body "已修复"' },
|
|
]},
|
|
{ cat: "Pull Request", icon: "🔀", items: [
|
|
{ cmd: "pr +list", desc: "PR 列表", auth: false, ex: "gitlink-cli pr +list --owner Gitlink --repo forgeplus --state open" },
|
|
{ cmd: "pr +view", desc: "PR 详情", auth: false, ex: "gitlink-cli pr +view --id 3" },
|
|
{ cmd: "pr +create", desc: "创建 PR", auth: true, ex: 'gitlink-cli pr +create --title "feat: 新功能" --head feature/x --base master' },
|
|
{ cmd: "pr +merge", desc: "合并 PR", auth: true, ex: "gitlink-cli pr +merge --id 3 --method squash" },
|
|
{ cmd: "pr +close", desc: "关闭 PR", auth: true, ex: "gitlink-cli pr +close --id 3" },
|
|
{ cmd: "pr +files", desc: "变更文件列表", auth: false, ex: "gitlink-cli pr +files --id 3" },
|
|
{ cmd: "pr +diff", desc: "查看提交列表", auth: false, ex: "gitlink-cli pr +diff --id 3" },
|
|
{ cmd: "pr +comment", desc: "PR 评论", auth: true, ex: 'gitlink-cli pr +comment --id 3 --body "LGTM"' },
|
|
{ cmd: "pr +review", desc: "代码审查", auth: true, ex: 'gitlink-cli pr +review --id 3 --event COMMENT --body "整体 LGTM"' },
|
|
]},
|
|
{ cat: "版本发布", icon: "🚀", items: [
|
|
{ cmd: "release +list", desc: "发布列表", auth: false, ex: "gitlink-cli release +list --owner Gitlink --repo forgeplus" },
|
|
{ cmd: "release +view", desc: "发布详情", auth: false, ex: "gitlink-cli release +view --id <version_id>" },
|
|
{ cmd: "release +create", desc: "创建发布", auth: true, ex: 'gitlink-cli release +create --tag v1.0.0 --name "v1.0.0" --target master' },
|
|
{ cmd: "release +delete", desc: "删除发布（不可逆）", auth: true, ex: "gitlink-cli release +delete --id <version_id>" },
|
|
]},
|
|
{ cat: "Wiki 管理", icon: "📖", items: [
|
|
{ cmd: "wiki +list", desc: "Wiki 页面列表", auth: false, ex: "gitlink-cli wiki +list --owner Gitlink --repo forgeplus" },
|
|
{ cmd: "wiki +view", desc: "查看页面内容", auth: false, ex: 'gitlink-cli wiki +view --owner Gitlink --repo forgeplus --title "Home"' },
|
|
{ cmd: "wiki +create", desc: "创建页面", auth: true, ex: 'gitlink-cli wiki +create --owner myuser --repo myrepo --title "API 文档" --file ./api.md' },
|
|
{ cmd: "wiki +update", desc: "更新页面", auth: true, ex: 'gitlink-cli wiki +update --owner myuser --repo myrepo --title "设计文档" --add "新内容"' },
|
|
{ cmd: "wiki +delete", desc: "删除页面", auth: true, ex: 'gitlink-cli wiki +delete --owner myuser --repo myrepo --title "废弃页面"' },
|
|
]},
|
|
{ cat: "CI/CD", icon: "⚙️", items: [
|
|
{ cmd: "ci +builds", desc: "构建列表", auth: true, ex: "gitlink-cli ci +builds --owner myuser --repo myrepo" },
|
|
{ cmd: "ci +logs", desc: "构建日志", auth: true, ex: "gitlink-cli ci +logs --build 42 --stage 1 --step 1" },
|
|
{ cmd: "ci +restart", desc: "重启构建", auth: true, ex: "gitlink-cli ci +restart --build 42" },
|
|
{ cmd: "ci +stop", desc: "停止构建", auth: true, ex: "gitlink-cli ci +stop --build 42" },
|
|
]},
|
|
{ cat: "Webhook", icon: "🔔", items: [
|
|
{ cmd: "webhook +list", desc: "Webhook 列表", auth: true, ex: "gitlink-cli webhook +list --owner myuser --repo myrepo" },
|
|
{ cmd: "webhook +info", desc: "Webhook 详情", auth: true, ex: "gitlink-cli webhook +info --owner myuser --repo myrepo --id 123" },
|
|
{ cmd: "webhook +events", desc: "支持的事件类型", auth: false, ex: "gitlink-cli webhook +events" },
|
|
{ cmd: "webhook +create", desc: "创建 Webhook", auth: true, ex: "gitlink-cli webhook +create --url https://example.com/hook --events push" },
|
|
{ cmd: "webhook +update", desc: "更新 Webhook", auth: true, ex: "gitlink-cli webhook +update --id 123 --events push,pull_request" },
|
|
{ cmd: "webhook +test", desc: "测试 Webhook", auth: true, ex: "gitlink-cli webhook +test --id 123 --event push" },
|
|
{ cmd: "webhook +delete", desc: "删除 Webhook", auth: true, ex: "gitlink-cli webhook +delete --id 123" },
|
|
]},
|
|
{ cat: "组织管理", icon: "🏢", items: [
|
|
{ cmd: "org +list", desc: "组织列表", auth: false, ex: "gitlink-cli org +list" },
|
|
{ cmd: "org +info", desc: "组织详情", auth: false, ex: "gitlink-cli org +info --id Gitlink" },
|
|
{ cmd: "org +members", desc: "成员列表", auth: false, ex: "gitlink-cli org +members --id Gitlink" },
|
|
{ cmd: "org +create", desc: "创建组织", auth: true, ex: 'gitlink-cli org +create --name my-org --description "我的组织"' },
|
|
{ cmd: "org +batch-add", desc: "批量添加成员", auth: true, ex: 'gitlink-cli org +batch-add --id my-org --users "user1,user2"' },
|
|
]},
|
|
{ cat: "用户与搜索", icon: "👤", items: [
|
|
{ cmd: "user +me", desc: "当前登录用户", auth: true, ex: "gitlink-cli user +me" },
|
|
{ cmd: "user +info", desc: "用户详情", auth: false, ex: "gitlink-cli user +info --login zhangsan" },
|
|
{ cmd: "search +repos", desc: "搜索仓库", auth: false, ex: 'gitlink-cli search +repos --keyword "machine learning"' },
|
|
{ cmd: "search +users", desc: "搜索用户", auth: false, ex: 'gitlink-cli search +users --keyword "zhangsan"' },
|
|
]},
|
|
{ cat: "安全与合规", icon: "🛡️", items: [
|
|
{ cmd: "compliance +scan", desc: "全量扫描", auth: false, ex: "gitlink-cli compliance +scan" },
|
|
{ cmd: "compliance +license", desc: "许可证合规检查", auth: false, ex: "gitlink-cli compliance +license" },
|
|
{ cmd: "compliance +deps", desc: "依赖许可证检查", auth: false, ex: "gitlink-cli compliance +deps" },
|
|
{ cmd: "compliance +secrets", desc: "敏感信息扫描", auth: false, ex: "gitlink-cli compliance +secrets" },
|
|
{ cmd: "compliance +exposure", desc: "PII 与暴露面扫描", auth: false, ex: "gitlink-cli compliance +exposure" },
|
|
{ cmd: "compliance +vocab", desc: "敏感词汇扫描", auth: false, ex: "gitlink-cli compliance +vocab" },
|
|
]},
|
|
{ cat: "新人引导", icon: "👋", items: [
|
|
{ cmd: "onboard +welcome", desc: "添加引导评论", auth: true, ex: 'gitlink-cli onboard +welcome --issues "3,7,15"' },
|
|
]},
|
|
{ cat: "团队管理", icon: "👥", items: [
|
|
{ cmd: "team +list", desc: "团队列表", auth: false, ex: "gitlink-cli team +list --org my-org" },
|
|
{ cmd: "team +create", desc: "创建团队", auth: true, ex: "gitlink-cli team +create --org my-org --name dev-team" },
|
|
{ cmd: "team +add-member", desc: "添加成员", auth: true, ex: "gitlink-cli team +add-member --org my-org --team dev-team --user newmember" },
|
|
]},
|
|
{ cat: "贡献报告", icon: "📊", items: [
|
|
{ cmd: "contrib +report", desc: "贡献统计报告", auth: false, ex: "gitlink-cli contrib +report --owner myuser --repo myrepo" },
|
|
]},
|
|
];
|
|
|
|
const esc = s => s.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">");
|
|
const grid = document.getElementById("grid");
|
|
const empty = document.getElementById("empty");
|
|
|
|
// 全量统计（不随搜索变化）
|
|
const TOTAL = DATA.reduce((n, c) => n + c.items.length, 0);
|
|
const AUTHN = DATA.reduce((n, c) => n + c.items.filter(i => i.auth).length, 0);
|
|
const PUBLIC = TOTAL - AUTHN;
|
|
document.getElementById("st-cat").textContent = DATA.length;
|
|
document.getElementById("st-total").textContent = TOTAL;
|
|
document.getElementById("st-auth").textContent = AUTHN;
|
|
document.getElementById("st-public").textContent = PUBLIC;
|
|
document.getElementById("ft-total").textContent = TOTAL;
|
|
|
|
function render(filter = "") {
|
|
const q = filter.trim().toLowerCase();
|
|
grid.innerHTML = "";
|
|
let shownCats = 0;
|
|
|
|
DATA.forEach(c => {
|
|
const matched = c.items.filter(it =>
|
|
!q || it.cmd.toLowerCase().includes(q) || it.desc.toLowerCase().includes(q) || c.cat.toLowerCase().includes(q)
|
|
);
|
|
if (!matched.length) return;
|
|
shownCats++;
|
|
|
|
const card = document.createElement("div");
|
|
card.className = "card" + (q ? " open" : ""); // 搜索时自动展开
|
|
card.innerHTML = `
|
|
<div class="card-head">
|
|
<span class="card-icon">${c.icon}</span>
|
|
<span class="card-title">${c.cat}</span>
|
|
<span class="count-badge">${matched.length}</span>
|
|
<svg class="chev" width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 0 1-1.06-1.06L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06Z"/></svg>
|
|
</div>
|
|
<div class="card-body">
|
|
${matched.map(it => `
|
|
<div class="row">
|
|
<div class="row-main">
|
|
<span class="cmd">${esc(it.cmd)}</span>
|
|
<span class="tag ${it.auth ? "auth" : "public"}">${it.auth ? "需认证" : "公开"}</span>
|
|
<span class="desc">${esc(it.desc)}</span>
|
|
</div>
|
|
<div class="example"><code>$ ${esc(it.ex)}</code></div>
|
|
</div>`).join("")}
|
|
</div>`;
|
|
grid.appendChild(card);
|
|
});
|
|
|
|
empty.style.display = shownCats === 0 ? "block" : "none";
|
|
|
|
// 绑定交互
|
|
grid.querySelectorAll(".card-head").forEach(h =>
|
|
h.addEventListener("click", () => h.parentElement.classList.toggle("open")));
|
|
grid.querySelectorAll(".row").forEach(r =>
|
|
r.addEventListener("click", e => { e.stopPropagation(); r.classList.toggle("expanded"); }));
|
|
}
|
|
|
|
// 搜索（带去抖）
|
|
const input = document.getElementById("search");
|
|
let t;
|
|
input.addEventListener("input", e => { clearTimeout(t); t = setTimeout(() => render(e.target.value), 80); });
|
|
|
|
// 快捷键
|
|
document.addEventListener("keydown", e => {
|
|
if (e.key === "/" && document.activeElement !== input) { e.preventDefault(); input.focus(); }
|
|
if (e.key === "Escape") { input.value = ""; render(""); input.blur(); }
|
|
});
|
|
|
|
render();
|
|
</script>
|
|
</body>
|
|
</html>
|