Spaces:
Paused
Paused
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>🦞 Clawd Computer — Solana Agent Homebase</title> | |
| <style> | |
| :root { | |
| --bg: #0a0612; | |
| --panel: #150a26; | |
| --panel-2: #1d0f33; | |
| --accent: #14F195; | |
| --accent-2: #9945FF; | |
| --text: #ece6ff; | |
| --muted: #9a8cc0; | |
| --border: #2a1a47; | |
| } | |
| * { box-sizing: border-box; margin: 0; padding: 0; } | |
| body { | |
| font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace; | |
| background: radial-gradient(1200px 600px at 70% -10%, #2a1252 0%, var(--bg) 60%); | |
| color: var(--text); | |
| min-height: 100vh; | |
| display: flex; | |
| flex-direction: column; | |
| } | |
| header { | |
| padding: 22px 28px; | |
| display: flex; | |
| align-items: center; | |
| gap: 14px; | |
| border-bottom: 1px solid var(--border); | |
| background: rgba(21,10,38,0.6); | |
| backdrop-filter: blur(8px); | |
| } | |
| header .logo { font-size: 30px; } | |
| header h1 { font-size: 18px; letter-spacing: 0.5px; } | |
| header h1 span { color: var(--accent); } | |
| header .spacer { flex: 1; } | |
| header a.badge { | |
| color: var(--muted); text-decoration: none; font-size: 13px; | |
| border: 1px solid var(--border); padding: 6px 12px; border-radius: 8px; | |
| transition: 0.2s; | |
| } | |
| header a.badge:hover { color: var(--text); border-color: var(--accent); } | |
| main { | |
| flex: 1; | |
| display: grid; | |
| grid-template-columns: 300px 1fr; | |
| gap: 18px; | |
| padding: 18px 22px 22px; | |
| } | |
| @media (max-width: 820px) { main { grid-template-columns: 1fr; } } | |
| .sidebar { display: flex; flex-direction: column; gap: 14px; } | |
| .card { | |
| background: linear-gradient(160deg, var(--panel) 0%, var(--panel-2) 100%); | |
| border: 1px solid var(--border); | |
| border-radius: 14px; | |
| padding: 16px 18px; | |
| } | |
| .card h2 { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--muted); margin-bottom: 10px; } | |
| .card p { font-size: 13px; color: var(--text); line-height: 1.6; } | |
| .pill { display:inline-block; font-size:11px; color:var(--accent); background:rgba(20,241,149,0.12); | |
| border:1px solid rgba(153,69,255,0.4); padding:3px 9px; border-radius:20px; margin:3px 4px 0 0; } | |
| .terminal-wrap { | |
| border: 1px solid var(--border); | |
| border-radius: 14px; | |
| overflow: hidden; | |
| background: #11071f; | |
| display: flex; | |
| flex-direction: column; | |
| min-height: 520px; | |
| } | |
| .term-bar { | |
| display: flex; align-items: center; gap: 8px; | |
| padding: 10px 14px; background: #1a0d30; border-bottom: 1px solid var(--border); | |
| } | |
| .term-bar .dot { width: 11px; height: 11px; border-radius: 50%; } | |
| .d1 { background:#ff5f56; } .d2 { background:#ffbd2e; } .d3 { background:#27c93f; } | |
| .term-bar .title { margin-left: 8px; font-size: 12px; color: var(--muted); } | |
| iframe { border: 0; width: 100%; flex: 1; min-height: 480px; background:#11071f; } | |
| footer { padding: 14px 28px; border-top: 1px solid var(--border); color: var(--muted); font-size: 12px; text-align:center; } | |
| footer a { color: var(--accent); text-decoration: none; } | |
| </style> | |
| </head> | |
| <body> | |
| <header> | |
| <span class="logo">🦞</span> | |
| <h1>Clawd <span>Computer</span></h1> | |
| <div class="spacer"></div> | |
| <a class="badge" href="https://x402.wtf" target="_blank">x402.wtf ↗</a> | |
| <a class="badge" href="https://huggingface.co/solanaclawd" target="_blank">solanaclawd org ↗</a> | |
| <a class="badge" href="/terminal/" target="_blank">open terminal ↗</a> | |
| </header> | |
| <main> | |
| <div class="sidebar"> | |
| <div class="card"> | |
| <h2>🦞 Homebase</h2> | |
| <p>A real, browser-accessible computer for the Clawd agents — running on Hugging Face Spaces. Part of the <strong>solanaclawd</strong> org.</p> | |
| </div> | |
| <div class="card"> | |
| <h2>Toolbelt</h2> | |
| <div> | |
| <span class="pill">python3</span><span class="pill">node 20</span> | |
| <span class="pill">git</span><span class="pill">hf cli</span> | |
| <span class="pill">jq</span><span class="pill">ripgrep</span> | |
| <span class="pill">bash</span><span class="pill">curl</span> | |
| <span class="pill">solana</span> | |
| </div> | |
| </div> | |
| <div class="card"> | |
| <h2>Quick start</h2> | |
| <p>In the terminal →<br> | |
| <code>hf auth whoami</code><br> | |
| <code>hf spaces ls --author solanaclawd</code><br> | |
| <code>curl -s https://x402.wtf/api/agents/catalog | jq '.stats'</code><br> | |
| <code>python3 --version</code></p> | |
| </div> | |
| <div class="card"> | |
| <h2>Ecosystem</h2> | |
| <p> | |
| <a href="https://x402.wtf" target="_blank">x402.wtf</a> — main site · agents · gateway · skills<br> | |
| <a href="https://github.com/Solizardking/solana-clawd" target="_blank">Solizardking/solana-clawd</a> — full source (MIT)<br> | |
| <code style="background:rgba(20,241,149,0.1);padding:2px 6px;border-radius:4px;">$CLAWD: 8cHzQHUS2s2h8TzCmfqPKYiM4dSt4roa3n7MyRLApump</code> | |
| </p> | |
| </div> | |
| <div class="card"> | |
| <h2>Secrets</h2> | |
| <p>Set <code>HF_TOKEN</code> in <em>Space Settings → Secrets</em>. Injected as env var at runtime.</p> | |
| </div> | |
| </div> | |
| <div class="terminal-wrap"> | |
| <div class="term-bar"> | |
| <span class="dot d1"></span><span class="dot d2"></span><span class="dot d3"></span> | |
| <span class="title">clawd@sovereign: ~/app — x402.wtf</span> | |
| </div> | |
| <iframe src="/terminal/" title="Clawd Computer terminal"></iframe> | |
| </div> | |
| </main> | |
| <footer> | |
| 🦞 Clawd Computer · <a href="https://huggingface.co/solanaclawd">solanaclawd</a> · | |
| <a href="https://x402.wtf">x402.wtf</a> · | |
| <a href="https://github.com/Solizardking/solana-clawd">GitHub</a> · MIT | |
| </footer> | |
| </body> | |
| </html> |