From 363ff153a462c3867c36041da61a0701d499ffa1 Mon Sep 17 00:00:00 2001 From: David Hill Date: Sat, 24 Jan 2026 17:55:40 +0000 Subject: [PATCH] fix(ui): fix selected line number color in diff view for light/dark mode --- packages/ui/src/pierre/index.ts | 25 ++++++++++++++++++++----- 1 file changed, 20 insertions(+), 5 deletions(-) diff --git a/packages/ui/src/pierre/index.ts b/packages/ui/src/pierre/index.ts index 976f67eca..b9dca65a3 100644 --- a/packages/ui/src/pierre/index.ts +++ b/packages/ui/src/pierre/index.ts @@ -34,7 +34,7 @@ const unsafeCSS = ` --diffs-bg-addition-emphasis: var(--diffs-bg-addition-emphasis-override, light-dark(rgb(from var(--diffs-addition-base) r g b / 0.07), rgb(from var(--diffs-addition-base) r g b / 0.1))); --diffs-selection-base: var(--surface-warning-strong); --diffs-selection-border: var(--border-warning-base); - --diffs-selection-number-fg: var(--text-on-warning-strong); + --diffs-selection-number-fg: #1c1917; --diffs-bg-selection: var(--diffs-bg-selection-override, color-mix(in oklch, var(--surface-warning-base) 65%, transparent)); --diffs-bg-selection-number: var(--diffs-bg-selection-number-override, color-mix(in oklch, var(--surface-warning-base) 85%, transparent)); --diffs-bg-selection-text: color-mix(in oklch, var(--surface-warning-strong) 20%, transparent); @@ -49,8 +49,8 @@ const unsafeCSS = ` } [data-diffs] [data-comment-selected] [data-column-number] { - background-color: var(--diffs-bg-selection-number); - color: var(--diffs-selection-number-fg); + background-color: var(--diffs-bg-selection-number) !important; + color: var(--diffs-selection-number-fg) !important; } [data-diffs] [data-selected-line] { @@ -59,8 +59,23 @@ const unsafeCSS = ` } [data-diffs] [data-selected-line] [data-column-number] { - background-color: var(--diffs-bg-selection-number); - color: var(--diffs-selection-number-fg); + background-color: var(--diffs-bg-selection-number) !important; + color: var(--diffs-selection-number-fg) !important; +} + +[data-diffs] [data-line-type='context'][data-selected-line] [data-column-number], +[data-diffs] [data-line-type='context-expanded'][data-selected-line] [data-column-number], +[data-diffs] [data-line-type='change-addition'][data-selected-line] [data-column-number], +[data-diffs] [data-line-type='change-deletion'][data-selected-line] [data-column-number] { + color: var(--diffs-selection-number-fg) !important; +} + +@media (prefers-color-scheme: dark) { + [data-diffs] { + --diffs-selection-number-fg: #fdfbfb; + --diffs-bg-selection: var(--diffs-bg-selection-override, color-mix(in oklch, var(--solaris-dark-6) 65%, transparent)); + --diffs-bg-selection-number: var(--diffs-bg-selection-number-override, color-mix(in oklch, var(--solaris-dark-6) 85%, transparent)); + } } [data-diffs-header],