[Org chart] Expand/collapse buttons are invisible with a dark theme

[PaulBone]

Expand/collapse buttons are invisible with a dark theme

I use a dark theme for accessability reasons, See http://paul.bone.id.au/2017/11/26/how-i-see-the-web/ for information about my disability, I use the "Dark Background and Light Text" addon for Firefox.

To Reproduce

1. Install the dark background and light text theme,
2. Go to the org chart.

Expected behavior
I assume these are black images with a transparent background. If they had a white outline or were text rather than images then they could be more accessabile for me.

Screenshots
I deleted the screenshot since it contains the Mozilla org chart, and I don't know if that should be public.

Desktop (please complete the following information):

• OS: Linux Mint 19
• Browser Firefox with Dark Background and Light Text extension.
• Version Nightly 66

[mbransn]

@PaulBone (hello!) and thanks for flagging, quite helpful.

The + - UI are currently SVGs -- @hidde is there a way to maintain their vector scalability, while also enabling a contrast render for the default and hover states?

[PaulBone]

Oh hey @mbransn!

[hidde]

Hey @PaulBone , @mbransn . Thanks for flagging. In our internal Jira board, we do actually have an issue for what I believe is the equivalent of this issue in Windows high contrast mode.

@mbransn: yes, we can totally retain vector scalability! The tricky bit would be to detect this dark background mode. There is a CSS media query, and it looks like it is coming to Firefox, too. I'll dig into it deeper, and see if there's a way without feature detection. To be continued!

[hidde]

Quick update: I've investigated this: basically, only icons that are included as images (<img>) have the problem, those that are inline svgs (<svg>) work fine in the plugin. Will fix!

[mbransn]

Brilliant, thanks @hidde 🌮

[hidde]

Hi @PaulBone, this has been addressed this week. We've also updated some other icons throughout the site to work wit the Firefox dark mode (as well as Windows' built-in dark mode) while we were at it.

Please let us know if you encounter any further issues with dark / high contrast mode