Skip to content

Commit daa0a70

Browse files
authored
fix light theme contrast issue in questions feature (#303213)
fixes #302923
1 parent 70bc868 commit daa0a70

File tree

1 file changed

+31
-10
lines changed

1 file changed

+31
-10
lines changed

src/vs/workbench/contrib/chat/browser/widget/chatContentParts/media/chatQuestionCarousel.css

Lines changed: 31 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -247,31 +247,52 @@
247247
background-color: var(--vscode-list-hoverBackground);
248248
}
249249

250-
/* Single-select: highlight entire row when selected */
250+
/* Single-select: highlight entire row when selected (list not focused) */
251251
.chat-question-list-item.selected {
252-
background-color: var(--vscode-list-hoverBackground);
253-
color: var(--vscode-list-activeSelectionForeground);
252+
background-color: var(--vscode-list-inactiveSelectionBackground, var(--vscode-list-hoverBackground));
253+
color: var(--vscode-list-inactiveSelectionForeground, var(--vscode-foreground));
254254

255-
.chat-question-label {
256-
color: var(--vscode-list-activeSelectionForeground);
255+
.chat-question-list-label,
256+
.chat-question-list-label-title {
257+
color: var(--vscode-list-inactiveSelectionForeground, var(--vscode-foreground));
257258
}
258259

259260
.chat-question-list-label-desc {
260-
color: var(--vscode-list-activeSelectionForeground);
261-
opacity: 0.8;
261+
color: var(--vscode-list-inactiveSelectionForeground, var(--vscode-foreground));
262262
}
263263

264264
.chat-question-list-indicator.codicon-check {
265-
color: var(--vscode-list-activeSelectionForeground);
265+
color: var(--vscode-list-inactiveSelectionForeground, var(--vscode-foreground));
266266
}
267267

268268
.chat-question-list-number {
269-
color: var(--vscode-list-activeSelectionForeground);
269+
color: var(--vscode-list-inactiveSelectionForeground, var(--vscode-foreground));
270270
}
271271
}
272272

273+
/* When the question list has focus, use active selection styling */
274+
.chat-question-list:focus .chat-question-list-item.selected {
275+
background-color: var(--vscode-list-activeSelectionBackground, var(--vscode-list-hoverBackground));
276+
color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
277+
278+
.chat-question-label {
279+
color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
280+
}
281+
282+
.chat-question-list-label-desc {
283+
color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
284+
}
285+
286+
.chat-question-list-indicator.codicon-check {
287+
color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
288+
}
289+
290+
.chat-question-list-number {
291+
color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
292+
}
293+
}
273294
.chat-question-list-item.selected:hover {
274-
background-color: var(--vscode-list-hoverBackground);
295+
background-color: var(--vscode-list-inactiveSelectionBackground, var(--vscode-list-hoverBackground));
275296
}
276297

277298
/* Checkbox for multi-select */

0 commit comments

Comments
 (0)