MokoConsulting/MokoCassiopeia
1
1
Fork 0
Code Issues 2 Pull Requests Actions Packages Releases 1 Activity

Fix a11y toolbar: use theme-aware colors for dark mode
Some checks failed
Repo Health / Access control (push) Successful in 1s
Details
Repo Health / Release configuration (push) Failing after 4s
Details
Repo Health / Scripts governance (push) Successful in 3s
Details
Repo Health / Repository health (push) Failing after 3s
Details

Browse Source 
Panel, buttons, and labels now use --body-bg, --secondary-bg, and
--body-font-color with proper dark theme fallbacks instead of
hardcoded light-theme values (#fff, #444).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jonathan Miller
2026-04-18 12:22:12 -05:00
parent 7dd975808b
commit 326d1c6a6f
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/media/css/template.css
View File

@@ -17494,12 +17494,13 @@ body[data-theme-fab-enabled="1"] #mokoA11yToolbar {
/* Panel */ /* Panel */
.a11y-panel { .a11y-panel {
background: var(--bs-body-bg, #fff); background: var(--body-bg, var(--bs-body-bg, #fff));
border: 1px solid var(--border-color, #dee2e6); border: 1px solid var(--border-color, #dee2e6);
border-radius: var(--border-radius, .375rem); border-radius: var(--border-radius, .375rem);
padding: .75rem; padding: .75rem;
min-width: 200px; min-width: 200px;
box-shadow: var(--box-shadow-lg, 0 1rem 3rem rgba(0,0,0,.175)); box-shadow: var(--box-shadow-lg, 0 1rem 3rem rgba(0,0,0,.175));
color: var(--body-font-color, var(--body-color, #e6ebf1));
} }
.a11y-group { .a11y-group {
@@ -17535,8 +17536,8 @@ body[data-theme-fab-enabled="1"] #mokoA11yToolbar {
height: 34px; height: 34px;
border: 1px solid var(--border-color, #dee2e6); border: 1px solid var(--border-color, #dee2e6);
border-radius: var(--border-radius, .375rem); border-radius: var(--border-radius, .375rem);
background: var(--bs-body-bg, #fff); background: var(--secondary-bg, var(--bs-body-bg, #fff));
color: var(--body-font-color, #444); color: var(--body-font-color, var(--body-color, #e6ebf1));
font-size: .875rem; font-size: .875rem;
cursor: pointer; cursor: pointer;
transition: background .15s, border-color .15s; transition: background .15s, border-color .15s;
@@ -17554,7 +17555,7 @@ body[data-theme-fab-enabled="1"] #mokoA11yToolbar {
font-weight: 600; font-weight: 600;
min-width: 3ch; min-width: 3ch;
text-align: center; text-align: center;
color: var(--body-font-color, #444); color: var(--body-font-color, var(--body-color, #e6ebf1));
} }
.a11y-btn-wide { .a11y-btn-wide {