Dark Mode unreadable for some items

[G8YTZ]

1. Cover indications don't show grey/white in "dark" mode (comparison shown in light and dark modes)
2. Maps unreadable in "dark" mode.

Examples below (shown on Safari, iPhone app is the same)

[jellevervloessem]

I noticed also that on the Cover, the arrows are hard to distinguish. If a cover is open, it's up-arrow is gray, and the down-arrow is black:

In Dark mode, its hard distinguish:

[bramkragten]

For the dark mode map, we use these https://carto.com/help/building-maps/basemap-list/#carto-raster-basemaps so there is not much we can do there.

[skandalfo]

The dark-mode maps are what breaks the dark theme for me. No contrast at all.

Can this be fixed by some liberal application of the CSS "filter" property?

e.g.: This, applied via the dev console in Chrome:

filter: invert(1) brightness(2.8) contrast(1.2);

Automatically made OSM from the light theme look "dark", but still way more readable than the current dark theme.

My hacking around meant that the overlays got filtered too, but I'm assuming that can be fixed with some work?

[barrymossel]

Nothing on this? The map in dark mode is almost unusable...

[avviano]

I really love the dark UI in Home Assistant! Seriously Awesome!!!

... But the map in Dark Mode is totally unusable. Why would anyone want an unreadable map by default? Makes no sense really. I think this is a classic example of "Form follows Function" gone terribly wrong.

As a fix I propose either to make the map lighter (so we can CLEARLY distinguish features) or make option available to set to "normal" or "white" or "color".

Always remember "Form (design) follows funtion" not the other way round.

Keep up the good work!
Cheers

[bramkragten]

If someone finds some nice dark mode tiles for Leaflet that we are allowed to use, we are very much open to that. Please continue this discussion in #9493, as this issue is closed.