Skip to content

Move plugin category into the detail byline and refresh overview typography - #4147

Merged
brsbl merged 4 commits into
mainfrom
bb/i-want-to-think-of-a-better-placement-communicat-thr_m9mm63fnii
Sep 23, 2026
Merged

brsbl merged 4 commits into
mainfrom
bb/i-want-to-think-of-a-better-placement-communicat-thr_m9mm63fnii

Conversation

@brsbl

@brsbl brsbl commented Sep 23, 2026

Copy link
Copy Markdown
Collaborator

Human comments

What was wrong

On plugin detail pages, the category was a tinted pill next to the title. It looked like a status badge and could not be clicked. Browse marked categories with color dots that match bb's status-dot colors. The overview had a summary as large as the title, uppercase subheads, and uneven code lines.

What changed

  • The category moves into the byline as an icon plus an underlined link to its Browse shelf.
  • Each category gets its own outline icon in its category color, replacing the dot everywhere.
  • Browse section headers and the category page title use the same icons.
  • Unknown and uncategorized categories show no icon, and the byline omits them.
  • The author avatar sits under the plugin icon, so title and byline text align.
  • ResourceDetailPage gains an optional metadataLeading slot; pages without it keep today's layout.
  • Official plugins drop the redundant "Marketplace: BB Official" row, and an empty Details section is hidden.
  • Overview text uses a 13px summary, sentence-case subheads, even code spacing, and about 65 characters per line.

Screenshots

Before: 94d77da09 (merge base) · After: 370328507 · Branch web app, light theme, 1600×1000 viewport, captured at 2×

Screen / state Viewport Before After
Plugin detail / header + overview (/plugins/connect) Desktop · 1600×1000 Before: category pill beside the title, uppercase subheads Open before After: category icon and link in the byline, hanging avatar, sentence-case subheads Open after
Browse / category section headers (/plugins) Desktop · 1600×1000 Before: category color dots in section headers Open before After: per-category icons in section headers Open after

How you verified

  • Remote CI: all required checks pass on 370328507; Node Compatibility Smoke and iOS simulator flows skipped.
  • Tests cover the byline link target, hidden unknown categories, and one unique icon per category.
  • Chrome for Testing 151: the category link opened the Cloud & Remote shelf by click and by keyboard.
  • Chrome for Testing 151: byline text measured 5.8:1 contrast in light and 6.0:1 in dark.

BB-Thread-ID: thr_m9mm63fnii

🤖 Generated with Claude Code

AGENT GENERATED

brsbl and others added 4 commits September 22, 2026 23:20
…iew typography

Replace the tinted category pill beside the plugin title with a
category-colored dot and underlined link in the byline that opens the
category shelf in Browse. Hang the author avatar under the plugin icon so
title and byline text share one column, and drop the Marketplace detail
row for BB Official plugins since the byline already names it.

Rework overview prose: 13px summary line, sentence-case subheads, code
chips without vertical padding, and a 65ch reading width.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Replace the category color dot in Browse section headers, the category
shelf title, and the detail byline with a per-category outline icon in
the category color. Solid dots in the success/attention/warning colors
read as bb's machine status dots; icons do not, and they tell categories
apart where several share a color. Unknown and uncategorized categories
show no icon, and the byline omits them.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Put each category icon on a soft tile in its category color, with the
glyph mixed toward the text color. The tile stays readable at the 12px
byline size and gives Browse section headers a clearer anchor than a
bare outline. PluginCategoryIcon now takes a named size (sm, md, lg) so
the tile and glyph scale together.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Go back to the plain outline icon mixed toward the text color. The
tinted tile read too much like the plugin icon chips beside it.

This reverts commit 5feafbf.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@brsbl
brsbl merged commit 1592e1c into main Sep 23, 2026
18 checks passed
@brsbl
brsbl deleted the bb/i-want-to-think-of-a-better-placement-communicat-thr_m9mm63fnii branch September 23, 2026 15:31
brsbl added a commit that referenced this pull request Sep 24, 2026
## What was wrong

On public marketplace plugin pages, the plugin description rendered at
17px, larger than the 15px overview text below it, so it competed with
the page's headings. The in-app plugin detail page reduced its summary
in #4147.

## What changed

- The description renders at 15px, the overview's body size, and keeps
its stronger ink color.

## Screenshots

Before: `9bfe862b35` (merge base) · After: `035c23aa90` ·
`/marketplace/auto-answer`, light theme, 1280×1000 viewport, captured at
2×

| Before | After |
| --- | --- |
| ![Before: 17px description larger than the overview
text](https://github.com/user-attachments/assets/595a4e1b-a90b-4e2c-8fac-c4c236a99776)
| ![After: description at the 15px body
size](https://github.com/user-attachments/assets/b784b379-b14c-4703-8be4-dbf092e11ab9)
|

## How you verified

- Chrome for Testing 151 (headless): captured before and after from the
branch dev server, seeded with the live marketplace catalog; description
computes to 15px.
- Safari 26.5.2 on macOS via safaridriver: description computes to 15px.

BB-Thread-ID: thr_ikybrdag9i

🤖 Generated with [Claude Code](https://claude.com/claude-code)

> AGENT GENERATED

---------

Co-authored-by: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant