Dark Theme for REPL

[lukaszpolowczyk]

A trivial thing - dark mode support for REPL.
There is a chance to do it?

[mattpilott]

There is this PR which goes some way to support it sveltejs/svelte-repl#54

Of course additional to a button it would be nice pick up the system setting too

[Tropix126]

quick concept

[Tropix126]

So I could probably work on this if the maintainers want, although there are a lot of implementation questions to be asked. For example the hero artwork used on the homepage is optimized to contrast on light-mode backgrounds only, and some of the site's colors are hardcoded I believe, which means moving some of those over to their own CSS variables.

[bluwy]

@Tropix126 I'd say go ahead and pick this up if you want to. Re the home page, I think we can leave the banner as light mode for now, or perhaps dim it slightly. Re CSS variables, that sounds like a good thing to do for the long term.

It might also be worth having @vedam's opinion too on some design aspects. Setting up a thread in discord contributing may help speed up communication and feedback.

[vedam]

I can only give my personal view on a darkmode here, because we haven't discussed any official stance on it yet.
Besides the technical aspects you mention

• creating more css-vars
• using a proper palette
• how to adapt lightmode images to darkmode
• what does darkmode mean for the sidebars
• how does syntaxhighlighting look like in darkmode
• etc etc

the pure readability factor plays a big role for me and I find long text passages (tutorial, docs etc) in darkmode always much harder to read than in lightmode, because the text starts to flicker (subjectively) the longer I read. Here I am always looking for a lightmode to make things easier for me.

Another aspect in my opinion is that overall with svelte we always emphasize lightness and simplicity, be it in the output or in the developer experience and I think our design should reflect that (in the current version it does). Especially the current examples of a possible darkmode strengthen this impression for me.

For the sake of completeness:
I had also designed a darkmode for the current SvelteKit-template.
kit-template-proposal
We have not discussed the darkmode further.

Don't get me wrong, I don't want to oppose a darkmode in principle, after all it's just an option and the user can decide freely. In my opinion, it does not serve a real purpose.

[benmccann]

I personally like having a dark mode for in the evening. The monitor emits far less light which makes it easier for me to go to bed. During the daytime I prefer light mode. If we skip the homepage in the first iteration to make it easier to implement I think that would be fine.

[aantusahaa]

Since @Tropix126 hasn't responded, I'd like to work on this issue. Should I?