---
id: bd97c1d0-b90e-45df-b3e9-ab1182f8382a
title: 'Meta/date/authors pass: state pills, label chips, monograms, relative dates, demote internal ids'
state: closed
labels:
- ui
assignees: []
milestone: null
created: 2026-10-27T15:27:21.526717764Z
updated: 2026-10-27T16:11:29.189573145Z
---
Issue, PR, CI and commit pages render raw data-model fields as `label: value` lines. It reads as a debug dump, not a product.

### Evidence
Issue page (`issues/<uuid>.html`), before any content:
```
state: closed
labels: area:docker
milestone: m5-docker-v1
created: 2026-09-10T03:52:27.769090401Z
updated: 2026-09-10T05:09:33.503159534Z
id: 06b5602f-4327-4377-99f6-3dca67b5bd75
```
≈180px of vertical space, six full-width lines. The UUID is internal plumbing; the timestamps are nanosecond ISO.

Same pattern:
- **PR**: `state: merged`, `branches: master ← m6/table2`, `ci: [pass]`, `created/updated: <ISO>`, `id: <uuid>`
- **CI**: `runner: local`, `verdict: [pass]`, `run: 2026-10-27T14-08-12.402568073Z`, `created: …`, and a table whose headers are the literal field names `step | exit | duration_ms`
- **Commits index**: `2026-10-27 14:08:48 +0000` per row; **issues/pulls index**: `created 2026-10-27T14:54:31.66872…` truncated mid-digit
- **Comments**: `2026-09-10T05:09:33.499801243Z   unknown`

### Scope
- **One meta component** for issue/PR/CI/commit: a compact chip row or a right-hand sidebar (desktop) / collapsible `<details>` (mobile) with: state pill (`open`/`closed`/`merged`, colored), label chips, milestone chip, author monogram + handle, "opened 3 days ago" (relative, `title`=exact UTC), "updated …".
- **State pills** using `--state-open/--state-merged/--state-closed` tokens (add in the foundations issue). CI `pass`/`fail`/`running` badges already exist — reuse that shape.
- **Author monogram**: 1–2 letters in a square, deterministic hue from the handle hash (no assets, no JS). Applies to comments and the commits table.
- **Relative dates everywhere** with the exact value in `title=` (pattern already exists: `relative_age` in `build.rs`). Never show nanoseconds; never truncate an ISO string.
- **Internal ids**: keep them, but demote to a monospace detail at the bottom of the sidebar (`#id 06b5…` with a copy affordance-free `title`), not a headline field. CI `duration_ms` → `duration` + "ms" unit or humanized (`245 ms`), and pick user-facing labels (`step`, `exit`, `duration`).
- Don't lose data: every field currently shown must remain reachable (sidebar or `<details>`).

### Acceptance
- [ ] issue/PR pages start with title + state pill + meta row; no `id:`/`created:` full-width lines
- [ ] no raw ISO/nanosecond timestamps anywhere in HTML (relative + `title` exact)
- [ ] CI table headers are `step | exit | duration`, values include units
- [ ] comments show a monogram + `handle · 3 days ago`
- [ ] mobile: meta collapses to one line + `<details>`