feat(unfold): show Unfold's brand and a Work Item's stages and delivery #224

Merged

ryangr0 merged 1 commit from ryangr0/unfold-work-item-sheet into development 2026-10-04 16:04:26 +00:00 AGit

Conversation 0 Commits 1 Files changed 121 +743 -1919

ryangr0 commented 2026-10-04 12:07:30 +00:00

Owner

Copy link

Stacked on #223 (the Vloer → Unfold rename). Merge #223 first; until then this PR also shows its commit.

The application still drew its former identity, and its sidebar was grouped by part. It now carries Unfold's brand and is organised around work (ADR 0038; design review answers of 2026-10-04).

What changes

Brand

• The root generator writes the mark the application draws (public/core/brand.js, public/favicon.svg) and fails when the boot mark in index.html drifts.
• npm run icons:build rasterises the favicons, app icons, link preview and editor icon from docs/brand.
• The attention favicon draws the same paths.
• The application's separate brand kit (V mark, old wordmark, banners, brandbook) is removed. Records link to it by permalink.

Tokens

• Neutrals are Unfold's own.
• Primary actions, checkboxes and switches are ink, inverted on dark grounds (--accent-on-solid).
• Baken is used for links, focus, the current-stage crease and graphics. Links are #C0303F on light grounds: 5.2:1 on Vel and 4.8:1 on a selected row. On dark grounds they are a light Baken tint, at least 5.2:1.
• Selection is neutral, so red never marks an ordinary action. Danger keeps its own red, with an icon and words.

Navigation

• The sidebar holds Now; then Work, Proposed and Tasks; then Runs, Activity, Insights and Sessions; then Settings. No group is named after a part.
• Binder, Packs and Season live under Your cards in the account menu.

Work Item page

• Define, Execute, Review and Deliver appear under the header as one ordered list (core/stages.js). The current or stopped stage carries aria-current="step", and a stopped stage says why.
• A delivery track built from the Run card (core/delivery-track.js) shows the pull request, checks, approval, merge and each environment reached. It never marks a stage done without a fact. Deliver says "Live in …" only for a reported deploy, otherwise "Merged · no deploy reported".
• Ploeg's records sit under Execution details, where a Shift reads as the attempt it is.

Verification

• mise run verify: all gates pass.

• New tests: test/stages.test.mjs (stage and delivery rules, failed and closed cases, older cards) and test/attention.test.mjs (the favicon canvas draws favicon.svg's paths).

• Rendered in the deterministic demo with Chromium at 1440 px and 390 px, light and dark:

  • Work Items in review, stopped at review, and merged with no deploy reported;
  • Now;
  • the account menu.

  All 35 demo Work Items produce sensible stage patterns.

Not verified

• No real user tested this.
• Not opened in the VS Code extension host.
• The icons:build PNGs were rendered with the local Chromium and checked by eye.

Risk and rollback

Visual and navigation only; no API or data change. Revert the commit.

Refs: VIK-1842, VIK-1843, VIK-1844

🤖 Generated with Claude Code

**Stacked on #223** (the Vloer → Unfold rename). Merge #223 first; until then this PR also shows its commit. The application still drew its former identity, and its sidebar was grouped by part. It now carries Unfold's brand and is organised around work ([ADR 0038](apps/unfold/docs/adrs/0038-the-application-shows-unfold-and-is-organised-around-work.md); design review answers of 2026-10-04). ## What changes **Brand** - The root generator writes the mark the application draws (`public/core/brand.js`, `public/favicon.svg`) and fails when the boot mark in `index.html` drifts. - `npm run icons:build` rasterises the favicons, app icons, link preview and editor icon from `docs/brand`. - The attention favicon draws the same paths. - The application's separate brand kit (V mark, old wordmark, banners, brandbook) is removed. Records link to it by permalink. **Tokens** - Neutrals are Unfold's own. - Primary actions, checkboxes and switches are ink, inverted on dark grounds (`--accent-on-solid`). - Baken is used for links, focus, the current-stage crease and graphics. Links are `#C0303F` on light grounds: 5.2:1 on Vel and 4.8:1 on a selected row. On dark grounds they are a light Baken tint, at least 5.2:1. - Selection is neutral, so red never marks an ordinary action. Danger keeps its own red, with an icon and words. **Navigation** - The sidebar holds Now; then Work, Proposed and Tasks; then Runs, Activity, Insights and Sessions; then Settings. No group is named after a part. - Binder, Packs and Season live under **Your cards** in the account menu. **Work Item page** - Define, Execute, Review and Deliver appear under the header as one ordered list (`core/stages.js`). The current or stopped stage carries `aria-current="step"`, and a stopped stage says why. - A delivery track built from the Run card (`core/delivery-track.js`) shows the pull request, checks, approval, merge and each environment reached. It never marks a stage done without a fact. Deliver says "Live in …" only for a reported deploy, otherwise "Merged · no deploy reported". - Ploeg's records sit under **Execution details**, where a Shift reads as the attempt it is. ## Verification - `mise run verify`: all gates pass. - New tests: `test/stages.test.mjs` (stage and delivery rules, failed and closed cases, older cards) and `test/attention.test.mjs` (the favicon canvas draws favicon.svg's paths). - Rendered in the deterministic demo with Chromium at 1440 px and 390 px, light and dark: - Work Items in review, stopped at review, and merged with no deploy reported; - Now; - the account menu. All 35 demo Work Items produce sensible stage patterns. ## Not verified - No real user tested this. - Not opened in the VS Code extension host. - The `icons:build` PNGs were rendered with the local Chromium and checked by eye. ## Risk and rollback Visual and navigation only; no API or data change. Revert the commit. Refs: VIK-1842, VIK-1843, VIK-1844 🤖 Generated with [Claude Code](https://claude.com/claude-code)

ryangr0 added 2 commits 2026-10-04 12:07:31 +00:00

refactor(unfold)!: retire the name Vloer; the application is Unfold ... fa7ebda02a

The front end was called Vloer while it and Ploeg were separate products.
Since Ploeg moved to its own repository, the unfold-v train ships only this
application, so the owner decided to call it Unfold everywhere, inside and
out (design review Q1, VIK-1831; ADR-0020).

- apps/vloer moves to apps/unfold; package @webgrip/unfold, images unfold
  and unfold-agent, chart unfold, extension webgrip.unfold, settings
  section unfold, environment variables UNFOLD_*.
- Existing installs carry over: the server adopts vloer.sqlite, the browser
  moves vloer.* local storage before first paint, the extension copies
  vloer.* settings. People sign in once more.
- Ploeg's wire names stay until Ploeg renames them: vloerUrl, the
  vloer-native skin (read as unfold-native) and PLOEG_REPORT_VLOER_URL.
- Records keep their wording: ADRs, changelogs, research and evidence and
  the planning export; only their repository paths moved. Release guards
  keep the retired de-vloer repository and vloer-v tags.
- References to the root ADR ledger now say "system ADR" so they cannot be
  confused with the application's own ledger.

BREAKING CHANGE: deployments must switch to the unfold image and chart and
rename VLOER_* environment variables to UNFOLD_* (homelab: VIK-1856). The
default OIDC groups are now unfold-admins, unfold-operators and
unfold-viewers.

Refs: VIK-1855, VIK-1831
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

feat(unfold): show Unfold's brand and a Work Item's stages and delivery ... bd777a5a1e

The application still drew its former identity and grouped its sidebar by
part. It now carries Unfold's brand and is organised around work (ADR 0038,
design review answers of 2026-10-04).

- Brand: the root generator writes the mark the application draws
  (public/core/brand.js, public/favicon.svg) and checks the boot mark;
  scripts/build-icons.mjs rasterises the favicons, app icons, link preview
  and editor icon from docs/brand. The attention favicon draws the same
  paths. The application's separate brand kit is removed.
- Tokens: Unfold's neutrals; primary actions, checkboxes and switches in
  ink (inverted on dark grounds); Baken for links, focus, the current-stage
  crease and graphics at measured contrast; neutral selection.
- Navigation: Now; Work, Proposed, Tasks; Runs, Activity, Insights,
  Sessions; Settings. No group is named after a part. Binder, Packs and
  Season move to "Your cards" in the account menu.
- Work Item page: Define, Execute, Review and Deliver as one ordered list
  under the header (core/stages.js), a delivery track from the Run card
  (core/delivery-track.js) that never claims a deploy Ploeg did not
  report, and "Execution details" for Ploeg's records.

Refs: VIK-1842, VIK-1843, VIK-1844
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

ryangr0 referenced this pull request 2026-10-04 13:26:13 +00:00

refactor(unfold): stop announcing a URL Ploeg never accepted #226

ryangr0 merged commit ea25b6fd4b into development 2026-10-04 16:04:26 +00:00

ryangr0 referenced this pull request from a commit 2026-10-04 16:04:29 +00:00

Merge pull request 'feat(unfold): show Unfold's brand and a Work Item's stages and delivery' (#224) from ryangr0/unfold-work-item-sheet into development

ryangr0 referenced this pull request 2026-10-04 16:29:32 +00:00

test(unfold): space editor polls from the last answer, not the last send #228

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

webgrip/unfold!224

No description provided.