From 3b491e1537cebfa96b804cb55e2db621c64a4f14 Mon Sep 17 00:00:00 2001
From: agessaman <adam@gessaman.com>
Date: Sat, 24 Oct 2026 13:28:34 -0700
Subject: [PATCH] fix(web_viewer): tag chips and Multibyte's filter buttons
 pass contrast

Tag chips draw their readout color on a 14% tint of itself, and on that tint several fell short of 4.5:1: orange 4.2:1 on the dashboard in light, blue 4.47:1 on dark cards and 3.76:1 across Greeter's dark table (207 chips). The readout colors move a step darker in light and lighter in dark so each holds 4.5:1 on its own tint over paper, paper-sunk, night-raised and night-sunk; violet in light already did.

Multibyte's "MB Relay" and "Direct MB" filters used Bootstrap's outline info and success, whose text is the fill tone (1.95:1 and 3.03:1). They now resolve through --text-info and --text-success like the other outline buttons.

axe-core finds no contrast failures on any page in either theme.
---
 modules/web_viewer/templates/base.html | 32 +++++++++++++++++++-------
 1 file changed, 24 insertions(+), 8 deletions(-)

diff --git a/modules/web_viewer/templates/base.html b/modules/web_viewer/templates/base.html
index eb96bdf..6197a58 100644
--- a/modules/web_viewer/templates/base.html
+++ b/modules/web_viewer/templates/base.html
@@ -101,19 +101,21 @@
 
         /* Readout colors for stat tiles: each tile reads in its own hue so a
            row of counts can be told apart at a glance. Text-safe on both
-           themes; a tile showing a problem uses --text-danger instead. */
+           themes; a tile showing a problem uses --text-danger instead.
+           Tag chips set these on a 14% tint of themselves, so each holds 4.5:1
+           on its own tint over paper, paper-sunk, night-raised and night-sunk. */
         :root {
-            --readout-blue: #0a58ca;
-            --readout-teal: #0f7a5f;
+            --readout-blue: #0a53be;
+            --readout-teal: #0a6650;
             --readout-violet: #6d28d9;
-            --readout-orange: #b4501a;
+            --readout-orange: #9a4316;
         }
 
         [data-theme="dark"] {
-            --readout-blue: #6ea8fe;
-            --readout-teal: #4fd1ae;
-            --readout-violet: #c4b5fd;
-            --readout-orange: #f4a26b;
+            --readout-blue: #9ec5fe;
+            --readout-teal: #6fdcbf;
+            --readout-violet: #d0c4fe;
+            --readout-orange: #f6b384;
         }
 
         .readout-blue { color: var(--readout-blue); }
@@ -409,6 +411,20 @@
         [data-theme="dark"] .btn-outline-primary.active {
             color: #fff;
         }
+        .btn-outline-info {
+            color: var(--text-info);
+        }
+        .btn-outline-info:hover,
+        .btn-outline-info.active {
+            color: #212529;
+        }
+        .btn-outline-success {
+            color: var(--text-success);
+        }
+        .btn-outline-success:hover,
+        .btn-outline-success.active {
+            color: #fff;
+        }
         .btn-outline-warning {
             color: var(--text-warning);
         }