Dark Mode

[fishcharlie]

The CSS prefers-color-scheme media query allows for users to use dark mode with websites. Although the browser adoption is still low now, I assume it will jump quite a bit when Chrome 76 and iOS 13 are released later this year.

OpenStreetMap should adopt this new standard and allow for dark mode on the website.

[tomhughes]

Are you volunteering to do it?

Only we don't really have anybody with CSS or design skills so it is unlikely to happen unless somebody steps up to do the work.

[dieterdreist]

sent from a phone

On 28. Jul 2019, at 07:04, Charlie Fish ***@***.***> wrote: OpenStreetMap should adopt this new standard and allow for dark mode on the website.

particularly for the map this would require an alternative rendering style and additional tiles, right?

[tomhughes]

No idea but I guess if you took it to an extreme then yes - that is not likely to happen until vector rendering is in use for sure!

[fishcharlie]

Are you volunteering to do it?

I could for sure look into it and see what I can do. I haven't really looked at this codebase before. But sure, I can volunteer some time to it, not sure how far I'll get tho. Also fair warning: I'm not the best at design and color choices either. But I know enough about CSS to at least get the ball rolling maybe.

---

In terms of vector rendering, I think that would be nice for this project. Is that something that is going to happen soon? Maybe this is something we could do in stages? Have dark mode for the majority of the site, and wait for vector rendering for enabling dark mode on the map itself?

---

If I were to work on this, is it something that has enough support to be accomplished? I just don't wanna spend a lot of time working on it, and then it's decided that it's a bad idea and shouldn't be implemented. I understand that the changes made have to be approved and all that. But from a high level perspective, is it something that has enough support to be worked on without it being a total waste?

[mmd-osm]

Maybe you should try the following user script first: https://userstyles.org/styles/173774/openstreetmap-dark-theme and see how it goes (as reported in http://www.weeklyosm.eu/en/archives/12261/)

[tomhughes]

Everybody wants vector rendering but so far nobody is doing the work to make it happen.

As to everything else, it doesn't interest me, but if it can be done without creating a massive maintenance headache then I have no objection to it.

Weirdly it might be easier to send different stylesheets rather than have CSS rules that match on a selector because that way you could just have some variables in the SCSS source that are defined differently for light vs dark mode rather than having to have dark versions of lots of rules. No idea if that is possible though.

[vitaly-zdanevich]

I can implement prefers-color-scheme for website, MVP: for header only. Please approve me and I will do it, for this first pull request it must be only a few lines of CSS.

[bezdna]

#2532

[gravitystorm]

I'll repeat some guidance I gave on #2532 here:

To implement a dark mode, I would ideally like to see out-of-the-box support from bootstrap itself. If that's not available, then maybe 10-20 lines of code to set some colour variables, but little more than that. Anything more complex will be too much to maintain for a low-priority feature like this.

[vitaly-zdanevich]

Issue of Bootstrap twbs/bootstrap#27514

[silvinor]

See vinorodrigues/bootstrap-dark for some ideas on how to do this.

[pkrasicki]

This would be a nice feature, but it doesn't make much sense to implement this, unless the map's colors can be changed to dark mode too. Bright colors of the map will ruin the effect. I'm having the same issue in my own app that uses OpenStreetMap. Is there a way to change the map's colors to make it dark? Without it dark mode can't happen, unless you want to add it for the docs or the blog.

[HolgerJeromin]

Is there a way to change the map's colors to make it dark?

That would be a complete new style.
Thunderforst Transport map has a dark variant:
https://www.thunderforest.com/maps/transport-dark/

[pkrasicki]

Would it be possible for openstreetmap.org to provide a dark map?

[tomhughes]

Not at the moment, no. Not unless somebody has a suitable layer they want to propose through the normal process.