[Forum Theme] Toxic Coal (Dark)

[Lone_Wolf]

Toxic Coal Dark Theme

Tired of burning your eyes out with the default white theme? Me too



Installation

• Edge/Internet Explorer users click here
• Install Stylus for Firefox, Chrome, https://addons.opera.com/en-gb/extensions/details/stylus/, or Cascadea for Safari
• Install this theme

Github Repo: https://github.com/Dumpster-Studios/tox ... test-forum

If you for some reason don't like my amazingly perfect outstandingly dark dark theme you could also try these great alternatives:

• Obsidian Minetest Forum by GreenXenith

[philipbenr]

It looks good. The only problem I noticed is the post reply button has green text and green background. (Firefox with Stylus)

[Gael de Sailly]

Nice theme, and very easy to install with Stylus, I did not know this thing.

It looks good. The only problem I noticed is the post reply button has green text and green background. (Firefox with Stylus)

Yeah I have it too, is it normal ?


And, hehe, I know that:

Spoiler

You are using the dark theme!
You are still using the light theme!

[Lone_Wolf]

Update!

• Fixed the 'Post Reply' button (Thanks philipbenr and Gael de Sailly)
• Tweaked link colors a little
• Added the ability for users to customize their colors

Click here to install latest version

[Gael de Sailly]

Yes it's better now, it looks perfect!

But I have non-blocking errors during installation with Stylus:

Code: Select all

87:2 Expected 'auto | optimizeSpeed | optimizeQuality' but found '-moz-crisp-edges'.
89:2 Expected 'auto | optimizeSpeed | optimizeQuality' but found '-webkit-optimize-contrast'.

[Lone_Wolf]

Yes it's better now, it looks perfect!

But I have non-blocking errors during installation with Stylus:

Code: Select all

87:2 Expected 'auto | optimizeSpeed | optimizeQuality' but found '-moz-crisp-edges'.
89:2 Expected 'auto | optimizeSpeed | optimizeQuality' but found '-webkit-optimize-contrast'.

Hmmmm. I guess I don't even need the CSS that causes that error. I'll remove it in the next release. Doesn't seem to be causing any problems atm

[Lone_Wolf]

Update

• Fixed some CSS warnings (Thanks Gael de Sailly)
• Fixed message backgrounds not using the right color
• Changed the color of some grey buttons to green
• Fixed some pages where the theme didn't fully apply
• Fixed weird background in posting page

Install Latest Version

Stylus apparently has an auto-update feature in its settings. You may not need to manually update whenever I release something

[Gael de Sailly]

I noticed two more odd things:

• icode blocks are white, and radically different from code blocks. Is that intended?
• The upload attachment box is also white, and the labels "filename", "file comment", ... are black

[Miniontoby]

wow, how you did this??

Btw i now use this extension for more sites. Thanks

[philipbenr]

The theme is all done by changing the CSS of the website, which can be modified in real time, by the user (client-side). In this case, the add-on "Stylus" is modifying the CSS for the user, applying the theme after the server sends the information.

[Lone_Wolf]

Version 1.1.4

• Fixed icode being white
• Improved attachments box
• Simplified and tweaked some colors for backgrounds/special text

Manual Update

[Lone_Wolf]

(Snuck in a 1.1.5 as my fix for icode broke colors in other elements)

[philipbenr]

The developer tag is very similar to regular user tag. The special tag colors appear to be hardcoded, so I have personally changed the regular user name to text-special instead.

Edit: See lower solution for better results.

[Lone_Wolf]

The developer tag is very similar to regular user tag. The special tag colors appear to be hardcoded, so I have personally changed the regular user name to text-special instead.

I guess I can make the color customizable.

Another solution might be this?

[philipbenr]

If you can easily change it, that's fine. I just didn't see a simple way to change it. Though I suppose I could use a CSS3 filter and just rotate the hue for all the special tags and that would solve everything...

...

This works nicely, though its up to people if they like the purple and blues style, but I am a fan.

Code: Select all

	a.username-coloured {
		font-style: normal;
		filter: brightness(111%);
	}

>>>

Code: Select all

	a.username-coloured {
		font-style: normal;
		filter: brightness(111%) hue-rotate(200deg);
	}
    
 /* Styling for the legend of "who is browsing forums" */
    	.online-list a[style*="color:"]{
        	filter: hue-rotate(200deg);
	}

You could use the same substring selector to customize the names of each to your liking, but I'm fine with just a global rotation.

[ywwv]

sorry but this reminds me of toxic coal dust. you had to wear a mask when those were a threat. I dont like to re-live it . they already have a mask problem. this makes it worse. they're going to tax the air in the future. you wont be allowed to breath anymore. its better for the environment that way. masks will be surgically attached to the face and we will be fed through straws and tubes.

[Lone_Wolf]

sorry but this reminds me of toxic coal dust. you had to wear a mask when those were a threat. I dont like to re-live it . they already have a mask problem. this makes it worse. they're going to tax the air in the future. you wont be allowed to breath anymore. its better for the environment that way. masks will be surgically attached to the face and we will be fed through straws and tubes.

Well there's also the Obsidian theme I link to in the OP. That's also a good dark theme

[Lone_Wolf]

Version 1.2.0

• Another attempt at fixing icode without breaking other things
• Added username-special-colorbackground username-color settings (The first one's in-code name is wrong but I can't be bothered to make a new release purely to fix it)
• Added a rounded light background behind special usernames
• Added support for the notification popup

  

  2021-04-04_17-41.png (119.96 KiB) Viewed 1895 times

• Changed the loading GIF to a rotating Minetest logo (Probably won't notice unless you have really slow internet)

Manual Update