romfast/gomag-vending
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(design): FINDING-003 — fix dark mode zebra striping

Browse Source 
Bootstrap --bs-table-bg defaults to white, not overridden in dark mode.
Added --bs-table-bg: var(--surface) and explicit td background for odd
rows. Zebra now alternates #1E1E1E / #2A2A2A in dark mode.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-03-27 12:00:30 +00:00
parent 60704d22c0
commit 2fabce7c5b
1 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
api/app/static/css/style.css
View File

@@ -101,8 +101,9 @@
[data-theme="dark"] .navbar-brand { color: var(--text-primary); } [data-theme="dark"] .navbar-brand { color: var(--text-primary); }
[data-theme="dark"] .nav-tab { color: var(--text-muted); } [data-theme="dark"] .nav-tab { color: var(--text-muted); }
[data-theme="dark"] .nav-tab:hover { color: var(--text-primary); background: var(--surface-raised); } [data-theme="dark"] .nav-tab:hover { color: var(--text-primary); background: var(--surface-raised); }
[data-theme="dark"] .table { --bs-table-bg: var(--surface); --bs-table-color: var(--text-secondary); --bs-table-border-color: var(--border); --bs-table-striped-bg: var(--surface-raised); --bs-table-hover-bg: rgba(37,99,235,0.1); }
[data-theme="dark"] .table th { background: var(--surface-raised); color: var(--text-muted); } [data-theme="dark"] .table th { background: var(--surface-raised); color: var(--text-muted); }
[data-theme="dark"] .table td { color: var(--text-secondary); } [data-theme="dark"] .table td { color: var(--text-secondary); background-color: var(--surface); }
[data-theme="dark"] .table tbody tr:nth-child(even) td { background-color: var(--surface-raised); } [data-theme="dark"] .table tbody tr:nth-child(even) td { background-color: var(--surface-raised); }
[data-theme="dark"] .table-hover tbody tr:hover td { background-color: rgba(37,99,235,0.1) !important; } [data-theme="dark"] .table-hover tbody tr:hover td { background-color: rgba(37,99,235,0.1) !important; }
[data-theme="dark"] .card-header { background: var(--surface); border-bottom-color: var(--border); } [data-theme="dark"] .card-header { background: var(--surface); border-bottom-color: var(--border); }
@@ -848,7 +849,8 @@ tr.mapping-deleted td {
.mobile-more-dropdown .dropdown-toggle::after { display: none; } .mobile-more-dropdown .dropdown-toggle::after { display: none; }
/* ── Mobile segmented control (hidden on desktop) ── */ /* ── Mobile segmented control (hidden on desktop) ── */
.mobile-seg { display: none; } .mobile-seg { display: none; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mobile-seg .btn-group { flex-wrap: nowrap; min-width: 0; }
.seg-active { .seg-active {
background: var(--accent) !important; background: var(--accent) !important;
border-color: var(--accent) !important; border-color: var(--accent) !important;