Skip to content

Enhance transition timings for titlebar widgets#314372

Merged
mrleemurray merged 5 commits intomainfrom
mrleemurray/envious-sapphire-swan
May 6, 2026
Merged

Enhance transition timings for titlebar widgets#314372
mrleemurray merged 5 commits intomainfrom
mrleemurray/envious-sapphire-swan

Conversation

@mrleemurray
Copy link
Copy Markdown
Contributor

@mrleemurray mrleemurray commented May 5, 2026

This pull request refines the transition effects for the "Open in Agents" and "Open in VSCode" titlebar widgets to improve animation consistency, accessibility, and user experience. The changes adjust transition durations, add delays for smoother label appearance, and ensure reduced motion preferences are respected.

Transition timing and consistency improvements:

  • Increased transition durations from 150ms to 160ms for both icon and label transitions in .open-in-agents-titlebar-widget and .open-in-vscode-titlebar-widget for a smoother effect. [1] [2] [3] [4] [5] [6]
  • Added a transition-delay: 200ms to label transitions, making the label appear after a short delay for a more polished animation. [1] [2] [3]
  • On hover or focus, set transition-delay: 0ms so the label responds immediately to user interaction. [1] [2] [3]

Accessibility and reduced motion support:

  • For users who prefer reduced motion, set transition-duration: 0ms !important and transition-delay: 0ms !important to disable transitions for both icons and labels, respecting accessibility preferences. [1] [2] [3] [4]

These updates ensure UI transitions are smoother and more accessible, with clear separation between initial and interactive states.

Copilot AI review requested due to automatic review settings May 5, 2026 11:27
@mrleemurray mrleemurray enabled auto-merge (squash) May 5, 2026 11:27
@mrleemurray mrleemurray self-assigned this May 5, 2026
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 tweaks the CSS transitions for the titlebar “Open in Agents” / “Open in VS Code” widgets to adjust animation durations and introduce a delay intended to improve perceived smoothness during hover/focus expansion.

Changes:

  • Increased filter and label transition durations from 150ms to 160ms.
  • Added a 200ms transition-delay for label transitions and a 0ms override in hover/focus rules.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 5 comments.

File Description
src/vs/workbench/electron-browser/actions/media/openInAgents.css Updates icon/label transition durations and adds a label transition delay for the workbench “Open in Agents” titlebar widget.
src/vs/workbench/contrib/chat/electron-browser/agentSessions/media/openInAgents.css Mirrors the same “Open in Agents” transition/delay adjustments for the chat agent sessions surface.
src/vs/sessions/contrib/chat/browser/media/openInVSCode.css Updates “Open in VS Code” widget transition durations and introduces a label transition-delay/override pattern (gated by motion classes).

Comment thread src/vs/workbench/electron-browser/actions/media/openInAgents.css Outdated
Comment thread src/vs/workbench/electron-browser/actions/media/openInAgents.css Outdated
Comment thread src/vs/sessions/browser/media/openInVSCode.css
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 5, 2026

Screenshot Changes

Base: a255b7ad Current: 6601ff87

Changed (1)

chat/widget/chatWidget/PendingToolApproval/Light
Before After
before after

@mrleemurray mrleemurray marked this pull request as draft May 5, 2026 11:56
auto-merge was automatically disabled May 5, 2026 11:56

Pull request was converted to draft

…mprove accessibility for reduced motion settings

Co-authored-by: Copilot <copilot@github.com>
@mrleemurray mrleemurray marked this pull request as ready for review May 5, 2026 12:03
aiday-mar
aiday-mar previously approved these changes May 5, 2026
@mrleemurray
Copy link
Copy Markdown
Contributor Author

@copilot resolve the merge conflicts in this pull request

@mrleemurray mrleemurray merged commit b6cb647 into main May 6, 2026
26 checks passed
@mrleemurray mrleemurray deleted the mrleemurray/envious-sapphire-swan branch May 6, 2026 15:06
@vs-code-engineering vs-code-engineering Bot added this to the 1.120.0 milestone May 6, 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.

6 participants