Skip to content

Agents: Refactor chat experimental send button styles#311875

Merged
mrleemurray merged 3 commits intomainfrom
mrleemurray/magnetic-apricot-quail
Apr 22, 2026
Merged

Agents: Refactor chat experimental send button styles#311875
mrleemurray merged 3 commits intomainfrom
mrleemurray/magnetic-apricot-quail

Conversation

@mrleemurray
Copy link
Copy Markdown
Contributor

@mrleemurray mrleemurray commented Apr 22, 2026

This pull request updates the styling of the experimental chat send button gradient to create a calmer, more consistent appearance and interaction experience. The changes simplify the hover/focus effect, adjust animation transitions, and clarify documentation comments to better describe the visual intent.

Styling and interaction improvements:

  • The send button at rest now uses a slowly rotating, darkened conic gradient fill instead of a gradient ring, providing a calmer and more modern look. [1] [2] [3]
  • On hover and focus, the button now displays a subtle dark overlay using an inset box-shadow, matching standard toolbar button feedback and preserving the gradient underneath, instead of a multi-color glow. [1] [2]
  • The transition duration for the box-shadow effect is reduced from 250ms to 120ms for a snappier response. [1] [2]

Documentation and comment updates:

  • CSS comments are updated to clarify that colors are darkened for a calm fill, and to better explain the visual rationale behind the gradient and overlay choices. [1] [2] [3]

Co-authored-by: Copilot <copilot@github.com>
Copilot AI review requested due to automatic review settings April 22, 2026 09:56
@mrleemurray mrleemurray enabled auto-merge (squash) April 22, 2026 09:56
@mrleemurray mrleemurray self-assigned this Apr 22, 2026
@github-actions
Copy link
Copy Markdown
Contributor

Screenshot Changes

Base: 200fb2ed Current: 8be7deea

Changed (1)

editor/inlineCompletions/other/JumpToHint/Dark
Before After
before after

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR refactors the Sessions/Agents chat input styling by removing experimental send-button hover/focus glow CSS, aiming to simplify and make the styling rules easier to maintain.

Changes:

  • Removed hover/focus glow box-shadow rules for the experimental gradient send button.
  • Removed now-unneeded transition: box-shadow declarations associated with the removed glow.

Comment thread src/vs/sessions/contrib/chat/browser/media/chatInput.css
Comment thread src/vs/sessions/contrib/chat/browser/media/chatInput.css
mrleemurray and others added 2 commits April 22, 2026 11:05
Co-authored-by: Copilot <copilot@github.com>
…improved feedback

Co-authored-by: Copilot <copilot@github.com>
@mrleemurray mrleemurray merged commit eec802b into main Apr 22, 2026
40 of 41 checks passed
@mrleemurray mrleemurray deleted the mrleemurray/magnetic-apricot-quail branch April 22, 2026 11:17
@vs-code-engineering vs-code-engineering Bot added this to the 1.118.0 milestone Apr 22, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants