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

The repository's audience mark draws §5's badge, and .repo-audience leaves the stylesheet, its test updated with it #5183

Merged opened this

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

Merged

The repository header's audience mark is now a §5 badge showing the audience word, and `.repo-audience` is gone from the stylesheet. The type check, `bun scripts/design-lint.ts`, and `repo-audience.test.ts`, `audience-surfaces.test.ts` and `design-lint.test.ts` all pass. I did not run the full `bun test`, and I did not look at it in a browser at 375 px.

shipped production is serving it deploy 2fa0c24

opened this

The repository header's audience mark is now a §5 badge showing the audience word, and .repo-audience is gone from the stylesheet. The type check, bun scripts/design-lint.ts, and repo-audience.test.ts, audience-surfaces.test.ts and design-lint.test.ts all pass. I did not run the full bun test, and I did not look at it in a browser at 375 px.

  • Badge (src/web/chrome.ts): The mark reads "Public", "Private" or "Split" ("Split" is public code with a private app). Anything other than public gets the attn tone. The full audience sentence stays in the title. Admins still get a link to /settings; everyone else gets a plain span. Both carry a data-audience attribute, which the tests match on.
  • CSS and docs: .repo-audience, a.repo-audience:hover and the 640 px media-query rules are removed from src/web/style/content.ts. Its line is removed from §5d of docs/DESIGN.md. No baseline count fell, so docs/design/baseline.json is unchanged.
  • Tests: repo-audience.test.ts and audience-surfaces.test.ts now assert the badge, the word, the title and the link. repo-audience.test.ts also asserts that the old class is absent.
  • 375 px: The badge is a short inline element inside the already-wrapping title row, so it can't push the title off its line.
  • Left out: The sentence is no longer visible on the page, only in the title, and phones have no hover for it. It still shows in the API and MCP output and on the settings page. The old mobile rule that printed the whole sentence is gone with the class.

Closes #4889

commented

The repository header's audience mark is now a §5 badge showing the audience word, and .repo-audience is gone from the stylesheet. The type check, bun scripts/design-lint.ts, and repo-audience.test.ts, audience-surfaces.test.ts and design-lint.test.ts all pass. I did not run the full bun test, and I did not look at it in a browser at 375 px.

  • Badge (src/web/chrome.ts): The mark reads "Public", "Private" or "Split" ("Split" is public code with a private app). Anything other than public gets the attn tone. The full audience sentence stays in the title. Admins still get a link to /settings; everyone else gets a plain span. Both carry a data-audience attribute, which the tests match on.
  • CSS and docs: .repo-audience, a.repo-audience:hover and the 640 px media-query rules are removed from src/web/style/content.ts. Its line is removed from §5d of docs/DESIGN.md. No baseline count fell, so docs/design/baseline.json is unchanged.
  • Tests: repo-audience.test.ts and audience-surfaces.test.ts now assert the badge, the word, the title and the link. repo-audience.test.ts also asserts that the old class is absent.
  • 375 px: The badge is a short inline element inside the already-wrapping title row, so it can't push the title off its line.
  • Left out: The sentence is no longer visible on the page, only in the title, and phones have no hover for it. It still shows in the API and MCP output and on the settings page. The old mobile rule that printed the whole sentence is gone with the class.
Changes requested — before the latest push

The badge is the right component and the CSS removal is clean, but the audience sentence is now unreachable on a phone and for keyboard and screen-reader users.

Fix first: keep the sentence in the markup as text, not only in title. A title has no hover on a 360px phone. It is not reliably announced either. For admins the link's accessible name is now just "Public", which does not say it opens the settings.

Concrete fix in audienceLine: render <span class="badge">Public</span> followed by the sentence as plain .row-meta-style muted text that wraps on a phone. Or put it in a visually-hidden span inside the link: Public: … — settings. Do not add a new class if an existing §5/§5d one fits. Drop the title duplicate if the sentence is visible.

Also: no test covers the attn tone for private or split. Add one that asserts data-variant="attn" on a private repo and no variant on a public one. Without it the tone branch can break unnoticed.

Scout said the 375px layout was not checked. Check it once the sentence is back on the page.

commented

The audience sentence is back on the page as visible text, and the pushed branch now covers the badge tone. The type check, design-lint and the three audience/design-lint test files pass. I did not run the full bun test, and I still have not looked at it at 375 px.

  • Visible sentence: audienceLine in src/web/chrome.ts now draws the badge, then the sentence as <span class="muted small">. Both are existing classes, so I added none. The text sits in the flex-wrap title row, so it should wrap on a phone, but that is untested. The title attribute is gone.
  • Link name: For admins the badge links to settings and carries an sr-only ": settings", so its accessible name is "Public: settings". Everyone else gets a plain span.
  • Tone test: test/repo-audience.test.ts now asserts data-variant="attn" on a private repo's badge and no variant on a public one. test/audience-surfaces.test.ts asserts attn for the split case, plus the badge word and the visible sentence.
  • Tap target: The 44 px tap target on the old phone link is gone. The badge link is now small, which I judged acceptable but did not measure.
Changes requested — before the latest push

The header now draws two badges that say the same word, and the audience link lost its phone tap target. I could not see the result in the preview: its repositories answer 404 to a guest, so I judged the markup and CSS in the source.

Fix first: stop drawing a second badge beside the existing Public/Private one. repoHeader already puts badge("Private"|"Public", variant secondary) in the same .repo-title row (src/web/chrome.ts ~l.315), so every repo now reads Public [Public] Public: anyone can read this.... Either let the audience mark replace that visibility badge, or make the audience badge carry what the visibility badge cannot say, which is Split. Do not render the same word twice.

Also fix, in this order:

  1. The sentence sits inside .repo-title, which sets 20px, weight 620 and -0.02em tracking. .muted.small only resets the size, so the sentence renders as bold, tight 13px text. Wrap it in something that resets font-weight and letter-spacing, or move it out of the title row to a .repo-desc-style line under it.
  2. The settings link is now a bare badge, about 18px tall. The old phone rule gave it a 44px target. Keep a 44px minimum for the link on a phone, or make the sentence the link text so the target is a full line.
  3. data-audience exists only so the tests can match it. Tests should match the badge and the sentence, not a hook added for them.
  4. test/repo-audience.test.ts:85 is missing a semicolon, and the regexes are brittle about whitespace. Run the formatter.
commented

I pushed a fix for all four points. The type check, design-lint and the three audience test files pass. I did not run the full bun test, and I have not looked at it in a browser at 375 px. Your preview couldn't show a guest these repositories either, so the layout is still judged from the source.

  • Double badge: repoHeader keeps its Public/Private badge. The audience line adds a badge only for Split (public code, private app), which is the case the existing badge can't say. A new test checks that the title has exactly one badge for a public and a private repo.
  • Typography: The sentence moved out of .repo-title into a .repo-desc line under it. It no longer inherits the title's weight or tracking.
  • Tap target: The sentence is the settings link for admins, so the target is a full line. A phone rule in src/web/style/content.ts gives it a 44 px minimum height, as the old rule did. The link name is now the sentence itself, so the sr-only text is gone.
  • Test hook: data-audience is removed. The tests match the sentence, the settings link and the Split badge.
  • Formatter: The repo has no formatter config, so I didn't run one. I rewrote the audience tests, which also covers the missing semicolon at test/repo-audience.test.ts:85. I left the regexes whitespace-tolerant, because the template output varies.
Approved

Approved. The title keeps its one Public/Private badge, the audience sentence moves to a .repo-desc line under it, and only Split (the case the title badge cannot say) gets an attn badge. .repo-audience is gone from the stylesheet and from DESIGN.md §5d, no new class was added, and the tests cover the link, the plain text and the single-badge rule. The preview serves / with 200, but it shows no repository header to a guest, so I judged the layout from the source and not at 360px.

Two things I would do next:

  1. Make the phone 44px rule specific. .repo-head .repo-desc a matches any link in any description, so scope it to the audience line, for example with a modifier on the audience paragraph. This is the same reason the old class existed.
  2. Loosen audienceOn in test/audience-surfaces.test.ts. It matches only "Public: anyone" or "The code is public", so a reworded sentence, or the private one, throws "no audience line". Build the expected string from audienceOf instead.
Sign in to join this conversation.

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs