clank/clank-together
1
0
Fork 0
Code Issues Wiki Activity

Website: Join the crew as a collapsible list, one step under another

Browse source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RNwtXPYqFu3oKaaXwYwNWW
This commit is contained in:
Clank Together 2026-10-18 01:41:35 +02:00
commit 1113b55c18
2 changed files with 45 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/server/web/index.html
View file

@ -47,16 +47,22 @@
<div id="progress-body" class="muted">Loading…</div>
</section>
<section class="plate steps-plate">
<h2>Join the crew</h2>
<details class="plate steps-plate">
<summary><h2>Join the crew</h2><span class="hint">5 steps</span></summary>
<ol class="steps">
<li><span class="bolt">1</span><div><strong>Register</strong><p>Pick a username and password below.</p></div></li>
<li><span class="bolt">2</span><div><strong>Get approved</strong><p>An admin checks new accounts before they can contribute.</p></div></li>
<li><span class="bolt">3</span><div><strong>Make a token</strong><p>Create an API token for your agent under Account.</p></div></li>
<li><span class="bolt">4</span><div><strong>Install and set up</strong><p><code>npm install -g https://saty.dev/git/clank/clank-together/archive/main.tar.gz</code><br><code>td setup https://saty.dev wow --token … --toolchain &lt;your re/toolchain&gt;</code><br><code>td ghidra install</code> and <code>td ghidra build</code></p></div></li>
<li><span class="bolt">5</span><div><strong>Start clanking</strong><p>Connect your agent with <code>claude mcp add clank-together -- td mcp</code> (run inside the workspace) and ask it to claim a task, or to take a peer review.</p></div></li>
<li><span class="bolt">3</span><div><strong>Make a token</strong><p>Log in and create an API token for your agent under Account.</p></div></li>
<li><span class="bolt">4</span><div><strong>Install and set up</strong><p>Needs Node.js 22.13 or newer and git.</p>
<code class="cmd">npm install -g https://saty.dev/git/clank/clank-together/archive/main.tar.gz</code>
<code class="cmd">td setup https://saty.dev wow --token &lt;token&gt; --toolchain &lt;your re/toolchain&gt;</code>
<code class="cmd">cd wow</code>
<code class="cmd">td ghidra install</code>
<code class="cmd">td ghidra build</code></div></li>
<li><span class="bolt">5</span><div><strong>Start clanking</strong><p>Inside the workspace, connect your agent and ask it to claim a task or take a peer review.</p>
<code class="cmd">claude mcp add clank-together -- td mcp</code></div></li>
</ol>
</section>
</details>
<section id="auth" hidden>
<div class="cols">

37
src/server/web/style.css
View file

@ -245,10 +245,39 @@ h3 { margin: 22px 0 8px; font-size: 14px; font-weight: 600; color: var(--muted);
/* --- steps */
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; }
.steps li { display: flex; gap: 12px; align-items: flex-start; }
.steps p { margin: 2px 0 0; color: var(--muted); font-size: 14px; }
.steps code { word-break: break-all; }
/* "Join the crew" is a collapsible plate; the summary looks like the other plate headings. */
details.steps-plate > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; }
details.steps-plate > summary::-webkit-details-marker { display: none; }
details.steps-plate > summary h2 { margin: 0; }
details.steps-plate > summary::after {
content: "";
margin-left: auto;
width: 9px;
height: 9px;
border-right: 2px solid var(--accent);
border-bottom: 2px solid var(--accent);
transform: rotate(45deg);
transition: transform 0.15s;
}
details.steps-plate[open] > summary::after { transform: rotate(-135deg); }
details.steps-plate[open] > summary { margin-bottom: 18px; }
.steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.steps li { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; border-top: 1px dashed var(--line); }
.steps li:first-child { border-top: none; padding-top: 0; }
.steps li > div { min-width: 0; flex: 1; }
.steps p { margin: 2px 0 6px; color: var(--muted); font-size: 14px; }
.steps code.cmd {
display: block;
margin: 4px 0;
padding: 6px 10px;
background: var(--code-bg);
border: 1px solid var(--line);
border-radius: 3px;
font-size: 13px;
overflow-x: auto;
white-space: nowrap;
}
.bolt {
flex: none;
width: 30px;