[ TreeView ] Multi Select state doesn't meet high contrast requirements #6729
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
tashatitova
requested review from
StephenLPeters,
karkarl,
ranjeshj,
teaP and
marksfoster
ghost
added
the
karkarl
reviewed
Feb 16, 2022
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
marksfoster
approved these changes
Feb 16, 2022
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
StephenLPeters
approved these changes
Feb 22, 2022
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
StephenLPeters
added
accessibility
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Issue:
In high contrast the selected (checked) item was filled with high contrast color, the known issue with controls that have complex content - the background can't be flooded with Highlight color due to interaction states of content controls, here, Checkbox. On top of that, foreground was picking up states from ContentPresenter, resulting in incorrect high contrast:
The fix is to only use borders to indicate hover and selected states going forward. We need to use two border outlines for MultiSelect case since the MultiSelect item selection is set independently of ContentPresenter visual states, so the hover appears on all items, selected or not. Easiest solution to this was to give MultiSelectGrid a border and a margin in high contrast so that inner outline fits within the outer outline.
Tree-View-HC-fix.mp4
Updating focus visuals while at it (overlapped with some of the nested borders):
Multi-select high contrast, edge case scenario, selected item + hover + focus:
