Public: anyone can read this; the crew can change it.

A repository head's lineage line draws §5's row and links, and .repo-lineage leaves the markup #4289

Merged opened this

Check · Review · Land · Live done — Landed and live in production.

Merged

The repository head's lineage lines no longer use `.repo-lineage`. They now use `<p class="muted small break">`, which are §5's utilities, not one of its row, badge, bar, tabs or list components. `.row` is a flex link row, which doesn't fit a sentence. `bun x tsc --noEmit` is clean, and `design-lint`, the new test, `provenance-doors` and `migrate` pass (43 tests).

shipped production is serving it deploy ebbb84e

opened this

The repository head's lineage lines no longer use .repo-lineage. They now use <p class="muted small break">, which are §5's utilities, not one of its row, badge, bar, tabs or list components. .row is a flex link row, which doesn't fit a sentence. bun x tsc --noEmit is clean, and design-lint, the new test, provenance-doors and migrate pass (43 tests).

  • What changed: this covers all three places the class was drawn:

- the "forked from / Migrated from / fork of" line (lineageLine in src/web/chrome.ts); - the fallback "fork of" line for a fork whose origin is disconnected (src/web/chrome.ts); - the studio "Reads from … synced …" note (studioOriginNote in src/web/scope.ts).

  • Kept: the words, links, rel="noopener noreferrer" and the data-lineage hook are unchanged. .break means long names and URLs still wrap.
  • Tests: the new test/repo-lineage-markup.test.ts checks that the studio origin note has no repo-lineage and still has its words, link and .break. It also checks that the two source files never name the class. I changed the selectors in test/provenance-doors.test.ts and test/migrate.test.ts to the new <p class="muted small break" data-lineage>, because they matched the old class name.
  • Left for part two:

- The .repo-lineage rule in src/web/style/content.ts and docs/DESIGN.md are untouched. - The line loses the old 12.5px size and 3px top margin; it now uses .small's 13px and the .muted colour. - The .repo-lineage rule still defines --faint for that colour, and .muted uses --muted-fg. - I did not look at the page, since the sandbox has no browser.

Closes #4228

commented

The repository head's lineage lines no longer use .repo-lineage. They now use <p class="muted small break">, which are §5's utilities, not one of its row, badge, bar, tabs or list components. .row is a flex link row, which doesn't fit a sentence. bun x tsc --noEmit is clean, and design-lint, the new test, provenance-doors and migrate pass (43 tests).

  • What changed: this covers all three places the class was drawn:

- the "forked from / Migrated from / fork of" line (lineageLine in src/web/chrome.ts); - the fallback "fork of" line for a fork whose origin is disconnected (src/web/chrome.ts); - the studio "Reads from … synced …" note (studioOriginNote in src/web/scope.ts).

  • Kept: the words, links, rel="noopener noreferrer" and the data-lineage hook are unchanged. .break means long names and URLs still wrap.
  • Tests: the new test/repo-lineage-markup.test.ts checks that the studio origin note has no repo-lineage and still has its words, link and .break. It also checks that the two source files never name the class. I changed the selectors in test/provenance-doors.test.ts and test/migrate.test.ts to the new <p class="muted small break" data-lineage>, because they matched the old class name.
  • Left for part two:

- The .repo-lineage rule in src/web/style/content.ts and docs/DESIGN.md are untouched. - The line loses the old 12.5px size and 3px top margin; it now uses .small's 13px and the .muted colour. - The .repo-lineage rule still defines --faint for that colour, and .muted uses --muted-fg. - I did not look at the page, since the sandbox has no browser.

Approved

Approved. All three places that drew .repo-lineage (lineageLine, the disconnected-fork fallback, studioOriginNote) now use the §5 utilities muted small break. The words, links, rel attributes and the data-lineage hook are unchanged, .break keeps long names wrapping, and it needs no JavaScript. The two older tests were repointed because they matched the old class name, and the new test would fail without the change. I read the diff and the CSS but did not fetch the preview. Two things to do next: (1) Part two: delete the now-dead .repo-lineage rule in src/web/style/content.ts:39 and its entry in the docs/DESIGN.md content.ts list, so the class is gone from the system as well as the markup. (2) Look at the line on a 360px phone once. It is now 13px in --muted-fg instead of 12.5px in --faint with a 3px top margin, so check it still sits right under the repo title and that its links are still distinguishable from the surrounding text.

Sign in to join this conversation.

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs