[Bug] De hint in de afbeeldingkiezer staat op 3,31:1, en twee donkere paletten staan buiten elke contrasttoets #779

New issue

Closed

opened 2026-07-23 22:36:31 +00:00 by brenno · 1 comment

brenno commented

2026-07-23 22:36:31 +00:00

Owner

Wat er mis is

De hint in het zoekveld van de afbeeldingkiezer staat op 3,31 : 1. WCAG AA
vraagt 4,5:1 voor gewone tekst, en dit is 13px.

lib/widgets/dialogs/parts/image_carousel_picker_chrome.dart:114 —
ImagePickerPalette.textDim (#6E7681) op surface2 (#21262D).

Waarom niets dit zag

OciDeck heeft drie donkere paletten, niet één:

Palet	Waar	Getoetst
`AppTheme` + de profielen	de hele app-chrome	ja — `app_theme_contrast_test.dart`, sinds #606/#744/#750
`PresenterPalette`	presentatiemodus, overlays, ink	nee
`ImagePickerPalette`	afbeeldingkiezer (coverflow/grid)	nee

Die laatste twee komen in geen enkel testbestand voor. Ze staan bewust
buiten het app-thema — het zijn op zichzelf staande donkere oppervlakken, en om
precies die reden zondert check_conventions ze uit van de
raw-colour-ratchet. Die uitzondering is verdedigbaar; het gevolg was dat ze
tegelijk buiten élke contrastmeting vielen.

En de app bewaakt dit elders juist wél. test/input_hint_contrast_test.dart
bestaat sinds #583 en toetst precies dit — "een tip in een invoerveld moet er
als een tip uitzien" — maar leest theme.inputDecorationTheme.hintStyle, en de
kiezer heeft geen thema; hij schildert zijn hint met de hand. Dezelfde regel,
één laag ernaast, en daardoor niet gedekt.

De meting

PresenterPalette is in orde: text (#E5E5E5) haalt 9,0:1 tot 15,7:1 op alle
zeven oppervlakken. Daar is niets te repareren — maar ook niets dat het zo houdt.

ImagePickerPalette, tegen surface2 (#21262D):

Token		Ratio
`text` `#CDD9E5`	tekst	10,62 : 1	✓
`textMuted` `#8B949E`	tekst	4,95 : 1	✓ (krap)
`textDim` `#6E7681`	tekst + iconen	3,31 : 1	✗ als tekst
`accent` `#58A6FF`		6,03 : 1	✓
`warning` `#F0B429`		8,16 : 1	✓
`success` `#22C55E`		6,68 : 1	✓

Alleen textDim is een echte bevinding, en alleen waar het tekst is.
Hetzelfde token kleurt ook de sluit-, zoek- en wis-iconen; die zijn grafische
onderdelen (WCAG 1.4.11, lat 3:1) en halen met 3,31 nét de norm. De hint is het
enige gebruik waar de tekstlat geldt en niet gehaald wordt.

De vijf tokens die vs. surface2 nóg lager uitkomen — accentStrong 2,27,
dangerStrong 2,36, successStrong 3,29, danger 4,11 — heb ik nagekeken op
gebruik: successStrong en dangerStrong staan als backgroundColor: (dus
vullingen), accentStrong en danger idem in grid/verwijderpaneel. Die tegen
de bodytekst-lat leggen is een categoriefout, en precies de fout die de helft
van #606's basislijn vulde. Ze staan hier voor de volledigheid, niet als
schuld. Wat bij een vulling wél telt is het label eróp; dat is niet gemeten.

Voorstel

textDim optrekken tot ≥ 4,5:1 op surface2. #8B949E (textMuted)
haalt 4,95 — of een eigen waarde daartussen. Nagaan of textDim daarmee nog
van textMuted te onderscheiden blijft; als dat niet lukt, is de vraag of
het derde tekstniveau bestaansrecht heeft.
De twee paletten onder een contrasttoets brengen, in de vorm die
app_theme_contrast_test.dart al gebruikt: per token de rol benoemen (tekst
→ 4,5:1, grafisch → 3:1) en meten tegen het oppervlak waar het écht op ligt.
Dat is het deel dat dit terug laat komen als iemand een tint bijstelt.
De labels op de gekleurde vullingen meenemen in diezelfde toets — wit op
dangerStrong, wit op successStrong. Dat is nu nergens gemeten, en het is
dezelfde klasse als het knoplabel dat in #750 op 2,54:1 bleek te staan.

Voor de vorm van zo'n toets is appearance_contrast.dart (#750) het model: een
paar draagt zijn eigen lat mee, en het meet het opgeloste resultaat in plaats van
losse constanten.

Kosten

Een dagdeel. Geen l10n, geen afhankelijkheid, geen SBOM-gevolg. Wel een regel in
docs/ACCESSIBILITY.md: dat document somt op wat er getoetst wordt en noemt
deze twee paletten nu niet.

Zie ook het bredere punt: deze twee oppervlakken zijn ook nooit met eigen ogen
in donkere modus nagelopen.

## Wat er mis is De hint in het zoekveld van de afbeeldingkiezer staat op **3,31 : 1**. WCAG AA vraagt 4,5:1 voor gewone tekst, en dit is 13px. `lib/widgets/dialogs/parts/image_carousel_picker_chrome.dart:114` — `ImagePickerPalette.textDim` (`#6E7681`) op `surface2` (`#21262D`). ## Waarom niets dit zag OciDeck heeft **drie** donkere paletten, niet één: | Palet | Waar | Getoetst | |---|---|---| | `AppTheme` + de profielen | de hele app-chrome | ja — `app_theme_contrast_test.dart`, sinds #606/#744/#750 | | `PresenterPalette` | presentatiemodus, overlays, ink | **nee** | | `ImagePickerPalette` | afbeeldingkiezer (coverflow/grid) | **nee** | Die laatste twee komen in **geen enkel testbestand** voor. Ze staan bewust buiten het app-thema — het zijn op zichzelf staande donkere oppervlakken, en om precies die reden zondert `check_conventions` ze uit van de raw-colour-ratchet. Die uitzondering is verdedigbaar; het gevolg was dat ze tegelijk buiten élke contrastmeting vielen. En de app bewaakt dit elders juist wél. `test/input_hint_contrast_test.dart` bestaat sinds #583 en toetst precies dit — *"een tip in een invoerveld moet er als een tip uitzien"* — maar leest `theme.inputDecorationTheme.hintStyle`, en de kiezer heeft geen thema; hij schildert zijn hint met de hand. Dezelfde regel, één laag ernaast, en daardoor niet gedekt. ## De meting `PresenterPalette` is in orde: `text` (`#E5E5E5`) haalt 9,0:1 tot 15,7:1 op alle zeven oppervlakken. Daar is niets te repareren — maar ook niets dat het zo houdt. `ImagePickerPalette`, tegen `surface2` (`#21262D`): | Token | | Ratio | | |---|---|---|---| | `text` `#CDD9E5` | tekst | 10,62 : 1 | ✓ | | `textMuted` `#8B949E` | tekst | 4,95 : 1 | ✓ (krap) | | **`textDim` `#6E7681`** | **tekst + iconen** | **3,31 : 1** | **✗ als tekst** | | `accent` `#58A6FF` | | 6,03 : 1 | ✓ | | `warning` `#F0B429` | | 8,16 : 1 | ✓ | | `success` `#22C55E` | | 6,68 : 1 | ✓ | **Alleen `textDim` is een echte bevinding, en alleen waar het tekst is.** Hetzelfde token kleurt ook de sluit-, zoek- en wis-iconen; die zijn grafische onderdelen (WCAG 1.4.11, lat 3:1) en halen met 3,31 nét de norm. De hint is het enige gebruik waar de tekstlat geldt en niet gehaald wordt. De vijf tokens die vs. `surface2` nóg lager uitkomen — `accentStrong` 2,27, `dangerStrong` 2,36, `successStrong` 3,29, `danger` 4,11 — heb ik nagekeken op gebruik: `successStrong` en `dangerStrong` staan als `backgroundColor:` (dus vullingen), `accentStrong` en `danger` idem in grid/verwijderpaneel. Die tegen de bodytekst-lat leggen is een categoriefout, en precies de fout die de helft van #606's basislijn vulde. **Ze staan hier voor de volledigheid, niet als schuld.** Wat bij een vulling wél telt is het label eróp; dat is niet gemeten. ## Voorstel 1. **`textDim` optrekken tot ≥ 4,5:1 op `surface2`.** `#8B949E` (`textMuted`) haalt 4,95 — of een eigen waarde daartussen. Nagaan of `textDim` daarmee nog van `textMuted` te onderscheiden blijft; als dat niet lukt, is de vraag of het derde tekstniveau bestaansrecht heeft. 2. **De twee paletten onder een contrasttoets brengen**, in de vorm die `app_theme_contrast_test.dart` al gebruikt: per token de rol benoemen (tekst → 4,5:1, grafisch → 3:1) en meten tegen het oppervlak waar het écht op ligt. Dat is het deel dat dit terug laat komen als iemand een tint bijstelt. 3. **De labels op de gekleurde vullingen meenemen** in diezelfde toets — wit op `dangerStrong`, wit op `successStrong`. Dat is nu nergens gemeten, en het is dezelfde klasse als het knoplabel dat in #750 op 2,54:1 bleek te staan. Voor de vorm van zo'n toets is `appearance_contrast.dart` (#750) het model: een paar draagt zijn eigen lat mee, en het meet het opgeloste resultaat in plaats van losse constanten. ## Kosten Een dagdeel. Geen l10n, geen afhankelijkheid, geen SBOM-gevolg. Wel een regel in `docs/ACCESSIBILITY.md`: dat document somt op wat er getoetst wordt en noemt deze twee paletten nu niet. Zie ook het bredere punt: deze twee oppervlakken zijn ook nooit met eigen ogen in donkere modus nagelopen.

brenno added the

bug

accepted

in-progress

labels

2026-07-23 22:36:31 +00:00

brenno commented

2026-07-23 23:05:58 +00:00

Author

Owner

Opgepakt. Tak: fix/palet-contrast-779. Reikwijdte: ImagePickerPalette.textDim optrekken tot ≥4,5:1 op surface2, en een contrasttoets die beide losstaande donkere paletten dekt — per token de rol (tekst 4,5:1 / grafisch 3:1) en het oppervlak waar het écht op ligt, plus de labels op de gekleurde vullingen. Model is appearance_contrast.dart uit #750.

Opgepakt. Tak: `fix/palet-contrast-779`. Reikwijdte: `ImagePickerPalette.textDim` optrekken tot ≥4,5:1 op `surface2`, en een contrasttoets die beide losstaande donkere paletten dekt — per token de rol (tekst 4,5:1 / grafisch 3:1) en het oppervlak waar het écht op ligt, plus de labels op de gekleurde vullingen. Model is `appearance_contrast.dart` uit #750.

brenno referenced this issue from a commit

2026-07-23 23:19:39 +00:00

fix(a11y): de uitleg uit een lege lijst was de slechtst leesbare tekst (#779)

brenno referenced this issue from a pull request that will close it,

2026-07-23 23:20:12 +00:00

fix(a11y): de uitleg uit een lege lijst was de slechtst leesbare tekst (#779) #786

brenno referenced this issue from a commit

2026-07-24 16:06:03 +00:00

fix(a11y): de uitleg uit een lege lijst was de slechtst leesbare tekst (#779)

brenno closed this issue

2026-07-24 16:06:18 +00:00

brenno referenced this issue from a commit