microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-07-10 16:58:55 -05:00
Code Issues Packages Projects Releases 177 Wiki Activity

Model picker styling updates (#314150)

Browse Source
This commit is contained in:
Paul
2026-05-04 09:54:12 -07:00
committed by GitHub
parent 64bb6714fb
commit 4e0822feb0
4 changed files with 30 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/vs/sessions/contrib/chat/browser/media/chatInput.css
View File

@@ -169,16 +169,15 @@
height: auto;
}
/* Split model picker: undo the fixed height/overflow from .action-label above */
.sessions-chat-config-toolbar .action-label.model-picker-split {
height: auto;
overflow: visible;
padding: 0 6px;
min-width: 0;
}
.sessions-chat-config-toolbar .action-item:has(.model-picker-split) {
overflow: visible;
/* Left divider for the agents app welcome view */
.sessions-chat-config-toolbar .action-label.model-picker-split::before {
content: '';
position: absolute;
top: 25%;
bottom: 25%;
left: 0;
width: 1px;
background-color: var(--vscode-editorWidget-border);
}
/* Hide the right divider from the workbench base styles */

2
src/vs/workbench/contrib/chat/browser/widget/input/chatModelPicker.ts
View File

@@ -163,7 +163,6 @@ function createModelAction(
languageModelsService: ILanguageModelsService,
section?: string,
): IActionWidgetDropdownAction & { section?: string } {
const toolbarActions = languageModelsService.getModelConfigurationActions(model.identifier);
const configDescription = getModelConfigurationDescription(model, languageModelsService);
// Only show pricing in the description line if it's a multiplier (e.g. "2x").
// Detailed AIC/token pricing is shown in the hover instead.
@@ -183,7 +182,6 @@ function createModelAction(
tooltip: model.metadata.name,
label: model.metadata.name,
section,
toolbarActions: toolbarActions && toolbarActions.length > 0 ? toolbarActions : undefined,
run: () => onSelect(model),
};
}

32
src/vs/workbench/contrib/chat/browser/widget/media/chat.css
View File

@@ -1866,11 +1866,11 @@ have to be updated for changes to the rules above, or to support more deeply nes
}
/* Split model picker layout */
.interactive-session .chat-input-toolbar .chat-input-picker-item:has(.model-picker-split) {
.chat-input-picker-item:has(.model-picker-split) {
overflow: visible;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split {
.chat-input-picker-item .action-label.model-picker-split {
padding: 0 6px;
gap: 2px;
overflow: visible;
@@ -1898,7 +1898,7 @@ have to be updated for changes to the rules above, or to support more deeply nes
right: 0;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-section {
.chat-input-picker-item .action-label.model-picker-split .model-picker-section {
display: flex;
align-items: center;
height: 16px;
@@ -1911,52 +1911,52 @@ have to be updated for changes to the rules above, or to support more deeply nes
}
/* Prevent double hover: disable the outer container hover so only individual sections highlight */
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split:hover,
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split[aria-expanded="true"] {
.chat-input-picker-item .action-label.model-picker-split:hover,
.chat-input-picker-item .action-label.model-picker-split[aria-expanded="true"] {
background-color: transparent !important;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-section:hover {
.chat-input-picker-item .action-label.model-picker-split .model-picker-section:hover {
background-color: var(--vscode-toolbar-hoverBackground);
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-section[aria-expanded="true"] {
.chat-input-picker-item .action-label.model-picker-split .model-picker-section[aria-expanded="true"] {
background-color: var(--vscode-toolbar-hoverBackground);
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-name {
.chat-input-picker-item .action-label.model-picker-split .model-picker-name {
min-width: 0;
flex-shrink: 1;
overflow: hidden;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-name .chat-input-picker-label {
.chat-input-picker-item .action-label.model-picker-split .model-picker-name .chat-input-picker-label {
overflow: hidden;
text-overflow: ellipsis;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-effort,
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-tokens {
.chat-input-picker-item .action-label.model-picker-split .model-picker-effort,
.chat-input-picker-item .action-label.model-picker-split .model-picker-tokens {
flex-shrink: 0;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-section .codicon {
.chat-input-picker-item .action-label.model-picker-split .model-picker-section .codicon {
font-size: 12px;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split .model-picker-section span + .chat-input-picker-label {
.chat-input-picker-item .action-label.model-picker-split .model-picker-section span + .chat-input-picker-label {
margin-left: 2px;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split.disabled .model-picker-section {
.chat-input-picker-item .action-label.model-picker-split.disabled .model-picker-section {
cursor: default;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split.disabled .model-picker-section:hover {
.chat-input-picker-item .action-label.model-picker-split.disabled .model-picker-section:hover {
background-color: transparent;
}
.interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split.disabled .codicon {
.chat-input-picker-item .action-label.model-picker-split.disabled .codicon {
color: var(--vscode-disabledForeground);
}

5
src/vs/workbench/contrib/inlineChat/browser/media/inlineChat.css
View File

@@ -323,6 +323,11 @@
padding: 2px 0px;
}
.monaco-workbench .inline-chat .interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split::before,
.monaco-workbench .inline-chat .interactive-session .chat-input-toolbar .chat-input-picker-item .action-label.model-picker-split::after {
display: none;
}
/* Termination card (zone widget) — aligned with overlay widget */
.monaco-workbench .inline-chat-terminated-card {