bots: new icon that reads on dark cards - #114
Open
prakashchokalingam wants to merge 1 commit into
Open
Conversation
The icon hardcoded stroke="#000", so on the marketplace browse list — which renders URL icons in a plain <img>, where the SVG is its own document — it was painted literally black and was near-invisible on dark cards. currentColor is a no-op inside an <img>, so the SVG now carries its own prefers-color-scheme rules with a mid-tone presentation attribute as the no-CSS fallback. Verified in headless Chrome by sampling rendered pixels: #52525b under light emulation, #d4d4d8 under dark. Path data is byte-identical, so the glyph is unchanged. Renamed to match the content-hash filename convention. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Replaces the
botsentry icon with one that stays legible on dark cards.What's broken
The current icon (
icons/bots-48f12e36.svg) hardcodesstroke="#000"on everypath. The marketplace browse list renders URL-based icons in a plain
<img>,where the SVG is an independent document with no access to the host page's CSS,
so the black stroke is painted literally and the icon all but disappears on a
dark card.
Worth noting for anyone hitting this next:
currentColordoes not fix it.Inside an
<img>there is no page colour to inherit, so it falls back to black.The SVG has to carry its own theme response.
The fix
icons/bots-1e02e6a9.svgcarriesprefers-color-schemerules, with a mid-tonepresentation attribute as the no-CSS fallback:
#8a8f98— fallback: 4.70:1 on dark, 3.03:1 on light (clears 3:1 either way)#52525b—prefers-color-scheme: light: 7.21:1#d4d4d8—prefers-color-scheme: dark: 10.34:1Verified in headless Chrome by sampling rendered pixels of the
<img>-embeddedSVG under both emulated schemes —
#52525band#d4d4d8respectively, so themedia query does fire through that path. BB drives this from its own theme
picker (it sets Electron's
nativeTheme.themeSource), so the icon follows BBrather than the OS setting.
The glyph is unchanged — path data is byte-identical to the original. The file
is renamed only to match this repo's content-hash filename convention (first 8
chars of the file's SHA-256).
Entry changes
icon.url:./icons/bots-48f12e36.svg→./icons/bots-1e02e6a9.svgicons/bots-1e02e6a9.svg, removedicons/bots-48f12e36.svgentries/bots.jsonis touchedChecked locally with
npm ci && npm run build(built dist/marketplace.json with 82 entries).npm run check— what CI runs — passes here on this PR; mylocal run of it only timed out reaching git remotes for two unrelated entries
(
notify,ui-tweaks), which is a sandbox network limit on my side, notsomething this change affects.
One thing you may want to know, since it is not specific to this plugin
I scanned all 50 SVG icons in
icons/:currentColor, which is a no-op under the<img>path andresolves to black
prefers-color-scheme— this PR would be the firstSo most icons in the marketplace are currently hard to see on dark cards, not
just this one. The narrower fix might belong in BB rather than here: the
marketplace-card
<img>branch could paint icons through the samecurrentColormask the installed-plugin icon path already uses, and all 36currentColoricons would come right with no author action at all.Happy to leave this PR as the local fix regardless — just flagging it so the
option is on the table before other authors are asked to re-cut artwork.