Skip to content

fix(slide-toggle): no focus indication in high-contrast mode #13287

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

devversion
Copy link
Member

  • Fixes that the slide-toggle does not have any visible focus indication in high contrast mode.

@devversion devversion added Accessibility This issue is related to accessibility (a11y) target: major This PR is targeted for the next major release labels Sep 24, 2018
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Sep 24, 2018
// because otherwise the opaque thumb element will hide the outline.
.mat-slide-toggle.cdk-keyboard-focused & {
outline: 1px dotted;
outline-offset: ($mat-slide-toggle-height - $mat-slide-toggle-bar-height) / 2;
Copy link
Member

Choose a reason for hiding this comment

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

Based on MDN, outline-offset isn't supported on IE. Can we add it on another element?

Copy link
Member

@crisbeto crisbeto left a comment

Choose a reason for hiding this comment

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

Tested out without the outline-offset and it also looks acceptable. LGTM.

@crisbeto crisbeto added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Sep 24, 2018
@devversion devversion added target: patch This PR is targeted for the next patch release and removed target: major This PR is targeted for the next major release labels Oct 20, 2018
@devversion devversion force-pushed the fix/slide-toggle-high-contrast branch from d279662 to a17caa2 Compare November 8, 2018 20:05
@ngbot
Copy link

ngbot bot commented Nov 10, 2018

Hi @devversion! This PR has merge conflicts due to recent upstream merges.
Please help to unblock it by resolving these conflicts. Thanks!

@devversion devversion force-pushed the fix/slide-toggle-high-contrast branch from a17caa2 to 30dd524 Compare November 10, 2018 08:55
* Fixes that the slide-toggle does not have any visible focus indication in high contrast mode.
@devversion devversion force-pushed the fix/slide-toggle-high-contrast branch from 30dd524 to ce14c07 Compare November 10, 2018 09:46
@andrewseguin andrewseguin merged commit 264f306 into angular:master Nov 14, 2018
josephperrott pushed a commit that referenced this pull request Nov 19, 2018
* Fixes that the slide-toggle does not have any visible focus indication in high contrast mode.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Accessibility This issue is related to accessibility (a11y) action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants