在 Visual Studio 代码中更改 hover/active 查找操作按钮的背景颜色

Question

在 Visual Studio Code November 2021 (version 1.63) update release notes 的 Updated Find actions 部分，它们显示查找操作按钮（Match Case、Match Whole Word 和 Use Regular Expression）悬停在可以设置活动状态的样式（示例 gif 显示为蓝色）。他们还提到搜索视图中按钮的样式现在使用与编辑器相同的样式。

我可以使用 settings.json 中的 workbench.colorCustomizations 来定位哪些属性，以便在将鼠标悬停在这些按钮上时或它们处于活动状态时更改这些按钮的背景颜色（在示例 gif)?

我搜索了主题颜色文档的 Action colors, Button control, and Input control 部分，但找不到正确的属性。 toolbar.hoverBackground 更改“查找”工具栏的 Previous Match、Next Match、Find in Selection 和 Close 按钮的悬停颜色，但不更改“查找”文本字段内的按钮。

我也试过在命令面板中使用 Developer: Inspect Editor Tokens and Scopes，这非常适合在编辑器面板中识别主题颜色属性代码名称，但它不能用于VS Code 应用程序 UI 个元素。

Answer 1

在你的 settings.json 中试试这个 colorCustomizations:

"workbench.colorCustomizations": {
    "editorWidget.foreground": "#f00",
    "icon.foreground": "#f00"   // colors the arrows/close in the Find widget

    "inputOption.activeBorder": "#666",          // active states
    "inputOption.activeBackground": "#777676",
    "inputOption.activeForeground": "#fff",

    "inputOption.hoverBackground": "#ff0000",    // hover state
}

来自 Editor widget colors。那是一个“查找小部件”。

"icon.foreground" 设置也会影响搜索视图中的 arrows/close 图标。

并且 inputOption 设置也会影响搜索视图按钮。我认为在不影响搜索视图按钮 hover/active 状态的情况下，没有任何主题可以使那些 Find Widget hover/active 状态。

在 Visual Studio 代码中更改 hover/active 查找操作按钮的背景颜色

Change hover/active background color of Find actions buttons in Visual Studio Code

themes

visual-studio-code

vscode-settings