fix(client): light outline on dark phantom glyphs for panel contrast

Opponent (black) phantom pieces rendered near-invisible on the dark
--panel background in the palette and Captures panel, and the black
drag-ghost was low-contrast over dark areas. Black piece glyphs in
those three spots now get a light text-shadow outline.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
claude (blind_chess)
2026-05-18 21:22:50 -04:00
parent 077330054b
commit d10e581243
3 changed files with 7 additions and 3 deletions
+2 -1
View File
@@ -75,7 +75,8 @@
} }
.pieces { flex: 1; font-size: 20px; line-height: 1; } .pieces { flex: 1; font-size: 20px; line-height: 1; }
.g-w { color: #fafafa; } .g-w { color: #fafafa; }
.g-b { color: #1a1a1a; } /* Dark pieces need a light outline to read on the dark panel background. */
.g-b { color: #1a1a1a; text-shadow: 0 0 2px var(--text), 0 0 2px var(--text); }
.n { .n {
font-family: ui-monospace, monospace; font-family: ui-monospace, monospace;
font-size: 13px; font-size: 13px;
+3 -1
View File
@@ -337,5 +337,7 @@
text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6); text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
} }
.drag-ghost.piece-w { color: #fafafa; } .drag-ghost.piece-w { color: #fafafa; }
.drag-ghost.piece-b { color: #1a1a1a; } /* A dark dragged piece needs a light outline (the base dark shadow above
does nothing for it) so it reads over dark areas of the page. */
.drag-ghost.piece-b { color: #1a1a1a; text-shadow: 0 0 3px var(--text), 0 0 2px var(--text); }
</style> </style>
@@ -46,5 +46,6 @@
} }
.pp:hover { opacity: 1; } .pp:hover { opacity: 1; }
.pp-w { color: #fafafa; } .pp-w { color: #fafafa; }
.pp-b { color: #1a1a1a; } /* Dark pieces need a light outline to read on the dark panel background. */
.pp-b { color: #1a1a1a; text-shadow: 0 0 2px var(--text), 0 0 2px var(--text); }
</style> </style>