pop
/
vibed
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
main
quotesdb
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'main'
${ noResults }
vibed/bit-by-bit
History
Elijah Voigt 9ce16b70ed feat(bit-by-bit): backfill missed days, add changelog tab & feedback link 
- Turn the Today card into a day navigator (‹/› arrows + "back to today")
  so users can step back and check off a day they forgot. Editable range is
  the active image's start through today; reveal recomputes from the whole
  log, so backfilling a missed day re-bridges that habit's streak and paints
  the pixels it earns.
- Add a Changelog tab to Settings (after About): dated release notes distilled
  from the project's beans, one concise sentence each, newest first.
- Add a "Feedback? Email pop@elijah.run" line to the About tab.

Updated DESIGN.md and ARCHITECTURE.md to match. Validated with Playwright
(backfill streak-bridging 4→10px, nav bounds, changelog render) — no console
errors, no non-file:// requests.
 		4 days ago
..
.claude chore(bit-by-bit): enable frontend-design plugin 6 days ago
docs feat(bit-by-bit): backfill missed days, add changelog tab & feedback link 4 days ago
CLAUDE.md feat(bit-by-bit): pixel-art habit tracker with live favicon [vibed-nz22] 1 week ago
README.md feat(bit-by-bit): score streaks per-habit instead of day-level 4 days ago
index.html feat(bit-by-bit): backfill missed days, add changelog tab & feedback link 4 days ago

README.md
Unescape Escape

Paint by Habits 🎨

A whimsical habit tracker where consistency paints a picture. You define your daily habits and pick a pixel-art image; every habit you check off reveals a few pixels. Over days and weeks the artwork emerges — finish it, celebrate, pick the next one.

What it is

  • One self-contained file: index.html. Vanilla JS + CSS, no build step, no frameworks, zero network requests. Works from file:// or any static host.
  • Local-only: all data lives in your browser's localStorage. No server, no accounts, no tracking.
  • Portable: export your full state as a JSON backup and import it on another device.

How it works

Each artwork is a pixel grid. On start, a seeded PRNG (mulberry32 + Fisher–Yates) fixes a random reveal order that stays stable across sessions. Every habit keeps its own streak — checking a habit reveals pixels equal to its own current streak length: 1 pixel the first day, 2 the next consecutive day, 3 the day after, and so on. There's no bonus for doing several habits in one day; each habit scores purely on its own history. Bigger images just take longer to fill in. Pixels never un-reveal across days; missing a day resets that habit's streak, but never erases pixels already earned. Includes 8 built-in pixel artworks, or upload any image to pixelate it into a 16–48 cell grid.

Dark/light theme follows your OS by default, with a manual override. Each habit shows its own streak inline on its row; days where you did everything get a ✨ perfect-day sparkle.

Run it

Open index.html in a browser. That's it. To host it, copy the file to any static host.

Test it

There is no test harness checked in (single-file app). Validation performed: node --check on the extracted script, a grep proving zero external references, and scripted jsdom flow tests covering onboarding, check/uncheck persistence, day rollover, uncheck floor clamping, corrupt-state recovery, storage-unavailable mode, import validation, and the completion/celebration flow. See docs/DESIGN.md §9 for the edge-case checklist.

License

Dual-licensed under Apache-2.0 and MIT, following Rust ecosystem convention for this repository.

Disclaimer

This software was written with Claude Code. Design by Claude Fable 5 (claude-fable-5), implementation by Claude Sonnet 5 (claude-sonnet-5), review and verification by Claude Opus 4.8 (claude-opus-4-8).