opensource/kilocode
3
0
Fork 0
mirror of https://github.com/Kilo-Org/kilocode.git synced 2026-09-24 16:02:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(vscode): use VS Code placeholder color for input fields (#10159)

Browse Source 
Switches all webview input ::placeholder rules to var(--vscode-input-placeholderForeground, var(--text-weaker)) so placeholders pick up the VS Code-native placeholder color and stay visually distinct from typed values across Settings (including indexing fields), Agent Manager dialogs, prompt input, model search and kiloclaw.

Supersedes #10085 by sylwester-liljegren.
This commit is contained in:
Marius
2026-05-12 10:37:23 +02:00
committed by GitHub
parent e805d2f756
commit 64e45eaba3
7 changed files with 14 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/placeholder-vscode-token.md
+5
View File
@@ -0,0 +1,5 @@
---
"kilo-code": patch
---
Use the VS Code-native placeholder color for input fields so placeholder text is consistently distinct from values you have typed (Settings, Agent Manager, prompt input, model search, etc.).
packages/kilo-ui/src/components/text-field.css
+1 -1
View File
@@ -44,7 +44,7 @@
color: var(--text-base);
&::placeholder {
color: var(--icon-weak-base);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
}
packages/kilo-vscode/webview-ui/agent-manager/agent-manager.css
+4 -4
View File
@@ -1403,7 +1403,7 @@ body.am-wt-dragging-active * {
}
.am-tabs-menu-search-input::placeholder {
color: var(--text-weaker);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
.am-tabs-menu-list {
@@ -2482,7 +2482,7 @@ body.am-wt-dragging-active * {
}
.am-nv-name-input::placeholder {
color: var(--text-weaker);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
/* Dialog overrides for prompt-input-container — resizable from bottom edge */
@@ -2665,7 +2665,7 @@ body.am-wt-dragging-active * {
}
.am-mm-search-input::placeholder {
color: var(--text-weaker);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
.am-mm-list {
@@ -2808,7 +2808,7 @@ body.am-wt-dragging-active * {
}
.am-advanced-input::placeholder {
color: var(--text-weaker);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
/* Branch selector */
packages/kilo-vscode/webview-ui/kiloclaw/kiloclaw.css
+1 -1
View File
@@ -170,7 +170,7 @@
}
.kiloclaw-input::placeholder {
color: var(--vscode-input-placeholderForeground);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
/* Status sidebar */
packages/kilo-vscode/webview-ui/src/styles/model-selector.css
+1 -1
View File
@@ -234,7 +234,7 @@
}
.model-selector-search::placeholder {
color: var(--vscode-input-placeholderForeground);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
.model-selector-list {
packages/kilo-vscode/webview-ui/src/styles/prompt-input.css
+1 -1
View File
@@ -327,7 +327,7 @@
}
.prompt-input::placeholder {
color: var(--vscode-input-placeholderForeground);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
/* Input overlay (highlight + ghost text) */
packages/kilo-vscode/webview-ui/src/styles/question-dock.css
+1 -1
View File
@@ -298,7 +298,7 @@
line-height: var(--line-height-large);
&::placeholder {
color: var(--text-weak);
color: var(--vscode-input-placeholderForeground, var(--text-weaker));
}
&:disabled {