From 6fc7bf63bce15ab70322e61601dbbda9babd9504 Mon Sep 17 00:00:00 2001
From: Ben <btmatar@gmail.com>
Date: Sun, 19 Apr 2026 16:23:19 -0400
Subject: [PATCH] fix(a11y): topbar logo and dark-mode toggle visible in HCM

In Windows High Contrast Mode the standalone topbar Swagger logo and
the dark-mode toggle's lightbulb icon both become invisible or near-
invisible against the HCM-substituted Canvas. The logo's wordmark
paths use literal fill #fff which preserves under Chromium's default
forced-color-adjust: preserve-parent-color for SVG and disappears in
HCM light. The dark-mode toggle's SVG fill #e4e6e6 likewise preserves
and renders at low contrast in any HCM theme; the parent .dark-mode-
toggle also has opacity: 0.8, which composites multiplicatively and
dims the icon further.

A new @media (forced-colors: active) block in _topbar.scss pins the
logo wordmark paths to CanvasText and the dark-mode toggle SVG to
ButtonText with forced-color-adjust: none, and resets the parent
opacity to 1 so the system-color contrast guarantee isn't dimmed.
ButtonText/CanvasText are the system colors paired with ButtonFace/
Canvas and guarantee contrast in any user HCM theme.

Refs #7350
---
 src/style/_topbar.scss | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/style/_topbar.scss b/src/style/_topbar.scss
index 07059b82456..ea974e164a4 100644
--- a/src/style/_topbar.scss
+++ b/src/style/_topbar.scss
@@ -123,4 +123,21 @@
       opacity: 1;
     }
   }
+
+  // Render topbar icons in HCM system colors regardless of author fill cascade.
+  @media (forced-colors: active) {
+    a svg [class$="cls-2"] {
+      forced-color-adjust: none;
+      fill: CanvasText;
+    }
+
+    .dark-mode-toggle {
+      opacity: 1;
+
+      button svg {
+        forced-color-adjust: none;
+        fill: ButtonText;
+      }
+    }
+  }
 }