Enable Dark Theme on user choice option

gurjyot

Any progress on this idea. It's a nice feature and Twitter/YouTube also provides the same functionality. I usually prefer a dark theme during night time but, (as an admin) turning the website dark for everyone would not be a great idea.

Ralkage

"Forget to pay electric bill" ?

I like this concept, I'm sure it'll come to life eventually ?

gurjyot

Ralkage I hope it does come to life quite soon. ?

Ralkage

I assume it would be something like this? ?

Night Mode!

gurjyot

Ralkage Oh man, I just love to see that...???

duman

Ralkage Is it just some modified inspect element or you made it real? I'd be extremely happy if you made it real!

Ralkage

duman Modified HTML via Developer Tools. I was just displaying what it would look like initially if it were created. Though, it's not far-fetched but is still do-able.

sijad

I need this feature too, I'm looking into this ?

duman

sijad best of luck! I'm waiting for another amazing extension of yours!

sijad

it's almost ready, still has few bugs, after fixing those it'll be released as an extension. dark style autogenerate via a script using diff between dark and light styles.

there's a demo for stylus.

duman

sijad I'm honestly excited about this. Thank you very much!

Felli

sijad I'm surprised that you didn't just create an extension that would do the exact same thing, but it still looks good nonetheless. ?

sijad

Felli first bugs of that script should get fixed, extension need more time to be done, e.g. add ability to let user choose dark mode in front-end, save that settings, regenerate css, etc.

0E800

I see, its a custom theme design made for a 3rd party web browser extension.

Felli

sijad You could use the form class id to create a toggle switch that would pretty much do this, the only issue I'd see with doing this is you'd have to have two CSS files to call on each form entry.

luceos

sijad choose dark mode in front-end, save that settings, regenerate css, etc.

Regenerating css is not necessary. Because then you're assuming css is related to a user, it would require compilation of the same amount of css as you have users. @Felli has a point here, you'd have to ensure the Less compiler is spitting out a light and dark variant and save the state of the user selection (dark, light). Nothing more I think?

Never mind you were thinking the same: flarum/core865#issuecomment-348709128

sijad

luceos Regenerating css is not necessary. Because then you're assuming css is related to a user, it would require compilation of the same amount of css as you have users. @Felli has a point here, you'd have to ensure the Less compiler is spitting out a light and dark variant and save the state of the user selection (dark, light). Nothing more I think?

I mean regenerating diff from dark and light css, you see there's a script that parses both light and dark css and only keeps the different, prioritizes remained css selectors by adding a prefix (e.g. a css class). maybe I did over thinking it, but there's two reason for creating this script:

making dark css manually is not a good solution.
I'm not sure changing colors in admin section does or does not effect colors in dark mod. for this reason, dark mode colors should regenerated after changing admin settings.

Ralkage

How does the current "theme_dark_mode" setting in the settings table actually work? And can it be utilized given there is a @config-dark-mode LESS variable available?

sijad

Ralkage after changing theme_dark_mode value, all less files compile again, Flarum sets @config-dark-mode to value of theme_dark_mode before compiling.

0E800 no that's not possible currently because there's only one css file for all users.

0E800

Is it not possible to make an extension that moves the dark theme option from the admin appearance options to the users settings?
Maybe give admin option of allowing users to control theme or not.