sdaduanbilei/cc-haha
1
0
Fork 0
mirror of https://github.com/NanmiCoder/cc-haha synced 2026-07-18 13:23:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

Improve dark model selection contrast

Browse Source 
The model selector reused the light-theme primary fixed surface for selected rows, which made dark mode render a pale block with poor text contrast. This gives the selector its own selected-row tokens so dark mode can keep a low-luminance surface while light mode preserves the existing look.

Constraint: Keep the fix scoped to desktop theme tokens and the existing selector component
Rejected: Change primary-fixed globally | too broad because other components rely on that token semantics
Confidence: high
Scope-risk: narrow
Directive: Do not point selected model rows back to primary-fixed without checking dark-mode contrast
Tested: cd desktop && bun run lint
Tested: cd desktop && bun run build
Tested: git diff --check
Not-tested: Browser screenshot capture blocked by an existing Chrome DevTools profile instance
This commit is contained in:
程序员阿江(Relakkes) 2026-04-28 12:41:56 +08:00
parent 91a28d949f
commit e1474b5c30
2 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
desktop/src/components/controls/ModelSelector.tsx
View File

@ -278,7 +278,7 @@ export function ModelSelector({
className={`
w-full rounded-lg border px-3 py-2.5 text-left transition-colors
${isSelected
? 'border-[var(--color-brand)]/20 bg-[var(--color-primary-fixed)]'
? 'border-[var(--color-model-option-selected-border)] bg-[var(--color-model-option-selected-bg)]'
: 'border-transparent hover:bg-[var(--color-surface-hover)]'
}
`}
@ -328,7 +328,7 @@ export function ModelSelector({
className={`
w-full rounded-lg px-3 py-2.5 text-left transition-colors
${isSelected
? 'bg-[var(--color-primary-fixed)] border border-[var(--color-brand)]/20'
? 'border border-[var(--color-model-option-selected-border)] bg-[var(--color-model-option-selected-bg)]'
: 'hover:bg-[var(--color-surface-hover)]'
}
`}

4
desktop/src/theme/globals.css
View File

@ -173,6 +173,8 @@
--color-surface-sidebar: var(--color-surface-container-low);
--color-surface-hover: var(--color-surface-container-high);
--color-surface-selected: var(--color-surface-container);
--color-model-option-selected-bg: var(--color-primary-fixed);
--color-model-option-selected-border: rgba(143, 72, 47, 0.2);
--color-sidebar-filter-bg: transparent;
--color-sidebar-filter-border: rgba(218, 193, 186, 0.92);
--color-sidebar-filter-icon-bg: transparent;
@ -317,6 +319,8 @@
--color-surface-sidebar: #171615;
--color-surface-hover: var(--color-surface-container-highest);
--color-surface-selected: var(--color-surface-container);
--color-model-option-selected-bg: rgba(255, 181, 159, 0.13);
--color-model-option-selected-border: rgba(255, 181, 159, 0.34);
--color-sidebar-filter-bg: rgba(255, 255, 255, 0.01);
--color-sidebar-filter-border: rgba(255, 255, 255, 0.08);
--color-sidebar-filter-icon-bg: transparent;