search

FreeCAD / DevelopersHandbook

A handbook about FreeCAD development
40 stars 28 forks source link

Ability to have a 'dark mode' for the handbook #6

Open luzpaz opened 1 year ago

luzpaz commented 1 year ago

Handbook as it now is bright white. It also isn't playing nice with the https://darkreader.org/ extension.

chennes commented 1 year ago

Can you give it a look now and see if it's any better? We switched the theme to one that might be better.

luzpaz commented 1 year ago

Yes, much better!

It would be still nice to have some sort of js that toggles full dark mode. Would that be OK to have as a feature ?

chennes commented 1 year ago

I don't know if it's possible, this is an automatically-generated website created from Markdown files. Can you find another GitHub Site where they do such a thing?

dirkolbrich commented 1 year ago

If you use the TailwindCSS framework for styling, this is trivial. Depending on a LocalStorage variable it adds a global dark class to the <html> DOM element. This setting can be switched with some simple JS, respecting the system settings for dark/light or explicitly using the user settings for this website. Here is an example of a Hugo based static website, were I added this functionality. Could be used if there is Jekyll theme using TailwindCSS.

-> https://github.com/dirkolbrich/hugo-tailwindcss-starter-theme/commit/84a5cefea39a33b7a6c245dcc66133c2373e7459

dirkolbrich commented 1 year ago

found an example on how to setup a Github page with TailwindCSS -> https://github.com/harrywang/tailpages Will try a mock-up in a separate branch.