fix: hold WCAG AA for small text on mobile veil panels - #44
Merged
Conversation
At the current --panel-veil (88% light / 86% dark) the ink overrides already clear AA, but the light theme's global --success (#287c59) and --accent (#a15f40) do not: over the darkest backdrop the veil can composite (#e4e4df, the tint over the palette's #526b75 stop) they land at 4.01:1 and 3.91:1, below the 4.5:1 floor for the 9px .proof-row small and the 11px .card-star / .card-tag / .eyebrow. Add panel-local light-theme overrides alongside the existing ink ones, darkened ~11% so the hue is preserved. The dark theme needs no equivalent -- its worst backdrop is #29251c and every token already sits above 5.6:1 -- so the 2.5:1 / 2.7:1 figures recorded when the veil was 55/50% no longer reproduce and nothing changes there. The new test computes contrast from the palette and veil alpha read out of the sources rather than pinning hexes, so it stays meaningful if either moves. Closes #43 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01VFW1GLbvUL44xLpA7ADeEa
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
1 participant
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.
Closes #43.
Что проверялось
Патч из сессии
-14использован как описание намерения, а не как diff — как и просил issue. Пересчитал контраст под текущими--panel-veil(88% light / 86% dark), а не под теми 55/50%, при которых патч писался.Фон считался как композит tint-а вейла над всеми 256 тонами палитры эффекта (не над плоской панелью): библиотека интерполирует пять стопов в 256-элементный ramp, так что худший случай надо искать по интерполяции, а не только по стопам.
Результат
#e4e4df#29251c--ink--ink-soft(панельный)--ink-faint(панельный)--success--accent.proof-row smallи 11px.timeline-indexповерх живого канваса.Правка
Панельные переопределения
--success: #257151и--accent: #91553a(только светлая тема) добавлены рядом с уже существующими ink-переопределениями. Затемнение ~11% при сохранении тона — оба выходят на 4.6:1. Значения--panel-veilне тронуты.Отдельно проверено, что
.project-surface(карточки проектов с.card-star/.card-tag) — тоже.veil-panel, но канваса за ней нет, поэтому глобальные тона там остаются: переопределение на неё сознательно не распространяется.Тест
Новый тест не пинит хексы, а считает контраст, вычитывая палитру из
effect-skins.jsи альфу вейла изstyles.css— останется осмысленным, если сдвинется любое из двух. Проверено, что он краснеет при откате правки (#287c59 only reaches 4.01:1).npm test— 49/49. Визуально обе темы проверены на мобильной ширине над живым мандельбротом.🤖 Generated with Claude Code
https://claude.ai/code/session_01VFW1GLbvUL44xLpA7ADeEa