Claro primary tabs collapsed menu hamburger icon has insufficient contrast with forced-colors dark background

Changes are made on on 11.x (our main development branch) first, and are then back ported as needed according to the Core change policies → .

Hi @kentr, i think the proposed resolution may not work in this case as that hamberger menu is a svg image so we can add fill: linketext to its < path/> tag when forced color mode is active to fix this issue. Do you agree with it?

@sandip poddar:

It should work... That said, my proposal was biased because I had been working on an issue where a media query inside the svg didn't work.

Your proposal is simpler and less invasive, and I've also learned from @Curtis Wilcox in Slack that:

• in this case the role is a button and the color should be ButtonText
• because this is an inline SVG, using currentColor will allow the colors to inherit from the parent button which will have the correct color in forced-colors mode

I updated the IS proposed resolution based on the suggestions from you and @Curtis Wilcox.

I'm also only finding this one instance in Claro of an inline SVG. Maybe it would be better to convert it to a background image for consistency.

Ultimately, it's up to the maintainers.

Hi @kentr,
Thank you for the information. I'll proceed with raising a MR as outlined in the Proposed resolution.

I'm also only finding this one instance in Claro of an inline SVG. Maybe it would be better to convert it to a background image for consistency.

That sounds reasonable to me as well. If any maintainer agrees with this suggestion, I'll be happy to revert the changes. For now, I'll go ahead and raise the MR as mentioned in point #4.

Attaching Screenshot for review.