Skip to content

Compact chat control bar doesn't respect command center's background #329092

Description

@huacat1017

Does this issue occur when all extensions are disabled?: Yes (not related to extensions)

  • VS Code Version: 1.131.0
  • OS Version: Arch Linux

Background Problems in compact command center

the background of the compact chat control bar (which is combined with command center) follows agentStatusIndicator.background instead of commandCenter.background, which is a bit strange and unreasonable.

Steps to Reproduce:

  1. Install my Office Theme
  2. switch color theme to Office Theme (Word)
  3. Make sure that chat.agentsControl.enabled is set to compact in settings.json
  4. Make sure that workbench.experimental.modernUI is disabled in settings.json

Expected Behavior ("chat.agentsControl.enabled": "badge")

expected.webm

Actual ("chat.agentsControl.enabled": "compact")

actual.webm

When compact mode is enabled, the command Center bg color defaults to agentStatusIndicator.background, which is a new attribute since #292905 and isn't widely specified in most community themes.

the agentStatusIndicator.background was designed to prevent the Agent Status bar from changing background color when debugging, but it broke the #289396 fix and made agent status bar (also the new compact bar) incompatible with the command center settings in most themes.

When chat.agentsControl.enabled is set to compact, the command center background should be set to commandCenter.background instead of agentStatusIndicator.background.

Other Foreground issues

Command center active foreground is not used in compact mode

Expected ("chat.agentsControl.enabled": "badge")

badge_fg.webm

Actual ("chat.agentsControl.enabled": "compact")

compact_fg.webm

When compact mode is enabled , the hovered command center uses commandCenter.foreground instead of commandCenter.activeForeground.

The chat icon color can't be customized

icon_color.webm

it defaults to icon.foreground, it would be better if there is a separate option that I can customize to make it white.

The "Open In Agents" button text color can't be tailored

open_in_agents.webm

it defaults to foreground, leading to low contrast. A separate option to customize it would be nice.

Outlines

  1. When chat.agentsControl.enabled is set to compact, the command center background should be set to commandCenter.background instead of agentStatusIndicator.background.
  2. When chat.agentsControl.enabled is set to compact, the command center text color should respect the commandCenter.activeForeground when it's hovered.
  3. When agentStatusIndicator.background is not specified, the chat button should fallback to commandCenter.background. I know that it would change color when debugging, but only adding a separate transparent color to it would sometimes make the text hard to read.
  4. Making the chat icon color and the text color of "Open In Agents" customizable would be better.

Thank you for reading this long-winded issue 🙏 ; hopefully, it could be better to make VSCode more themable!

Metadata

Metadata

Labels

chatthemesColor theme issuestitlebarVS Code main title bar issues

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions