Add dark mode about toha HOT 8 CLOSED

I'm experimenting with using DarkReader to enable dark mode in toha. My branch is here.
So far, the result is pretty decent. Not sure if that's biased because I'm using the DarkReader browser plugin. I think a native CSS for dark mode is faster but still, this gets the job done with minimal effort.

Website URL: https://donfiguerres.github.io/

from toha.

Hi everyone! I've made a pull request to support dark theme via darkreader. Hoping that it gets approved.
I'm planning to add it to the toha documentation if the pull request gets approved.

from toha.

@hossainemruz FWIW this is what it does to my site
Before

After

I think largely it does the job well but there are a few sets of text that need some attention in order for their contrast ratio to be high enough. i assume if we figure those out we could easily turn this on with a feature flag in the config.yml to make this passive?

from toha.

Hey @hossainemruz can you please tell me for darkmode in which CSS file should be the following code added,

html[theme='dark-mode'] {
    filter: invert(1) hue-rotate(180deg);
}

from toha.

I am not sure yet @Yeganathan. Probably, @alex-bezek can help.

from toha.

Thanks for the reply! @hossainemruz , Let me check with @alex-bezek

from toha.

@yeganathan18 if you add a css file to this location, it will get picked up and included in the build
https://github.com/alex-bezek/blog/blob/master/static/assets/css/style.css

from toha.

@alex-bezek Thanks for the help :)

from toha.