• There is NO official Otland's Discord server and NO official Otland's server list. The Otland's Staff does not manage any Discord server or server list. Moderators or administrator of any Discord server or server lists have NO connection to the Otland's Staff. Do not get scammed!

[Working] Userscript theme for OTland [Few lines of code]

macronus

Web Developer and Linux System Manager
Joined
Mar 24, 2013
Messages
87
Reaction score
11
Location
Croatia
Alright so here is a simple and easy OTland darker theme for all of your pleasures as I have seen that people want a darker theme and that they can't wait so I jumped upon a userscript and made it so it changes CSS code of the website so the colors are greysih. If you want some custom colors or if you want me to develop this even further surely contact me tell me give me feedback. If you want I can make a gui where you can select colors for certain areas.

I'm sorry if its ugly but Its done in like 10 minutes and its pretty simple anyone can read it here is the code.

Installation link: http://userscripts.org/scripts/show/177344

More info at the bottom, Greasemonkey or Tampermonkey requeired.

Code:
// ==UserScript==
// @[USER=19950]Name[/USER] Otland Dark theme
// @namespace http://otland.net/* http://otland.net/threads/* http://otland.net/conversations/*
// @[USER=6271]Include[/USER] http://otland.net/*
// @version 1
// @match *://otland.net/*
// ==/UserScript==

// injectCSS("a{text-decoration: none;}") 

function injectCSS(cssdata) 

{ 

head = document.getElementsByTagName("head")[0]; 

style = document.createElement("style"); 

style.setAttribute("type", 'text/css'); 

style.innerHTML = cssdata; 

head.appendChild(style); 

} 

injectCSS("#content{background-color: rgb(30,30,30);}")


injectCSS(".mainContent{background-color: rgb(200,200,200);}")
injectCSS(".sectionMain{background-color: rgb(200,200,200);}")
injectCSS(".nodeList .categoryForumNodeInfo, .nodeList .forumNodeInfo, .nodeList .pageNodeInfo, .nodeList .linkNodeInfo {background-color: rgb(200,200,200);}")


injectCSS(".nodeIcon{display: none;}")


injectCSS(".primaryContent a{color: rgb(30,30,30);}")
injectCSS("a:link, a:visited{color: rgb(30,30,30);}")
injectCSS("#content .pageContent{background-color: rgb(150,150,150);}")
injectCSS("#pageDescription{color: rgb(50,50,50);}")

injectCSS(".PanelScroller .scrollContainer, .PanelScrollerOff .panel{display: none;}")


injectCSS(".message{background-color: rgb(200,200,200) ;}")
injectCSS(".messageList .message{background-color: rgb(200,200,200) ;}")
injectCSS(".message .messageContent{background-color: rgb(200,200,200) ;}")
injectCSS(".primaryContent{background-color: rgb(200,200,200) ;}")
injectCSS(".body .muted a{color: rgb(0,0,0) ;}")
injectCSS("body .muted, body a.muted, body .muted a {color: rgb(30,30,30) ;}")
injectCSS(".body .muted a{color: rgb(30,30,30) ;}")
injectCSS(".Popup subForumsPopup{display:none;}")
injectCSS(".pairs dt, .pairsInline dt, .pairsRows dt, .pairsColumns dt, .pairsJustified dt{color: rgb(80,80,80) ;}")
injectCSS(".discussionListItem{background-color: rgb(200,200,200);}")
injectCSS(".discussionListItem .posterAvatar, .discussionListItem .stats{background-color: rgb(200,200,200);}")

Here are images most imporant part of this whole thing!

Image 1: General list.
qRUzz7g.png


Image 2: Sub list.
81GL4lD.png


Image 3: Posts.
Ro5JKjR.png


Now comes the hard part. You need to have Greasemonkey for Firefox or Tampermonkey for google chrome.

These plugins are small and provide much user usabilty you can change pretty much anything client side.

Here is how to install them.

Greasemonkey tutorial: http://imacify.com/2011/07/how-to-install-greasemonkey-add-on-on-firefox/

Tampermonkey tutorial: http://ooiks.com/blog/mousehunt-aut...-google-chrome-through-tampermonkey-extension

So after you got them you just go to this sit where userscript is or you can use the code to add it manualy and click INSTALL.

http://userscripts.org/scripts/show/177344

Keep in mind you are not downloading anything here just using code above if you want to add the code manually you can using this tutorials:

MANUAL ADDITION for Greasemonkey : http://www.fimfiction.net/blog/56868/how-to-manually-install-a-greasemonkey-script

MANUAL ADDITION for Tampermonkey: There are no tutorial but its the same process as for Greasemonkey for Firefox :)


If you need help sure tell me also thanks is appriciated but not required! You are free to edit, modify, sell and do whatever you want with this small bad but effective script!
 
Last edited:
What? Still dont work?
I have updated the code with match all so it should work now :) Try going to greasemonkey/tamper monkey and deleting old one if it does not work after installation or manual addition :)
 
I have updated the code with match all so it should work now :) Try going to greasemonkey/tamper monkey and deleting old one if it does not work after installation or manual addition :)
yea works now :) Only thing that is annoying is that its first loading in the original theme and then it loads the plugin etc so it blinks when u click in on stuff ^^
 
yea works now :) Only thing that is annoying is that its first loading in the original theme and then it loads the plugin etc so it blinks when u click in on stuff ^^

Can't really do anthing about that :) Atleast is a fix untill a new theme that can last up to few months :) Enjoy!
 
Back
Top