[dirlisting] Add dark mode support

[ebraminio]

This adds dark mode support to lighttpd's dirlisting generated pages.

Nowadays files transferred to browser via text/* MIME are also getting
automatic dark mode by the browsers so this makes lighttpd's dirlisting
compatible with those features of the browsers.

lighttpd.mov

lighttpd 2.0 version of the patch: lighttpd/lighttpd2#13

(build instructions self note for future)

meson setup --buildtype debugoptimized build
ninja -C build && build/src/lighttpd -m build/src -f /etc/lighttpd/lighttpd.conf -D

[gstrauss]

Thank you, @ebraminio!

[ebraminio]

Thank you very @gstrauss for the merge. I like to do some bikeshedding around now that we a version merged, is the original designer of the page which did this minimalistic yet fantastic page unlike other web server still around? And which one looks better,

Current

Which is browser default for dark color background, or keep the background the same but making the inner part more dark

Or any other dark color combination but I won't suggest use of completely white text color on completely black background as that's a bit annoying for eye as far as I can tell and have got feedback from my friends. Thanks 😊

[gstrauss]

is the original designer of the page which did this minimalistic yet fantastic page unlike other web server still around?

The git history suggests the original mod_dirlisting.c CSS is circa 2005, and those contributors have not been active for a long while.

And which one looks better,
Which is browser default for dark color background, or keep the background the same but making the inner part more dark
Or any other dark color combination but I won't suggest use of completely white text color on completely black background as that's a bit annoying for eye as far as I can tell and have got feedback from my friends.

Regarding making the inner part more dark: that does add some contrast. However, as you also mentioned, too much contrast may strain the eyes. Yes, white text on completely black background is a no-go. (And yes, the default black text on a completely white background is also a strain on the eyes.)

I am not a UX expert, and although I know that UX on mobile devices compared to desktops might make different UX choices, I do not think extreme changes should be made to the CSS based on one opinion. I am not saying your bikeshedding is extreme -- I am only saying that I recognize that I am bikeshedding, too.

I would consider making the inner part more dark, but my first impression with the example you posted in your second example above is too dark, with too much contrast. I notice that it is quite a bit darker than the github dark-mode background. (Given the Apple-aesthetic, how does that dark contrast compare to your Macbook display in other non-browser windows?) Also, changes should be balanced with similar (not exact) changes made to light-mode, e.g. a light gray difference from the white. Additionally, please recognize that I do not have the time or hardware to test such changes across many different devices -- and there are more devices in the world than a macbook and my desktop -- and I do not have the ability to collect feedback on the change, which is typically a good idea for UX changes.

[ebraminio]

The git history suggests the original mod_dirlisting.c CSS is circa 2005, and those contributors have not been active for a long while.

Their works has been fantastic decades ago. I personally don't want to touch anything from their original design aside the dark mode because it's just absolutely iconic, perfect and meme of its own 😊

Also, changes should be balanced with similar (not exact) changes made to light-mode, e.g. a light gray difference from the white.

Exactly and totally, let's see what we can do, but no need to rush, months / years, I don't want take much of your time for such minor details either.

Regarding making the inner part more dark: that does add some contrast. However, as you also mentioned, too much contrast may strain the eyes. Yes, white text on completely black background is a no-go.

There are CSS values browsers provide https://web.dev/articles/light-dark Canvas and CanvasText, I'll see if I can come up with a better combination using browsers CSS color values but only for the dark mode to reduce the need for our own decision making.

Additionally, please recognize that I do not have the time or hardware to test such changes across many different devices -- and there are more devices in the world than a macbook and my desktop -- and I do not have the ability to collect feedback on the change, which is typically a good idea for UX changes.

That's for sure and thanks for not being too picky and merging this at first place. Somehow I liked also to open the way if someone else one day wanted to tweak this at least I don't insist much on things I've done here 😊