Dark Theme revised

Try this. Instead of your original:

	/* No Colored Bars for Categories */
	.category-list tbody .category {
		border-left: 0 solid;
		border-left-width: 0;
	}

This should work:

	.category-list .category {
		border-left: none !important;
	}

That’s what I used for the same thing and it works. The !important may be necessary with Stylish (not sure) since it is necessary with userContent.css if overriding one of the site’s declarations (not necessary for declarations which do not actually override something on the site).

That might be the problem with the bullets too (I left the !important off the code for those).

Anyway, time for dinner. :slight_smile:

Some very early feedback:

  • The font is a bit tiny for my personal preference
  • It might be worth making the ‘last visit’ divider orange for better visibility?

Ctrl+scroll / not sure if mac would be cmd + scroll/wipe or what. Basically zooming/scaling should work with discourse fine. Not to say that adjusting the default is a bad idea but might offer an opportunity to test diferent scaling percentages.

edit: right, pinching gesture should work too. Doh.

On my 15" 1080p laptop screen a 150% zoom looks about right to me. Thing is this is bound to be subjective. For an example on my desktop 23" 1080p screen the default 100% is fine. This is why modern websites are designed to be scalable.

Had that, but if you have a lot of threads with unread posts - also orange in color - that divider will get lost visually…

And since the “new post” and “unread post” texts and bullets are also blue, I figured it falls within the same category of information (what happened since my last visit) = visual coherence.

2 Likes

That makes sense! I feel that the white categories in the ‘latest posts’ column on the homepage have more ‘weight’ than the orange titles. Perhaps the categories should be toned down a little? And when a post is already read and turns grey, the white category name definitely takes all the focus.

Yeah, perhaps a little “off-white” color would be better.

That’s an issue the default color scheme has as well to a certain degree (top default, bottom mine):

11-05-_2018_13-45-06

An argument could be made to make the category names smaller in the “Latest” column?

1 Like

How about this (not yet live, just in my browser):

2 Likes

Looks pretty good. Personally I’d put the “1 New” etc over at the right. That way they’d look neater if you have a lot of them, and would be all in the same vertical line instead of chasing the ends of board names.

By the way, I’m live testing your CSS now and those edits I suggested do seem to work at my end, as long as the !important is added to the one to ditch the bullets. This is only a temporary measure while we’re playing with overrides. The !important would be unnecessary and undesirable in a finished site theme.

This may seem like pointless pedantry, but having had to deal with a fair bit of it I have a thing about using the least amount of CSS necessary, and as non-specific as possible. It makes customisation easier, especially if you’re doing it on top of existing site code like we are now. It also makes files a bit shorter, which gets to be a thing when they’re up around 5,000 lines.

1 Like

But as I said, I think this will require adding additional divider lines to guide the viewers eyes, as it may otherwise not be clear which subcategory the “1 New” refers to at first glance… Something like this:

7 posts were split to a new topic: Renaming the ‘Coding’ categories

wow … great work guys!
looks awesome!

Version on Stylish updated with the recent changes.

Yes, but I’d prefer it that way. Not that we need to argue if most people prefer it the other way. I can just do my own tweaks anyway.

From the addon’s description:

We care about your privacy and thus it is important to us that you understand our data practices:
Stylish provides you with services that include the suggestion of and access to relevant styles for web pages you visit, as well as the install count for each style. In order to enable this service, we collect browsing data, as detailed in our privacy policy: https://userstyles.org/login/policy

The browsing usage data collected includes: visited URLs, your Internet Protocol address, your operating system and the browser you are using, and the date and time stamp.

The data collected is not collected nor used to allow the identification of any individual user, and you may always opt-out from this automatic data collection in the add-on option page.

That is why I prefer using Stylus, a fork that doesn’t collect anything.