Add dark mode

[MichaelCurrin]

From inspecting in Chrome / Nativefier:

[minhhang107]

I'd like to work on this one. Can you assign me?

[MichaelCurrin]

Sure!

I've not implemented a dark mode before and the screenshots of a mock are not accessible (poor contrast). So you can suggest a solution.

Maybe white text on a dark grey background will work and special attention for links, navbar, and codeblocks. I'd also be happy to keep the codeblocks light as in screenshot, as the work to change the highlight.js theme will be more complicated

And a toggle for dark mode. There was recent work to have a global store in store.ts if you want to persist darkMode=false there.

[MichaelCurrin]

For inspiration

• read and set theme https://dev.to/tqbit/create-your-own-dark-mode-toggle-component-with-vue-js-1284
• DarkMode component through vue-a11y https://darkmode.vue-a11y.com/guide/

[minhhang107]

I'll probably use white text for dark mode. And you're right about the codeblock. I've been looking at it and can't find a solution to switch highlight.js theme yet so keeping the light background should be good for now.