Skip to content

CommitAtlas v0.3.0 — the cards, redrawn

Latest

Choose a tag to compare

@Chris0Jeky Chris0Jeky released this 24 Aug 17:00
· 27 commits to main since this release
4ec77d7

The eight SVG cards are redesigned on the Fieldline chassis, and the two defects that made their colour untrustworthy are fixed. Every existing theme= URL still resolves; no route, size, or function signature moved.

Hue is no longer used as a scale

The reported symptom was that the density squares used colours that didn't clearly mean anything. Checking it found something worse.

Levels 2, 3 and 4 were drawn in accent, positive and warningthe exact three colours the contribution mix printed one panel to the right. A square's colour therefore named a category it did not mean: an orange cell read as a commit rather than a medium day.

Underneath that sat the real fault. Hue carries no order. Nothing about orange → green → yellow says "more", and in greyscale the shipped ramp actually inverted between levels 3 and 4 — so the scale failed outright for anyone reading it without colour. The same mapping was in the activity card, where nobody had noticed it.

Every theme now uses one hue at four steps, plus a neutral socket for a day with nothing observed. densityFill is the single place a level becomes a colour, and it resolves a non-finite level to the socket rather than indexing past the end of the ramp — an unreadable signal must never paint as the busiest day. Tests assert monotonic luminance, a ≥1.25× separation at every step so the scale survives greyscale, and that no step collides with the mix ink or a status colour.

The direction follows the ground: on a dark card more activity is brighter, on a light card it is darker. The socket stays neutral either way, because a pale tint of the activity colour reads as a little activity and a day with none had none.

The contribution mix moves to one ink with bar length as the only variable, which is what stops the two panels handing the reader contradictory colour vocabularies.

Cards ship as a dark/light pair

Each card carries its own opaque background, so a dark card on a light GitHub profile really is a dark slab — the Studio's LIGHT preview canvas was accurate, not misleading. But the generated Markdown pinned one theme, so whichever the user picked was wrong for every reader on the other colour scheme.

Each card now ships as a <picture> block keyed on prefers-color-scheme, so a README serves the reader's own scheme from a single snippet. The <img> fallback names the theme the user actually chose, so a renderer without <picture> support still shows their selection.

Theme Scheme Ground Partner
ember dark #121310 paper
aurora dark #09131f paper
midnight dark #05070d paper
paper light #dfe4c9 ember

paper is Limestone rather than white, so the light card still reads as a card on a white page.

The chassis vocabulary, at card scale

Corner-cut plates, section numerals, mono chrome labels, square swatches that match the density cells, and dashed empty sockets for an unconfigured probe — the same language the web surface uses, so a reader who learns it once recognises it everywhere.

The cards use a system font stack, deliberately. They render as SVG inside an <img> on GitHub, where no webfont can load and an embedded @font-face would spend the whole 30 KiB budget before any data was drawn. The design has to survive font substitution on whatever machine renders it.

Two faults found by looking, not by testing

  • The font stacks first shipped with double quotes around multi-word families. Inside a double-quoted XML attribute that closed font-family=" early and produced malformed SVG. assertWellFormedXml failed five suites at once — exactly what that assertion exists for.
  • The hazard strip was, at real size, the loudest element on the card while carrying no information. It works on a 1440px web fascia as one element among many; repeated down a README at 720px it dominated the data. It is edge texture now, at 4px and 18% rather than 6px and 42%.

Neither would have been caught by a test written in advance.

Also in this release

Keyboard QA and the 1440×900 screenshot pair are closed, both carried as NOT verified since v0.1.0. The keyboard pass could not be done by observing keypresses — the available controller does not produce native focus traversal — so the properties that make traversal correct were measured against production instead: no positive tabindex anywhere, every reachable control named, and zero non-native widgets, which is what guarantees Enter and Space work. Details in docs/PROJECT_STATE.md.

Verification

npm run check green at the released commit: 301 tests across nine suites, plus TypeScript, ESLint, four package builds, and Action bundle parity. All eight cards were rendered as <img> on both GitHub grounds — which is how they are actually consumed — in dark and light.

npm publication is still not claimed. The packages are built and pack-verified but are not on the registry.

The design contract is in docs/DESIGN_CHASSIS.md.