Add screenshots to README

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-17 22:11:19 -07:00
co-authored by Claude Opus 5
parent d1cb472696
commit c57760ab34
6 changed files with 10 additions and 0 deletions
+10
View File
@@ -6,6 +6,8 @@ through **Queue → In progress → Done**, then download the day's data as a CS
No database, no build step, no npm dependencies. Just Node. No database, no build step, no npm dependencies. Just Node.
![The volunteer dashboard](docs/screenshots/dashboard-drag.png)
## Running it ## Running it
```sh ```sh
@@ -31,16 +33,24 @@ this machine only.
1. On the main page press **Create repair cafe kanban** and name the event. 1. On the main page press **Create repair cafe kanban** and name the event.
Tick *randomise the address* if you want a hard-to-guess URL. Tick *randomise the address* if you want a hard-to-guess URL.
<img src="docs/screenshots/create.png" alt="Create form" width="450">
2. You land on the **sign-in form** at `/<event-name>`. Leave this open on a 2. You land on the **sign-in form** at `/<event-name>`. Leave this open on a
tablet or laptop by the door — it clears itself after every submission. tablet or laptop by the door — it clears itself after every submission.
<img src="docs/screenshots/sign-in.png" alt="Sign-in form" width="450">
3. Open the **dashboard** at `/<event-name>/dashboard` on the volunteers' laptop. 3. Open the **dashboard** at `/<event-name>/dashboard` on the volunteers' laptop.
There is a link to it at the bottom of the sign-in form. There is a link to it at the bottom of the sign-in form.
4. Drag cards between columns. Moving a card into *In progress* asks who is 4. Drag cards between columns. Moving a card into *In progress* asks who is
repairing it; moving it into *Done* asks how it went. A card that reaches repairing it; moving it into *Done* asks how it went. A card that reaches
*Done* without a result is outlined in red until someone fills it in. *Done* without a result is outlined in red until someone fills it in.
<img src="docs/screenshots/done-missing-result.png" alt="Done card missing a result" width="400">
5. Click any card's title to see and edit the full record, and to add notes. 5. Click any card's title to see and edit the full record, and to add notes.
6. Press **Download CSV** at the end of the day. 6. Press **Download CSV** at the end of the day.
![The exported CSV](docs/screenshots/csv.png)
On a touch screen, drag a card by its **⠿** grip in the top right corner — that On a touch screen, drag a card by its **⠿** grip in the top right corner — that
leaves the rest of the card free for scrolling. You can also change a card's leaves the rest of the card free for scrolling. You can also change a card's
status from the detail overlay without dragging at all. status from the detail overlay without dragging at all.
Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 101 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB