Public: anyone can read this; the crew can change it.
A repository's issues list speaks the home page's language #9745
Check · Review · Land · Live done — Landed and live in production.
scout/forge:scout/9741-a-repository-s-issues-list-speaks-the-ho → main 3 commits fork 2 threads · 2 unresolved
3 files
changed +18
−0
docs/design/areas/issues-list.md +5
| @@ -12,3 +12,8 @@ every one is also a palette entry ("Issues labelled …"). | ||
| 12 | 12 | An issue's title is the writer's words, so inside `[data-tells]` (an attribute, not a class) the row's title and meta |
| 13 | 13 | wrap and break long words anywhere, in place of the one-line ellipsis. No fixed width; the page does not scroll |
| 14 | 14 | sideways. No new class. The owner's phone look of `/preview-admin/sample/issues` is attached to the pull. |
| 15 | ||
| 16 | ## Speaking the home page's language (#9741) | |
| 17 | ||
| 18 | The list is rows on the page, not a card: the list card is `.card.bare` (no box, no hairlines between rows), and | |
| 19 | space does the separating. Its title is the system's row title, the same type the home page's rows use (no size of its own, no padding literal); the one link is the title's row. Filters, labels, the word and the pillar are unchanged. No new class. |
src/web/studio/lists.ts +1
| @@ -476,6 +476,7 @@ export async function tellsList(ctx: Ctx): Promise<Response> { | ||
| 476 | 476 | : {}), |
| 477 | 477 | }), |
| 478 | 478 | ), |
| 479 | { extra: "bare" }, | |
| 479 | 480 | ); |
| 480 | 481 | const lastNumber = fetched[fetched.length - 1]?.number; |
| 481 | 482 | // Self-links follow the address that reached this page. |
test/issues-fit.test.ts +12
| @@ -76,6 +76,18 @@ describe("the issues list at 390 px", () => { | ||
| 76 | 76 | }); |
| 77 | 77 | }); |
| 78 | 78 | |
| 79 | describe("the issues list speaks the home page's language (#9741)", () => { | |
| 80 | test("the list is bare rows on the page, not a boxed card", () => { | |
| 81 | expect(page).toMatch(/class="card bare"/); | |
| 82 | expect(page.match(/<li[^>]*>\s*<a href="\/alice\/fit\/issues\/\d+" class="row"/g)?.length ?? 0).toBeGreaterThanOrEqual(12); | |
| 83 | }); | |
| 84 | ||
| 85 | test("a title is the system's row title: the list sets no type size of its own", () => { | |
| 86 | const css = (page.match(/<style[^>]*>[\s\S]*?<\/style>/g) ?? []).join("\n"); | |
| 87 | expect(css).not.toMatch(/\[data-tells\][^{]*\{[^}]*font-size/); | |
| 88 | }); | |
| 89 | }); | |
| 90 | ||
| 79 | 91 | test("the owner's phone look takes the issues list", () => { |
| 80 | 92 | expect(PREVIEW_ISSUES_PAGE).toBe("/preview-admin/sample/issues"); |
| 81 | 93 | expect(PREVIEW_OWNER_LOOKS).toContainEqual({ page: PREVIEW_ISSUES_PAGE, kind: "phone" }); |
Principles 6 and 7: bare card is right, but no test holds it. Add a test that fails if
bareis dropped.