← Commit history

1.10.2: test icons through img src not inline (an inline test cannot fail); count bright pixels

John Lauer ·d6dbf585a0 ·1mo ago ·parent 7853d28
2 files changed +21−6
package.json+1−1
@@ -1,6 +1,6 @@ {   "slug": "adom-ui-design",-  "version": "1.10.1",+  "version": "1.10.2",   "type": "skill",   "description": "The Adom UI Design System plus a bundle of focused UI skills (tooltips, floating-windows, toasts, responsive-ui, app-shell, ai-driven-apps, clickable-paths, dark-default, input-feedback, settings-layout). One install drops the whole set of skill files onto your container, plus shared icon assets (the settings cog) so every Adom app draws the same glyph.",   "dependencies": {},
skills/icons/SKILL.md+20−5
@@ -104,8 +104,23 @@ grep -nE '<rect[^>]*(width="24"|width="100%")' path/to/icon.svg    # background ls path/to/icon.png 2>/dev/null                     # a raster where an SVG belongs ``` -Then LOOK at it: render the icon at 16px on `#161b22` next to two other Adom app icons. If-yours is the one that stands out, it is wrong, however nice it is on its own. Look for the-invisible case too: an icon that inherited black on a dark strip reads as "no icon", which-is easy to miss when you are checking whether it looks RIGHT rather than whether it is-THERE.+Then LOOK at it, and **test it through the SAME LOAD PATH production uses**:++```html+<!-- CORRECT test: the icon loads as its own document, exactly like a favicon does -->+<div style="background:#161b22;padding:8px"><img src="./dock-yourapp.svg" width="16" height="16"></div>+```++**Testing it INLINE proves nothing.** Pasting the SVG markup into a host page that sets a+color means `currentColor` resolves against that host, so the icon renders happily white no+matter what the file says, and the production failure is structurally impossible to+reproduce. kicad hit exactly this on 2026-08-24: its 16px check passed while the shipped+favicon was invisible. If your test cannot fail, it is not a test.++Then judge two things, in this order:++1. **Is it THERE?** Invisibility is the failure mode and the eye skips absence. Count bright+   pixels in the icon's cell: a healthy 16px line mark lands in the high hundreds to low+   thousands; an inherited-black icon on a dark ground is near zero.+2. **Does it belong?** Render it beside two other Adom app icons. If yours is the one that+   stands out, it is wrong, however nice it is on its own.