microsoft / AzureStorageExplorer

Easily manage the contents of your storage account with Azure Storage Explorer. Upload, download, and manage blobs, files, queues, tables, and Cosmos DB entities. Gain easy access to manage your virtual machine disks. Work with either Azure Resource Manager or classic storage accounts, plus manage and configure cross-origin resource sharing (CORS) rules.
Creative Commons Attribution 4.0 International
367 stars 86 forks source link

Handle high contrast themes better when system is in high contrast #4636

Open craxal opened 3 years ago

craxal commented 3 years ago

When system high contrast is turned on, Storage Explorer colors don't behave very well, even when the app's theme is set to High Contrast -Black or High Contrast - White. More specifically, borders for trees and tables are colored incorrectly.

image

The reason for this is because when system high contrast is turned on, the OS forces most colors into system colors (defined by the user). This means, no matter how we style certain elements, colors will always be forced to OS configured colors. This happens even if an element is styled with a hex value matching a system color. For example, even if the border color of the tree nodes is set to the correct cyan color, it will still be forced to white.

To better handle this situation, I propose the following:

jinglouMSFT commented 3 years ago

Sounds like a good plan

craxal commented 2 years ago

This issue is actually better solved by using the CSS property force-color-adjust: none instead. This gives us control of colors even in Windows High Contrast mode. We should still consider having a "System" theme setting that automatically adjusts to the OS's theme settings (see #4635).

craxal commented 2 years ago

Several panels are not styled correctly if the app starts when Windows is already in high contrast mode. This appears to be due to a bug involving the background color for <body> elements.

See electron/electron#31659

craxal commented 2 years ago

If a workaround for this is needed before an Electron fix is available, we could consider adding a <div> element that covers the entire <body>, which is the problematic element.

craxal commented 2 years ago

Still have the problem with high contrast themes and <body> backgrounds on Electron 19.0.3.