Typo in Polkadot Dark Theme

[shawntabrizi]

EDIT:

Also it does not seem to activate

EDIT 2:

Seems you need to be specific with the config

Other combinations of Theme + color scheme do not work right.

[Ben]

@goran could you please look into it?

[goran]

@Ben hi, I have been downgraded to basic user in the meantime, so I don’t have credentials to change anything.

[shawntabrizi]

Seems like dark mode has been removed all together now?

[dmitry.sinyavin]

I see at least four options for dark themes now, however, neither of them gives consistent UI experience. Right now I’ve switched to “Dark” theme and some interface elements are still inherited from light mode which gives glitchy impression to the whole page.

[michel]

Dark theme is currently disabled, because - as you said - it is inconsistent. Hope to change that soon

[NukeManDan]

I am using Dracula and it’s not playing nice FYI, maybe this wasn’t supposed to be supported just yet? may elements colors are not rendering dark but text is doing the “right” thing.

[shawntabrizi]

Seems like we could start at least by not having a pink logo at the top, and just use a transparent image. Let me look into that.

EDIT: It helped, but still too many styles are leaking from the light theme.

[roman_w3f]

@michel @marko ^^ please keep in sync so the changes don’t break other things
@shawntabrizi white logo causing a “missing” polkadot avatar everywhere in the light mode, needs to be fixed differently

there is also a design matrix channel (Michel and Marko both there, currently working on the dark mode):

You're invited to talk on Matrix

[marko]

Hi all,

I’ll be the one working on the CSS for the dark mode and I’ll implement @michel’s design for it. As of right now, what you see is just the default dark mode with no edits made by us, so naturally it won’t look great (but it kind of works).
The way Discourse handles colour themes is a bit awkward to develop for and there are some more issues in general that need to be ironed out (like the logo for example and how css variables are being used) before I can properly make a dark theme work. But we’re on it and we’re grateful for the feedback that all of you gave us so far. You can expect a better looking dark mode very soon.

In the meantime, it’s easier to reach us on Matrix for further feedback like @roman_w3f mentioned.

[marko]

Hi all,

so I fixed a bunch of CSS styling bugs in order to be able to implement a more proper dark mode styling.
It’s very possible that if you browsed the forum within the last few hours you’ve seen some unusual colors popping in and out; that would have been me trying to figure out how to make the forum look equally good in both color schemes.

You’ll notice that the header is not pink anymore – that was done to make the header look closer to the polkadot.network website.

There have been a lot of other small improvements here and there and as usual, please don’t be shy with feedback. Thanks!

[shawntabrizi]

@marko just as an FYI, do you know that discourse has some kind of styleguide page to help with styling?

Styleguide Plugin Now in Discourse Core

[shawntabrizi]

I just enabled the dark mode, and it is looking really good so far.

thanks!

[marko]

I’m gonna be honest, I did not know about that styleguide plugin. I brute-forced my way through the styling by checking all the elements on various pages.

Thanks for the hint though, for future updates I will definitely get this plugin running.

[dmitry.sinyavin]

Yes, it definitely got better, thank you!

Some button backgrounds still seems to be out of sync (I don’t know if it’s on purpose or not) but overall experience is much better now!

[marko]

I’ll have a look at these, thank you.

EDIT: This should be fixed.