Change:
We currently distinguish links using only color, no underline in some places. This can make it hard for color blind or low vision users to differentiate between links and regular text. Underlines can also reduce readability though. Thoughts or ? ! !
Hi all, Live Share has a sev2 bug assigned for it. It effects our Accessibility Grade. I filed an extension request for it.
How about we start with enabling this in the High Contrast themes?
This one is trickier than I thought. VS Code uses elements throughout the IDE also for things like tabs and buttons, so we need to find a way to only match the elements that look like text... edit: we can match .
I noticed that we do this in the editor even for non-HC themes. !
After some investigation, matching doesn't work as it's the default role and we can only match it if it's explicitly set in the element. Looking for some other solutions, but we may need to add the role attribute explicitly everywhere.
do you have advice how we might work around this?
We do not have an issue filled for this as is my understanding. LiveShare has it, and filling extension is the right approach (which was already done). So for now I suggest no action here.
I still think this is a good thing to look into. Our links in the HC themes don't look very contrasty in any case: <img width="722" alt="image" src=""I realised we don't need to underline all links, just those that appear in a text. So matching should do the trick.
that's a fair point. So could we fix for High Contast only first?
yes, we'll keep it to HC themes for now. I've managed to get it to match only relevant text links that have surrounding text. As you can see standalone text links won't be underlined. GitHub also does not do this. I think it looks pretty good (ignore the red colour, it's to check we're matching the right things and I will reset it): <img width="1150" alt="image" src=""<img width="421" alt="image" src=""<img width="943" alt="image" src=""
Specially in the light HC theme it's a big improvement: <img width="343" alt="image" src=""
Looking good for the HC theme. Thank you
Should these have underlines in HC? ! Otherwise, verified in welcome views and chat.
these don't need to be underlined. Only links in a paragraph surrounded by other text.
Adding setting to enable link underlines in

Discussion:
// ------ text colors export const textSeparatorForeground = registerColor('textSeparator.foreground', { light: '#0000002e', dark: '#ffffff2e', hcDark: Color.black, hcLight: '#292929' }, nls.localize('textSeparatorForeground', "Color for text separators.")); <del> export const textLinkForeground = registerColor('textLink.foreground', { light: '#006AB1', dark: '#3794FF', hcDark: '#3794FF', hcLight: '#0F4A85' }, nls.localize('textLinkForeground', "Foreground color for links in text.")); export const textLinkActiveForeground = registerColor('textLink.activeForeground', { light: '#006AB1', dark: '#3794FF', hcDark: '#3794FF', hcLight: '#0F4A85' }, nls.localize('textLinkActiveForeground', "Foreground color for links in text when clicked on and on mouse hover.")); </del> <ins> export const textLinkForeground = registerColor('textLink.foreground', { light: '#006AB1', dark: '#3794FF', hcDark: '#21A6FF', hcLight: '#0F4A85' }, nls.localize('textLinkForeground', "Foreground color for links in text.")); export const textLinkActiveForeground = registerColor('textLink.activeForeground', { light: '#006AB1', dark: '#3794FF', hcDark: '#21A6FF', hcLight: '#0F4A85' }, nls.localize('textLinkActiveForeground', "Foreground color for links in text when clicked on and on mouse hover.")); </ins> export const textPreformatForeground = registerColor('textPreformat.foreground', { light: '#A31515', dark: '#D7BA7D', hcDark: '#000000', hcLight: '#FFFFFF' }, nls.localize('textPreformatForeground', "Foreground color for preformatted text segments.")); export const textPreformatBackground = registerColor('textPreformat.background', { light: '#0000001A', dark: '#FFFFFF1A', hcDark: '#FFFFFF', hcLight: '#09345f' }, nls.localize('textPreformatBackground', "Background color for preformatted text segments.")); export const textBlockQuoteBackground = registerColor('textBlockQuote.background', { light: '#f2f2f2', dark: '#222222', hcDark: null, hcLight: '#F2F2F2' }, nls.localize('textBlockQuoteBackground', "Background color for block quotes in text."));

text-decoration: none; } <ins> .monaco-workbench.hc-black p > a, .monaco-workbench.hc-light p > a { text-decoration: underline !important; } </ins> .monaco-workbench a:active { color: inherit; background-color: inherit;

color: var(--vscode-textPreformat-foreground); } <del> .hc-black .interactive-item-container .value .rendered-markdown a:hover, .hc-black .interactive-item-container .value .rendered-markdown a:active, .hc-light .interactive-item-container .value .rendered-markdown a:hover, .hc-light .interactive-item-container .value .rendered-markdown a:active { color: var(--vscode-textPreformat-foreground); } </del> .interactive-list { overflow: hidden; }