starred/terminal
1
0
Fork 0
mirror of https://github.com/microsoft/terminal.git synced 2026-09-25 00:15:10 +00:00
Code Issues 19.0k Packages Projects Releases 20 Wiki Activity

[PR #9196] Redesign color schemes page #27465

New Issue
Open
opened 2026-01-31 09:22:08 +00:00 by claunia · 0 comments
claunia commented 2026-01-31 09:22:08 +00:00
Owner
Copy Link

Original Pull Request: https://github.com/microsoft/terminal/pull/9196

State: closed
Merged: Yes

This PR performs a large overall polish of the color schemes page:

  • Ensures keyboard navigation is holistically improved (i.e. fully
    accessible, no lost focus, etc...)
  • Adds tooltips and automation properties to all controls
  • Redesigns the page according to @mdtauk's approved design
    (link).
    Note, there are some minor modifications to the design that were
    approved by @cinnamon-msft.
  • Automatically reflow's the color buttons when they do not fit in
    horizontal mode

Detailed Description of the Pull Request / Additional comments

  • Redesign
    • a data template was introduced to make color representation
      consistent and straightforward
    • ContentControl is used to hold a reference to the
      ColorTableEntry and represent it properly using the aforementioned
      data template.
    • The design is mainly a StackPanel holding two grids: color table &
      functional colors.
    • The color table is populated via code. After much thought, this
      seems to be the easiest way to correctly bind 16 controls that are
      very similar.
    • The functional colors are populated via XAML manually.
    • We need a grid to separate the text and the buttons. This allows for
      scenarios like "selection background is the longest string" to force
      the buttons and text to be aligned.
  • Reflow
    • A VisualStateManager uses an AdaptiveTrigger to change the
      orientation of the color tables' stack panel. The adaptive trigger
      was carefully calculated to align with the navigation view's
      breakpoint.
  • Keyboard Navigation
    • (a lesson from SettingContainer) ContentControl can be focused
      as opposed to the content inside of it. We don't want that, so we
      set IsTabStop to false on it. That basically fixes all of our
      keyboard navigation issues in this new design.
  • Automation Properties and ToolTips
    • As in my previous PRs, I can't seem to figure out how to bind to a
      control's automation property to its own tooltip. So I had to do
      this in the code and add a few x:Name around.

Validation Steps Performed

  • Manually tested...
    • tab navigation
    • accessibility insights
    • NVDA
    • changing color schemes updates color table
  • specific scenario:
    • change a color table color and a functional color
    • navigate to a different color scheme
    • navigate back to the first color scheme
    • if the colors persist, the changes were propagated to the settings model

References #8997 - Based on the work from @Chips1234
References #6800 - Settings UI Epic
Closes #8765 - Polish Color Schemes page
Closes #8899 - Automation Properties
Closes #8768 - Keyboard Navigation

**Original Pull Request:** https://github.com/microsoft/terminal/pull/9196 **State:** closed **Merged:** Yes --- This PR performs a large overall polish of the color schemes page: - Ensures keyboard navigation is holistically improved (i.e. fully accessible, no lost focus, etc...) - Adds tooltips and automation properties to all controls - Redesigns the page according to @mdtauk's approved design ([link](https://github.com/microsoft/terminal/pull/8997#issuecomment-771623842)). Note, there are some minor modifications to the design that were approved by @cinnamon-msft. - Automatically reflow's the color buttons when they do not fit in horizontal mode ## Detailed Description of the Pull Request / Additional comments - Redesign - a data template was introduced to make color representation consistent and straightforward - `ContentControl` is used to hold a reference to the `ColorTableEntry` and represent it properly using the aforementioned data template. - The design is mainly a StackPanel holding two grids: color table & functional colors. - The color table is populated via code. After much thought, this seems to be the easiest way to correctly bind 16 controls that are very similar. - The functional colors are populated via XAML manually. - We need a grid to separate the text and the buttons. This allows for scenarios like "selection background is the longest string" to force the buttons and text to be aligned. - Reflow - A `VisualStateManager` uses an `AdaptiveTrigger` to change the orientation of the color tables' stack panel. The adaptive trigger was carefully calculated to align with the navigation view's breakpoint. - Keyboard Navigation - (a lesson from `SettingContainer`) `ContentControl` can be focused as opposed to the content inside of it. We don't want that, so we set `IsTabStop` to false on it. That basically fixes all of our keyboard navigation issues in this new design. - Automation Properties and ToolTips - As in my previous PRs, I can't seem to figure out how to bind to a control's automation property to its own tooltip. So I had to do this in the code and add a few `x:Name` around. ## Validation Steps Performed - Manually tested... - tab navigation - accessibility insights - NVDA - changing color schemes updates color table - specific scenario: - change a color table color and a functional color - navigate to a different color scheme - navigate back to the first color scheme - if the colors persist, the changes were propagated to the settings model References #8997 - Based on the work from @Chips1234 References #6800 - Settings UI Epic Closes #8765 - Polish Color Schemes page Closes #8899 - Automation Properties Closes #8768 - Keyboard Navigation
claunia added the pull-request label 2026-01-31 09:22:08 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
⛺ Reserved
A11yCO
A11yMAS
A11ySev1
A11ySev2
A11ySev3
A11yTTValidated
A11yUsable
A11yVoiceAccess
A11yWCAG
Area-Accessibility
Area-AtlasEngine
Area-AzureShell
Area-Build
Area-Build
Area-Chat
Area-CmdPal
Area-CodeHealth
Area-Commandline
Area-CookedRead
Area-DefApp
Area-Extensibility
Area-Fonts
Area-GroupPolicy
Area-i18n
Area-Input
Area-Interaction
Area-Interop
Area-Localization
Area-Output
Area-Performance
Area-Portable
Area-Quality
Area-Remoting
Area-Rendering
Area-Schema
Area-Server
Area-Settings
Area-SettingsUI
Area-ShellExtension
Area-ShellExtension
Area-ShellExtension
Area-Suggestions
Area-Suggestions
Area-TerminalConnection
Area-TerminalControl
Area-Theming
Area-UserInterface
Area-VT
Area-Windowing
Area-WPFControl
AutoMerge
Blocking-Ingestion
Culprit-Centennial
Culprit-WinUI
Disability-All
Disability-Blind
Disability-LowVision
Disability-Mobility
External-Blocked-WinUI3
Fixed
Gathering-Data
good first issue
HCL-E+D
HCL-WindowsTerminal
Help Wanted
Impact-Compatibility
Impact-Compliance
Impact-Correctness
Impact-Visual
In-PR
InclusionBacklog
InclusionBacklog-Windows TerminalWin32
InclusionCommitted-202206
Issue-Bug
Issue-Docs
Issue-Feature
Issue-Feature
Issue-Question
Issue-Samples
Issue-Scenario
Issue-Task
Needs-Attention
Needs-Author-Feedback
Needs-Bisect
Needs-Discussion
Needs-Repro
Needs-Tag-Fix
Needs-Tag-Fix
Needs-Triage
No-Recent-Activity
Priority-0
Priority-1
Priority-2
Priority-3
Product-Cmd.exe
Product-Colortool
Product-Colortool
Product-Colortool
Product-Conhost
Product-Conpty
Product-Meta
Product-Powershell
Product-Terminal
Product-WSL
pull-request
Mirrored from GitHub Pull Request
 Resolution-Answered
Resolution-By-Design
Resolution-Duplicate
Resolution-External
Resolution-Fix-Available
Resolution-Fix-Committed
Resolution-No-Repro
Resolution-Won't-Fix
Severity-Blocking
Severity-Crash
Severity-DataLoss
spam
this-will-be-a-breaking-change
Tracking-External
WindowsTerminal_Win32
Work-Item
zAskModeBug
zInbox-Bug
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
claunia
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/terminal#27465
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?