https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=38550
--- Comment #52 from Martin Renvoize (ashimema) <[email protected]> --- Created attachment 200774 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=200774&action=edit Bug 38550: Fix dark-mode colour contrast (black-on-dark, light islands) Several staff-interface components bypassed the --koha-* runtime theme tokens and hardcoded colour literals, so they did not flip when data-bs-theme="dark" is set. This produced black text on dark surfaces, bright "light island" backgrounds, and dark green/red text that fell below WCAG AA on dark surfaces. Because elements with no explicit colour inherit Bootstrap's --bs-body-color (which auto-flips to light in dark mode), a hardcoded light background with no explicit dark text rendered as light-on-light, and hardcoded dark colours rendered as dark-on-dark. This patch migrates the offending literals to var(--koha-*) tokens. Each token's light value equals the previous literal, so light mode is unchanged; only the dark value is tuned for AA contrast. - _root.scss: add --koha-link, --koha-link-hover, --koha-text-success and --koha-text-danger tokens (light greens/reds lifted to #6FBF73 / #FF6B66 on dark, ~7.3:1 / ~5.9:1), plus dark overrides for Bootstrap --bs-pagination-* and a dark re-skin of .btn-default. - staff-global.scss: migrate black text on flipping surfaces (.label, modal/dropdown/panel headers, table-footer totals, labeledMARC, autocomplete, tooltips, i18n menu, superlibrarian hint, subtle badges), light-island backgrounds (buttons-list, results wrappers, fieldset standard/contrast, panels, toptabs, MARC preview, footer, permission tree) and green/red text literals to tokens. - _tables.scss, _header.scss: green text and a white hover background to tokens. - vue.css, SIP2/Main.vue, ILL/Main.vue: tokenise v-select control background/border and theme the vue-select dropdown (--vs-*). Semantic highlights that carry their own fixed light background plus dark text (.term, gold approve buttons, .ac-library chips, .alert-warning strong) are intentionally left unchanged, as they read correctly in both themes. To test: 1. Enable dark mode in the staff interface (data-bs-theme="dark"). 2. Confirm AA contrast on: admin/preferences.pl (syspref labels and sidebar links), circ/circulation-home.pl (module buttons), members/member.pl search (.btn-default, DataTables info), catalogue/search.pl (pagination), erm/home (widgets) and erm/agreements/add (v-select). 3. Toggle back to light mode and confirm no visual change. -- You are receiving this mail because: You are watching all bug changes. _______________________________________________ Koha-bugs mailing list [email protected] https://lists.koha-community.org/cgi-bin/mailman/listinfo/koha-bugs website : http://www.koha-community.org/ git : http://git.koha-community.org/ bugs : http://bugs.koha-community.org/
