fix(dashboard): keep selection visible against active-line tint

CodeMirror layers the active-line background above the selection layer,
so the previous opaque active-line color hid selections on the current
line. Bumps selection alpha and switches active-line to a subtle sky
tint, with the brighter gutter line number as the primary cue.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
MechaCat02
2026-05-24 22:58:27 +02:00
parent 3d4c7b160b
commit 56de652f7a

View File

@@ -17,8 +17,19 @@ const palette = {
text: '#e2e8f0',
textMuted: '#94a3b8',
cursor: '#38bdf8',
selection: '#38bdf830',
activeLine: '#1e293b',
// Selection alpha was originally 30 (≈19%) — bumped to 55 (≈33%)
// so it stays clearly visible when it sits on top of (or under, in
// CodeMirror's case) the active-line tint. The default CM layering
// puts the selection layer behind line backgrounds, so an opaque
// active line hides selections on the current line; this pair of
// values makes both visible at once.
selection: '#38bdf855',
// Active line: very subtle sky tint at ~6% alpha. Strong enough to
// see at a glance which line the caret is on, weak enough to leave
// the selection visible underneath. The active-line gutter (the
// brighter line number on the left) is the primary indicator.
activeLine: '#38bdf810',
activeLineGutter: '#1e293b',
matchingBracket: '#38bdf850',
searchMatch: '#38bdf850',
searchMatchSelected: '#38bdf8',
@@ -76,7 +87,7 @@ export const dashboardTheme = EditorView.theme(
borderRight: `1px solid ${palette.border}`
},
'.cm-activeLineGutter': {
backgroundColor: palette.activeLine,
backgroundColor: palette.activeLineGutter,
color: palette.text
},
'.cm-matchingBracket, .cm-nonmatchingBracket': {