In dark mode, the local task colors for narrow viewports got broken. Git bisect places this with commit e9065446e20, for #3590364: Part 2 of Consolidate, refactor, remove and untangle Claro's CSS from Default Admin theme.
Screenshots of the local tasks at /admin/appearance/settings/default_admin in dark mode with a narrow viewport, for commits f6c6aec7302 and c6b13555a6a, respectively:
Accessibility Insights says that these fail WCAG SC 1.4.3 Contrast (Minimum) (Level AA).
/admin/appearance/settings/default_admin.
Show commandsStart within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
changes
Comments
Comment #2
kentr commentedComment #5
debdeep.mukhopadhyay commentedHi @kentr,
I was able to reproduce this issue locally and found that the background-color on .tabs__trigger and .tabs__link was causing the problem in dark mode. The attached PR makes those elements transparent in gin--dark-mode, which appears to restore the expected behavior.
I also noticed a separate WCAG 1.4.3 contrast warning for the "Expand sidebar" label while testing with Accessibility Insights. If needed, I'd be happy to look into that in a follow-up.
For transparency, I used AI assistance while investigating the issue and drafting this comment, but the testing, verification and solution were done manually on my local setup.
Comment #6
kentr commented@debdeep.mukhopadhyay,
Thanks. I saw this also. For the most part, the accessibility team has been waiting on the CSS to stabilize before filing new issues. See #3582351-8: [Meta] Clean up CSS.
Some issues have spontaneously resolved with all of the refactoring, such as #3576874: Toggle switches are visually broken within dialog modals.
I created this issue because it was clearly a regression from #3590364: Part 2 of Consolidate, refactor, remove and untangle Claro's CSS from Default Admin theme, and I thought the maintainers would want to know about it ASAP.
Comment #7
kentr commentedI reported the issue with the Navigation top bar, which includes the Expand sidebar button, here: #3592061: List of visual differences between Gin & Admin theme
Comment #8
mherchelThis one got fixed in #3599680: Consolidate, merge, and refactor Gin's CSS variable's into Admin theme's original variables.. We don't normally fix unrelated issues, but since we're in a hurry to meet the 11.4.0 deadline, and was refactoring that anyway, I fixed it.