opensource/CLI-Anything
3
0
Fork 0
mirror of https://github.com/HKUDS/CLI-Anything.git synced 2026-08-28 23:27:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

update frontend

Browse Source
This commit is contained in:
yuhao
2026-03-24 11:32:01 +00:00
parent 09668189cf
commit 8e78de43ca
1 changed files with 117 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/hub/index.html
+117 -25
View File
@@ -82,22 +82,112 @@
.agent-skill-btn {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1.5rem;
gap: 0.4rem;
padding: 0.45rem 1rem;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border: none;
border-radius: 8px;
border-radius: 6px;
color: white;
text-decoration: none;
font-size: 1rem;
font-size: 0.85rem;
font-weight: 600;
transition: transform 0.15s, box-shadow 0.15s;
box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
box-shadow: 0 2px 8px rgba(102, 126, 234, 0.25);
}
.agent-skill-btn:hover {
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(102, 126, 234, 0.35);
}
/* ── Empower Card ── */
.empower-card {
max-width: 600px;
margin: 1.75rem auto 1.5rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: 12px;
padding: 1.5rem 1.75rem;
position: relative;
overflow: hidden;
}
.empower-card::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 3px;
background: linear-gradient(90deg, #667eea, #764ba2, #f093fb);
}
.empower-card h3 {
font-size: 1rem;
font-weight: 700;
margin-bottom: 0.85rem;
color: var(--text);
}
.empower-card h3 span {
color: var(--accent);
}
.install-row {
display: flex;
align-items: center;
gap: 0.5rem;
background: #0d1117;
border: 1px solid var(--border);
border-radius: 6px;
padding: 0.45rem 0.75rem;
margin-bottom: 0.5rem;
transition: border-color 0.15s;
}
.install-row:hover {
border-color: #30405a;
}
.install-row .platform-label {
font-size: 0.7rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--text-muted);
background: var(--tag-bg);
padding: 0.15rem 0.45rem;
border-radius: 4px;
flex-shrink: 0;
}
.install-row code {
font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
font-size: 0.8rem;
color: var(--accent);
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.empower-prompt {
margin-top: 0.85rem;
padding: 0.65rem 0.85rem;
background: rgba(102, 126, 234, 0.06);
border: 1px dashed rgba(102, 126, 234, 0.25);
border-radius: 8px;
font-size: 0.82rem;
color: var(--text-muted);
line-height: 1.5;
}
.empower-prompt strong {
color: var(--text);
font-weight: 600;
}
.empower-prompt em {
color: var(--accent);
font-style: italic;
}
.cta {
@@ -379,27 +469,28 @@
<div class="header">
<h1><span>CLI-</span><span style="color: #86868b;">Anything</span> <span>Hub</span></h1>
<p class="tagline"><strong>Any software. Any codebase. Any Web API.</strong> Generate an agent-native CLI and let AI agents operate it &mdash; install with a single pip command.</p>
<div style="display: flex; justify-content: center; gap: 1.5rem; margin: 1.5rem auto; max-width: 820px; flex-wrap: wrap; align-items: stretch;">
<div style="flex: 1; min-width: 240px; text-align: center;">
<a class="agent-skill-btn" href="./SKILL.txt" target="_blank" style="width: 100%; justify-content: center;">
🤖 Agent Catalog (SKILL.txt)
</a>
<p style="font-size: 0.85rem; color: var(--text-muted); margin-top: 0.5rem;">Feed this to your AI agent for autonomous CLI discovery &amp; installation</p>
<div class="empower-card">
<h3>⚡ Empower your agents &mdash; <span>install in one command</span></h3>
<div class="install-row">
<span class="platform-label">OpenClaw</span>
<code>openclaw skills install cli-anything-hub</code>
<button class="copy-btn" onclick="copyCmd(this, 'openclaw skills install cli-anything-hub')">Copy</button>
</div>
<div style="flex: 1; min-width: 300px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 1rem 1.25rem; text-align: left;">
<p style="font-size: 0.9rem; font-weight: 600; margin-bottom: 0.5rem;">⚡ Install the meta-skill in one command:</p>
<div style="background: #0d1117; border: 1px solid var(--border); border-radius: 6px; padding: 0.5rem 0.75rem; margin-bottom: 0.5rem; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;">
<code style="font-family: 'SFMono-Regular', Consolas, monospace; font-size: 0.78rem; color: var(--accent);">openclaw skills install cli-anything-hub</code>
<button class="copy-btn" onclick="copyCmd(this, 'openclaw skills install cli-anything-hub')">Copy</button>
</div>
<div style="background: #0d1117; border: 1px solid var(--border); border-radius: 6px; padding: 0.5rem 0.75rem; margin-bottom: 0.6rem; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;">
<code style="font-family: 'SFMono-Regular', Consolas, monospace; font-size: 0.78rem; color: var(--accent);">nanobot skills install cli-anything-hub</code>
<button class="copy-btn" onclick="copyCmd(this, 'nanobot skills install cli-anything-hub')">Copy</button>
</div>
<p style="font-size: 0.8rem; color: var(--text-muted);">Then prompt: <span style="color: var(--text); font-style: italic;">"Find appropriate CLI software in CLI-Hub and complete the task: ..."</span></p>
<div class="install-row">
<span class="platform-label">nanobot</span>
<code>nanobot skills install cli-anything-hub</code>
<button class="copy-btn" onclick="copyCmd(this, 'nanobot skills install cli-anything-hub')">Copy</button>
</div>
<div class="empower-prompt">
<strong>Then prompt:</strong> <em>"Find appropriate CLI software in CLI-Hub and complete the task: ..."</em>
</div>
</div>
<div class="header-links">
<a class="agent-skill-btn" href="./SKILL.txt" target="_blank">
🤖 Agent Catalog (SKILL.txt)
</a>
<a class="header-btn" href="https://github.com/HKUDS/CLI-Anything" target="_blank">
<svg viewBox="0 0 98 96" width="18" height="18" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6C29.304 70.25 17.9 66.013 17.9 47.02c0-5.52 1.94-10.046 5.127-13.58-.486-1.302-2.264-6.437.486-13.34 0 0 4.206-1.302 13.59 5.216 3.963-1.14 8.17-1.628 12.34-1.628 4.17 0 8.376.568 12.34 1.628 9.384-6.518 13.59-5.216 13.59-5.216 2.75 6.903.972 12.038.486 13.34 3.268 3.534 5.127 8.06 5.127 13.58 0 19.074-11.485 23.15-22.328 24.29 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"/></svg>
Star on GitHub
@@ -413,6 +504,7 @@
PR Template
</a>
</div>
<p style="font-size: 0.78rem; color: #6e7681; font-style: italic; margin-top: 0.35rem; margin-bottom: 0.75rem;">Feed <a href="./SKILL.txt" target="_blank" style="color: #6e7681; text-decoration: underline; text-decoration-style: dotted;">SKILL.txt</a> to your AI agent for autonomous CLI discovery &amp; installation</p>
<p class="cta">We welcome contributions for <em>any</em> application &mdash; desktop apps, dev tools, cloud services, SaaS APIs, creative suites, and beyond. If it has a GUI or an API, it deserves an agent-native CLI. Open a PR and bring it to the hub!</p>
<div class="stats">
<div class="stat">