Forums Bug Reports Thread

Search 'All' results: var(--color-…)15 alpha hack is invalid CSS — icon background tint silently dropped for 3 of 4 result types

Patrick Bass · Jun 6 · 9 · 1 Locked
[Minor] [Normal Priority] [Bug Fixed] [Always Reproduces]
🚀 OP Jun 6, 2026 7:51pm

Area: Integration / API (audit p13) · Surface: /search (type=all results list) · Dimension: Law 3 contrast / Law 1 polish · Severity: minor

On the unified search results page (?type=all), each result is prefixed by a small colored circle holding a type icon. The circle's background tint is produced by string-concatenating '15' onto the color value. That only yields valid CSS for the one hardcoded hex (#a78bfa, files); for threads/posts/users the value becomes `var(--color-primary)15` (and success/warning equivalents), which is not a valid color, so the tinted circle is missing and the icons float on a transparent background. The result is visually inconsistent (only file rows show the tint) and unpolished, and it diverges from the correct rgba() implementation used in the per-type list views.

Evidence

platform/templates/search/index.php:412 `$typeColors = ['threads' => 'var(--color-primary)', 'posts' => 'var(--color-success)', 'files' => '#a78bfa', 'users' => 'var(--color-warning)'];` then line 423 `<div style="…background:<?= $rColor ?>15;…">`. For threads/posts/users this emits `background:var(--color-primary)15` etc., which is invalid CSS (you cannot suffix `15` onto a `var()` token to form an 8-digit alpha), so the browser drops the declaration and the icon circle renders with no tint. Only the `files` row works, because `#a78bfa` + `15` = the valid 8-digit hex `#a78bfa15`. The dedicated per-type lists DO it correctly with real rgba: line 465 `background:rgba(44,124,255,0.1)`, line 490 `background:rgba(34,197,94,0.1)`, line 512 `background:rgba(167,139,250,0.1)` — proving the intended look is a tinted circle behind each icon.

Suggested fix. Replace the `<?= $rColor ?>15` concatenation with proper alpha. Either switch $typeColors entries to rgba() literals (matching lines 465/490/512), or use color-mix, e.g. `background:color-mix(in srgb, <?= $rColor ?> 10%, transparent)`. Also replace the hardcoded `#a78bfa` for files with a semantic token (a purple --color-* token) so the tint and the icon foreground stay theme-consistent in light + dark.

Filed by the automated tenant-app audit and adversarially evidence-verified. Status: verified. Open — not yet actioned.


Patrick Bass
@mobieus

🚀 Jun 7, 2026 5:44am

Resolved — fixed and deployed. Commit 059d6bf29b6f, shipped dev-first then to all tenants on 2026-06-06.

In templates/search/index.php: (1) replaced the invalid `background:<?= $rColor ?>15` concatenation (which produced broken CSS like `var(--color-primary)15`) with `color-mix(in srgb, <?= $rColor ?> 10%, transparent)` for proper alpha; (2) replaced hardcoded `#a78bfa` for the files type with the semantic `var(--purple-bright, #9B5FFF)` token in the $typeColors array (line 412) and in the files-results list icon color + its sibling rgba background (lines 512-513). php -l clean.

Status: fixed. Thread closed and locked.


Patrick Bass
@mobieus

Log in or register to reply to this thread.