[openstreetmap/openstreetmap-website] Dark Mode (#2332)
Andy Allan
notifications at github.com
Wed Sep 20 16:09:57 UTC 2023
I experimented today with using [Bootstrap 5.3 built-in support for colour modes](https://getbootstrap.com/docs/5.3/customize/color-modes/). Here's a couple of screenshots for what it currently looks like:


This was a one-line change to turn on dark mode (`data-bs-theme="dark"` on `<html>`), and is just a PoC (no automatic UA-driven switching etc). It also shows that more work needs to be done first, such as:
* refactor how we define the background color for the content-heading so that it is driven by theme colours rather than a standard colour variable
* refactor our override of the table striping
* ... I'm sure there's many other parts of the site that will need refactoring to fully work too.
We aren't even on bootstrap 5.3 yet, this was just while I was testing some other upgrades. But since colour themes are built into newer versions of bootstrap, this is definitely the way forward for implementing dark mode.
--
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/issues/2332#issuecomment-1728044333
You are receiving this because you are subscribed to this thread.
Message ID: <openstreetmap/openstreetmap-website/issues/2332/1728044333 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20230920/334a8f56/attachment.htm>
More information about the rails-dev
mailing list