Dark theme in discuss

A wee nit. The logos are black on a black background. No biggie, other than they have associated anchors. Hovering around and looking at the status bar can find them.

Our regular pixls logo? Try a hard refresh, it should be a lighter logo. (If not, which browser/OS?)

By hard refresh, do you just mean F5? Or something else? I’m on Ubuntu 16.04 with Firefox.

Edit: Inspecting the area with a dropper, the background is #111111 and I am getting #0d0d0d as I cross over where the logo is. For me the difference is invisible.

On another system, Windows 10/PaleMoon, I am seeing the background as #111111 and the logo as #030303. The logos are faintly visible there.

Try Ctrl-Shift-R. We need to refresh and clear the cache to check. I’ll fire up my FF/Ubuntu later and test. (Thanks for taking the time to test this!)

Ctrl+Shift+R made no difference for me.

Tried another computer with Ubuntu 16.04/FF, where if I’ve ever been on discuss before it was a long time ago, and it also showed the logo as #0d0d0d.

Looked at my phone (Android/FF) and could not see the logos there either.

Tried opening discuss on Windows in FF and got the same value for the logos (#030303) as I did with PaleMoon on the same system.

FWIW, I would think that a light colored logo would be best in a dark theme. While it’s possible to see #030303 against #111111, it’s pretty faint.

Hmm. This stinks. I’ll fire up my FF later hopefully.

fwiw, here’s what you should be seeing (safari/iOS):

It looks like this on my desktop computer (Firefox 55.0.3 (32-bit); Win7).

Hovering over Blog:

image

I can conform this Firefox bug on KDE neon. I’ll see if I can look at it.

Pictures loaded as shown by FF dev tool:

https://pixls-discuss.s3.amazonaws.com/original/1X/8ef34026c2b938a850419ce2a0f9a8b89cf47702.png

https://pixls-discuss.s3.amazonaws.com/original/1X/8ef34026c2b938a850419ce2a0f9a8b89cf47702.png

As show by QupZilla (webkit)
https://pixls-discuss.s3.amazonaws.com/original/1X/8ef34026c2b938a850419ce2a0f9a8b89cf47702.png
https://pixls-discuss.s3.amazonaws.com/original/1X/8ef34026c2b938a850419ce2a0f9a8b89cf47702.png

If you look at the CSS for #site-logo it looks like it isn’t getting rendered in FF.

@patdavid, this looks lovely. Many thanks! I much prefer how images are perceived in this theme as their shadows aren’t knocked out by the effect of the white on my pupils.

The light version of the logo isn’t showing in Firefox because the content property is in a selector for an element (#site-logo) rather than a pseudo element (e.g., #site-logo::before or #site-logo::after), which is against the spec. Whereas Chrome goes ahead and renders it anyway, Firefox doesn’t.

Ideally, instead of relying on CSS for the logo content you’d have the actual img src reflect the file to be used. If this isn’t possible and you need/want it done via CSS, let me know and I’ll see if I can get it working with a pseudo element selector. Having said that, I think the black logotype on the dark grey background actually works okay - it avoids distraction from the actual content. :slight_smile: But I get why you’d like it white-out, too.

1 Like

Yeah, I wasn’t sure if the content property would fly like that. :wink: Worth a shot.

I’ll dig some more and see if we can’t get it working right (wish we had a means for specifying alt site assets as part of a theme in discourse…). I might try setting the ::before property and see what’s what (failover is create a new node in the dom and overlay the logos).

@patdavid This is awesome! Thanks for the hard work - it looks great on my Nexus 5x! Reading posts before bed will way nicer now!

1 Like

Ok, thank you to everyone that pointed out the missing light logos! I was being kind of lazy and hack-y by abusing a CSS property, and now I’m doing things better (hopefully).

Those of you using FF and the dark theme should now see the correct light logos up top. (Thank you very much @DavidOliver for catching this and keeping me honest. :wink: ).

2 Likes

What’s neat to me is that you can set the dark theme only on specific devices if you want (so light theme on desktop for me, but dark for mobile. neat!).

4 Likes

I was actually reading replies on this thread and the logo went from dark to light before my eyes as the page auto-refreshed. Cool coincidence. :slight_smile:

1 Like

The logo doesn’t size properly on ff mobile :wink: @patdavid

I was just messing with it to get it working right. It should with a fresh load? (otherwise, screengrab if you get a moment).

Oh there it is! Nice

1 Like

I like the dark theme, but the color/brightness difference between the caught-up and unread threads text in the list is very slight—hard for me to distinguish.

The dark theme is very influx, I’ll try and do a bit better :slight_smile:

What does everyone think of this version of the dark theme? The only thing I think I don’t like is the reply button color.

1 Like