From 5369e96ab70b88abf1492c50f191dcf9e3bb7108 Mon Sep 17 00:00:00 2001
From: adamelmore <2363879+adamdottv@users.noreply.github.com>
Date: Sun, 25 Jan 2026 19:07:19 -0600
Subject: fix(app): line selection colors

---
 packages/ui/src/components/code.tsx | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)

(limited to 'packages/ui/src/components/code.tsx')

diff --git a/packages/ui/src/components/code.tsx b/packages/ui/src/components/code.tsx
index eb0ba7826..a7687444f 100644
--- a/packages/ui/src/components/code.tsx
+++ b/packages/ui/src/components/code.tsx
@@ -91,6 +91,19 @@ export function Code<T>(props: CodeProps<T>) {
     return root
   }
 
+  const applyScheme = () => {
+    const host = container.querySelector("diffs-container")
+    if (!(host instanceof HTMLElement)) return
+
+    const scheme = document.documentElement.dataset.colorScheme
+    if (scheme === "dark" || scheme === "light") {
+      host.dataset.colorScheme = scheme
+      return
+    }
+
+    host.removeAttribute("data-color-scheme")
+  }
+
   const applyCommentedLines = (ranges: SelectedLineRange[]) => {
     const root = getRoot()
     if (!root) return
@@ -369,10 +382,24 @@ export function Code<T>(props: CodeProps<T>) {
       containerWrapper: container,
     })
 
+    applyScheme()
+
     setRendered((value) => value + 1)
     notifyRendered()
   })
 
+  createEffect(() => {
+    if (typeof document === "undefined") return
+    if (typeof MutationObserver === "undefined") return
+
+    const root = document.documentElement
+    const monitor = new MutationObserver(() => applyScheme())
+    monitor.observe(root, { attributes: true, attributeFilter: ["data-color-scheme"] })
+    applyScheme()
+
+    onCleanup(() => monitor.disconnect())
+  })
+
   createEffect(() => {
     rendered()
     const ranges = local.commentedLines ?? []
-- 
cgit v1.2.3