Skip to content
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

Low contrast in breakpoints line numbers in Light High Contrast #143742

Closed
alexdima opened this issue Feb 23, 2022 · 3 comments
Closed

Low contrast in breakpoints line numbers in Light High Contrast #143742

alexdima opened this issue Feb 23, 2022 · 3 comments
Assignees
Labels
accessibility Keyboard, mouse, ARIA, vision, screen readers (non-specific) issues bug Issue identified by VS Code Team member as probable bug insiders-released Patch has been released in VS Code Insiders verified Verification succeeded
Milestone

Comments

@alexdima
Copy link
Member

Testing #143425

image

@daviddossett
Copy link
Contributor

It looks like this the opacity of the background and foreground of the badge are hardcoded here. @isidorn any suggestions on an override for HC modes?

Similar issue on the dark HC theme:

CleanShot 2022-02-23 at 10 41 45@2x

/* Line & column number "badge" for unselected call stack row (basically all other rows) */
.debug-pane .line-number {
background-color: ${badgeBackgroundColor.transparent(0.6)};
color: ${badgeForegroundColor.transparent(0.6)};
}

@daviddossett daviddossett added accessibility Keyboard, mouse, ARIA, vision, screen readers (non-specific) issues bug Issue identified by VS Code Team member as probable bug labels Feb 23, 2022
@isidorn
Copy link
Contributor

isidorn commented Feb 24, 2022

@daviddossett I think for HC modes we should not apply the transparency.
In code we could do that by checking above if the theme is highContrast, and only if not apply the transparency.

fyi @roblourens

@daviddossett daviddossett added this to the March 2022 milestone Mar 5, 2022
@daviddossett
Copy link
Contributor

daviddossett commented Mar 7, 2022

Took this approach for now:

// Use fully-opaque colors for line-number badges
if (theme.type === 'hc') {
collector.addRule(`
.debug-pane .line-number {
background-color: ${badgeBackgroundColor};
color: ${badgeForegroundColor};
}`);
}

CleanShot 2022-03-07 at 15 45 47@2x

@mjbvz mjbvz added the verified Verification succeeded label Mar 24, 2022
@github-actions github-actions bot locked and limited conversation to collaborators Apr 22, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
accessibility Keyboard, mouse, ARIA, vision, screen readers (non-specific) issues bug Issue identified by VS Code Team member as probable bug insiders-released Patch has been released in VS Code Insiders verified Verification succeeded
Projects
None yet
Development

No branches or pull requests

5 participants
@isidorn @alexdima @mjbvz @daviddossett and others