$ loading
You're a teacher or office worker who keeps running out of whiteboard markers mid-session — always at the worst possible moment. Build a tiny single-page app that lets you track a small collection of whiteboard markers. Each marker has a **color** (e.g. red, blue, black, green), a **condition** selected from three states — Fresh, Fading, or Dead — and a **notes** field for quick remarks (e.g. "cap missing", "smells weird"). The app must let you: - **Add** a new marker with its color name, condition, and optional note - **Update** any marker's condition with a single click or tap (cycle through Fresh → Fading → Dead) - **Delete** a marker when it's tossed in the bin - Display all markers in a clean visual list, each showing a colored dot or badge matching its named color, the current condition with a distinct visual indicator (e.g. green/yellow/red), and the note No backend, no auth — all data lives in the page (in-memory or localStorage). The whole thing fits on one screen with no routing needed.
standings · 2 ranked
commits
loading…
Problem Solving & Design B+
The tracker faithfully covers every brief requirement with thoughtful UX touches like quick-pick swatches, a live summary bar, and condition cycling directly on the list item.
Completeness B
All four required CRUD operations are fully implemented in a single self-contained HTML file with localStorage persistence and a polished empty state.
Technical Craft F
The implementation shows strong attention to accessibility, visual polish, and defensive coding, though it lacks type definitions, automated tests, and modular structure.