CF Greasemonkey Themes

mihir · Oct 30, 2011

Ok so how do I begin with this, is there a tutorial or something which I can follow.
I checked out kobaj's code.
Like in the code below how do I know the class names and other stuff?
Thanks

Feedback: I like the black one but the text boxes feel weird otherwise everything else looks fine

Code:

 // ==UserScript==
// @name Change Color
// @namespace com.kobaj
// @description Change the Color of CoFo
// @include http://www.computerforum.com*
// ==/UserScript==

var numberofthemes = 4;

//TODO
//get and set link colors
//get and set post box/comment box.

//dun touch this
//********************************//
var options = [];
for (var i = 0; i < numberofthemes; i++)
{
	options = options.concat(document.createElement('option'));
}

//overview
//********************************//
//name of your theme 

options[0].innerHTML = "Dark";
options[1].innerHTML = "White";
options[2].innerHTML = "default";
options[3].innerHTML = "Invert";

//********************************//
//specials
var smallfontText = ["#ffffff", "#000000", "", "#ffffff"];
var timeText = ["#ffffff", "#000000", "", "#ffffff"];

var tborderColor = ["#000000", "#000000", "", "#ffffff"];


//********************************//
//quickreply

var panelSurroundColor = ["#555555", "#ffffff", "", "#000000"];
var panelColor = ["#555555", "#ffffff", "", "#111111"];

//********************************//
//tcat 

var tcatColor = ["#222222", "#ffffff", "", "#202020"];
var tcatText = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//.alt2 .alt2active #headerbar

var alt2Color = ["#444444", "#ffffff", "", "#0E0E0E"];
var alt2Text = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//alt1 alt1active

var alt1Color = ["#666666", "#ffffff", "", "#000000"];
var alt1Text = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//page body

var pageColor = ["#888888", "#ffffff", "", "#333333"];
var pageText = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//thead bands of color

var prefColor = ["#000000", "#ffffff", "", "#E0A22E"];
var prefText = ["#ffffff", "#000000", "", "#ffffff"];

//put it all together!
//********************************//

var thead = document.getElementsByClassName('thead');
var tfeet = document.getElementsByClassName('tfoot');
var vbmenu_control = document.getElementsByClassName('vbmenu_control');

var tcat = document.getElementsByClassName('tcat');

var alt2 = document.getElementsByClassName('alt2');
var alt2active = document.getElementsByClassName('alt2Active'); 
var headerbar = document.getElementById('headerbar'); 

var alt1 = document.getElementsByClassName('alt1');
var alt1active = document.getElementsByClassName('alt1Active');

var page = document.getElementsByClassName('page');

var panelSurround = document.getElementsByClassName('panelsurround');
var panel = document.getElementsByClassName('panel');

var smallfont = document.getElementsByClassName('smallfont');
var time = document.getElementsByClassName('time');

var tborder = document.getElementsByClassName('tborder');

//links

//functions
//********************************//
var index = 0;

function ChangeBackgroundColors(elementsT, inputColor)
{
	var i=0;
	for (i=0;i<elementsT.length;i++)
	{
		elementsT[i].style.setProperty("background", inputColor, "important");
	}
	return;
}

function ChangeTextColors(elementsT, inputColor)
{
	for(var i = 0; i < elementsT.length; i++)
	{
		elementsT[i].style.setProperty("color", inputColor, "important");
	}
	return;
}


function SetAllBackgrounds()
{
	ChangeBackgroundColors(thead, prefColor[index]);
	ChangeBackgroundColors(tfeet, prefColor[index]);
	ChangeBackgroundColors(vbmenu_control, prefColor[index]);
	
	ChangeBackgroundColors(tcat, tcatColor[index]);
	
	ChangeBackgroundColors(alt2, alt2Color[index]);
	ChangeBackgroundColors(alt2active, alt2Color[index]);
	//ChangeBackgroundColors(headerbar, alt2Color[index]);
	headerbar.style.setProperty("background", alt2Color[index], "important");
	
	ChangeBackgroundColors(alt1, alt1Color[index]);
	ChangeBackgroundColors(alt1active, alt1Color[index]);
	
	ChangeBackgroundColors(page, pageColor[index]);
	//ChangeBackgroundColors(document.body, pageColor[index]);
	document.body.style.setProperty("background", pageColor[index], "important");
	
	ChangeBackgroundColors(panelSurround, panelSurroundColor[index]);
	ChangeBackgroundColors(panel, panelColor[index]);
	
	ChangeBackgroundColors(tborder, tborderColor[index]);
}

function SetAllText()
{
	ChangeTextColors(thead, prefText[index]);
	ChangeTextColors(tfeet, prefText[index]);
	ChangeTextColors(vbmenu_control, prefText[index]);
	
	ChangeTextColors(tcat, tcatText[index]);
	
	ChangeTextColors(alt2, alt2Text[index]);
	ChangeTextColors(alt2active, alt2Text[index]);
	headerbar.style.setProperty("color", alt2Text[index], "important");
	
	ChangeTextColors(alt1, alt1Text[index]);
	ChangeTextColors(alt1active, alt1Text[index]);
	
	ChangeTextColors(page, pageColor[index]);
	document.body.style.setProperty("color", pageText[index], "important");
	
	ChangeTextColors(smallfont, smallfontText[index]);
	ChangeTextColors(time, timeText[index]);
	
	//and just about the worst way to handle link color. Oh well.	
	var links = document.getElementsByTagName( 'a' );
	for ( var i = 0; i < links.length; i++ ) 
	{
        links[i].style.color = pageText[index];
    }
}

function SetTThings()
{
	SetAllBackgrounds();
	SetAllText();	
}

GetState();

SetTThings();

//********************************//
//DropDownMenu

var selectionBox = document.createElement('select');

function OnChange()
{
  var myIndex  = selectionBox.selectedIndex;
  //var selValue = selectionBox.options[myIndex].value;
  index = myIndex;
  SetTThings();
  SaveState();
}

selectionBox.name = "ColorChooser";
selectionBox.addEventListener("change", function(e){OnChange()},false);

for(var i = 0; i<options.length;i++)
{
	selectionBox.appendChild(options[i]);
}

document.body.appendChild(selectionBox);

//********************************//
//save state

function SaveState()
{
	GM_setValue("cofoColorChoice2",index);
}

function GetState()
{
	index = GM_getValue("cofoColorChoice2");
	if(index == null)
	{
		index = 0;
	}
	
	options[index].selected = "selected";
}

kobaj · Oct 30, 2011

mihir said:
Ok so how do I begin with this, is there a tutorial or something which I can follow.
I checked out kobaj's code.
Like in the code below how do I know the class names and other stuff?
Thanks

Feedback: I like the black one but the text boxes feel weird otherwise everything else looks fine

This should help you out with class names.

mihir · Oct 30, 2011

Thanks

mep916 · Oct 31, 2011

kobaj, we can't make any changes to the images, aside from removing them, is that correct? so no color changes or anything like that?

mihir · Oct 31, 2011

I think we can.
Try running this script

PHP:

// ==UserScript==
// @name Change Color
// @namespace com.kobaj
// @description Change the Color of CoFo
// @include http://www.computerforum.com*
// ==/UserScript==

var numberofthemes = 4;
var images = document.getElementsByTagName ("img");
var x =0;
while(x<2)
{
	images[x].src = "http://s3.amazonaws.com/files.posterous.com/temp-2011-04-14/zptxFBfswmDIGruppDJGhtxkmEDIzbksvxlfzrxkenhsgdoopGseqJtalkbn/done.png.scaled500.png?AWSAccessKeyId=AKIAJFZAE65UYRT34AOQ&Expires=1320080554&Signature=%2FRgkE9LVptY2BSI2XBs34QwFiLA%3D";
	x=x+1;
}

//TODO
//get and set link colors
//get and set post box/comment box.

//dun touch this
//********************************//
var options = [];
for (var i = 0; i < numberofthemes; i++)
{
	options = options.concat(document.createElement('option'));
}

//overview
//********************************//
//name of your theme 

options[0].innerHTML = "Dark";
options[1].innerHTML = "White";
options[2].innerHTML = "default";
options[3].innerHTML = "Invert";

//********************************//
//specials
var smallfontText = ["#ffffff", "#000000", "", "#ffffff"];
var timeText = ["#ffffff", "#000000", "", "#ffffff"];

var tborderColor = ["#000000", "#000000", "", "#ffffff"];


//********************************//
//quickreply

var panelSurroundColor = ["#555555", "#ffffff", "", "#000000"];
var panelColor = ["#555555", "#ffffff", "", "#111111"];

//********************************//
//tcat 

var tcatColor = ["#222222", "#ffffff", "", "#202020"];
var tcatText = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//.alt2 .alt2active #headerbar

var alt2Color = ["#444444", "#ffffff", "", "#0E0E0E"];
var alt2Text = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//alt1 alt1active

var alt1Color = ["#666666", "#ffffff", "", "#000000"];
var alt1Text = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//page body

var pageColor = ["#888888", "#ffffff", "", "#333333"];
var pageText = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//thead bands of color

var prefColor = ["#000000", "#ffffff", "", "#E0A22E"];
var prefText = ["#ffffff", "#000000", "", "#ffffff"];

//put it all together!
//********************************//

var thead = document.getElementsByClassName('thead');
var tfeet = document.getElementsByClassName('tfoot');
var vbmenu_control = document.getElementsByClassName('vbmenu_control');

var tcat = document.getElementsByClassName('tcat');

var alt2 = document.getElementsByClassName('alt2');
var alt2active = document.getElementsByClassName('alt2Active'); 
var headerbar = document.getElementById('headerbar'); 

var alt1 = document.getElementsByClassName('alt1');
var alt1active = document.getElementsByClassName('alt1Active');

var page = document.getElementsByClassName('page');

var panelSurround = document.getElementsByClassName('panelsurround');
var panel = document.getElementsByClassName('panel');

var smallfont = document.getElementsByClassName('smallfont');
var time = document.getElementsByClassName('time');

var tborder = document.getElementsByClassName('tborder');

//links

//functions
//********************************//
var index = 0;

function ChangeBackgroundColors(elementsT, inputColor)
{
	var i=0;
	for (i=0;i<elementsT.length;i++)
	{
		elementsT[i].style.setProperty("background", inputColor, "important");
	}
	return;
}

function ChangeTextColors(elementsT, inputColor)
{
	for(var i = 0; i < elementsT.length; i++)
	{
		elementsT[i].style.setProperty("color", inputColor, "important");
	}
	return;
}


function SetAllBackgrounds()
{
	ChangeBackgroundColors(thead, prefColor[index]);
	ChangeBackgroundColors(tfeet, prefColor[index]);
	ChangeBackgroundColors(vbmenu_control, prefColor[index]);
	
	ChangeBackgroundColors(tcat, tcatColor[index]);
	
	ChangeBackgroundColors(alt2, alt2Color[index]);
	ChangeBackgroundColors(alt2active, alt2Color[index]);
	//ChangeBackgroundColors(headerbar, alt2Color[index]);
	headerbar.style.setProperty("background", alt2Color[index], "important");
	
	ChangeBackgroundColors(alt1, alt1Color[index]);
	ChangeBackgroundColors(alt1active, alt1Color[index]);
	
	ChangeBackgroundColors(page, pageColor[index]);
	//ChangeBackgroundColors(document.body, pageColor[index]);
	document.body.style.setProperty("background", pageColor[index], "important");
	
	ChangeBackgroundColors(panelSurround, panelSurroundColor[index]);
	ChangeBackgroundColors(panel, panelColor[index]);
	
	ChangeBackgroundColors(tborder, tborderColor[index]);
}

function SetAllText()
{
	ChangeTextColors(thead, prefText[index]);
	ChangeTextColors(tfeet, prefText[index]);
	ChangeTextColors(vbmenu_control, prefText[index]);
	
	ChangeTextColors(tcat, tcatText[index]);
	
	ChangeTextColors(alt2, alt2Text[index]);
	ChangeTextColors(alt2active, alt2Text[index]);
	headerbar.style.setProperty("color", alt2Text[index], "important");
	
	ChangeTextColors(alt1, alt1Text[index]);
	ChangeTextColors(alt1active, alt1Text[index]);
	
	ChangeTextColors(page, pageColor[index]);
	document.body.style.setProperty("color", pageText[index], "important");
	
	ChangeTextColors(smallfont, smallfontText[index]);
	ChangeTextColors(time, timeText[index]);
	
	//and just about the worst way to handle link color. Oh well.	
	var links = document.getElementsByTagName( 'a' );
	for ( var i = 0; i < links.length; i++ ) 
	{
        links[i].style.color = pageText[index];
    }
}

function SetTThings()
{
	SetAllBackgrounds();
	SetAllText();	
}

GetState();

SetTThings();

//********************************//
//DropDownMenu

var selectionBox = document.createElement('select');

function OnChange()
{
  var myIndex  = selectionBox.selectedIndex;
  //var selValue = selectionBox.options[myIndex].value;
  index = myIndex;
  SetTThings();
  SaveState();
}

selectionBox.name = "ColorChooser";
selectionBox.addEventListener("change", function(e){OnChange()},false);

for(var i = 0; i<options.length;i++)
{
	selectionBox.appendChild(options[i]);
}

document.body.appendChild(selectionBox);

//********************************//
//save state

function SaveState()
{
	GM_setValue("cofoColorChoice2",index);
}

function GetState()
{
	index = GM_getValue("cofoColorChoice2");
	if(index == null)
	{
		index = 0;
	}
	
	options[index].selected = "selected";
}

Just added this part

var images = document.getElementsByTagName ("img");
var x =0;
while(x<2)
{
images[x].src = "http://s3.amazonaws.com/files.posterous.com/temp-2011-04-14/zptxFBfswmDIGruppDJGhtxkmEDIzbksvxlfzrxkenhsgdoopGseqJtalkbn/done.png.scaled500.png?AWSAccessKeyId=AKIAJFZAE65UYRT34AOQ&Expires=1320080554&Signature=%2FRgkE9LVptY2BSI2XBs34QwFiLA%3D";
x=x+1;
}

We can just set the if condition for every image in order we need to change.

Check the Cofo Logo

Cromewell · Oct 31, 2011

mep916 said:
kobaj, we can't make any changes to the images, aside from removing them, is that correct? so no color changes or anything like that?

The buttons around the edit box are changable. But the rest probably not. edit: imagebutton is the class you want to change

Cromewell · Oct 31, 2011

Code:

// ==UserScript==
// @name Change Color
// @namespace com.kobaj
// @description Change the Color of CoFo
// @include http://www.computerforum.com*
// ==/UserScript==

var numberofthemes = 4;

//TODO
//get and set link colors
//get and set post box/comment box.

//dun touch this
//********************************//
var options = [];
for (var i = 0; i < numberofthemes; i++)
{
    options = options.concat(document.createElement('option'));
}

//overview
//********************************//
//name of your theme 

options[0].innerHTML = "Dark";
options[1].innerHTML = "White";
options[2].innerHTML = "default";
options[3].innerHTML = "Invert";

//********************************//
//specials
var smallfontText = ["#ffffff", "#000000", "", "#ffffff"];
var timeText = ["#ffffff", "#000000", "", "#ffffff"];

var tborderColor = ["#000000", "#000000", "", "#ffffff"];


//********************************//
//quickreply

var panelSurroundColor = ["#555555", "#ffffff", "", "#000000"];
var panelColor = ["#555555", "#ffffff", "", "#111111"];

//********************************//
//vbulletin_editor
var editorPanelColor = ["#333333", "#ffffff", "", "#000000"];

//********************************//
//tcat 

var tcatColor = ["#222222", "#ffffff", "", "#202020"];
var tcatText = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//.alt2 .alt2active #headerbar

var alt2Color = ["#444444", "#ffffff", "", "#0E0E0E"];
var alt2Text = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//alt1 alt1active

var alt1Color = ["#666666", "#ffffff", "", "#000000"];
var alt1Text = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//page body

var pageColor = ["#888888", "#ffffff", "", "#333333"];
var pageText = ["#ffffff", "#000000", "", "#ffffff"];

//********************************//
//thead bands of color

var prefColor = ["#000000", "#ffffff", "", "#E0A22E"];
var prefText = ["#ffffff", "#000000", "", "#ffffff"];

//put it all together!
//********************************//

var thead = document.getElementsByClassName('thead');
var tfeet = document.getElementsByClassName('tfoot');
var vbmenu_control = document.getElementsByClassName('vbmenu_control');

var tcat = document.getElementsByClassName('tcat');

var alt2 = document.getElementsByClassName('alt2');
var alt2active = document.getElementsByClassName('alt2Active'); 
var headerbar = document.getElementById('headerbar'); 

var alt1 = document.getElementsByClassName('alt1');
var alt1active = document.getElementsByClassName('alt1Active');

var page = document.getElementsByClassName('page');

var panelSurround = document.getElementsByClassName('panelsurround');
var panel = document.getElementsByClassName('panel');

var smallfont = document.getElementsByClassName('smallfont');
var time = document.getElementsByClassName('time');

var tborder = document.getElementsByClassName('tborder');

var vbEditor = document.getElementsByClassName('vBulletin_editor');
var vbEditorButtons = document.getElementsByClassName('imagebutton');

//links

//functions
//********************************//
var index = 0;

function ChangeBackgroundColors(elementsT, inputColor)
{
    var i=0;
    for (i=0;i<elementsT.length;i++)
    {
        elementsT[i].style.setProperty("background", inputColor, "important");
    }
    return;
}

function ChangeTextColors(elementsT, inputColor)
{
    for(var i = 0; i < elementsT.length; i++)
    {
        elementsT[i].style.setProperty("color", inputColor, "important");
    }
    return;
}


function SetAllBackgrounds()
{
    ChangeBackgroundColors(thead, prefColor[index]);
    ChangeBackgroundColors(tfeet, prefColor[index]);
    ChangeBackgroundColors(vbmenu_control, prefColor[index]);
    
    ChangeBackgroundColors(tcat, tcatColor[index]);
    
    ChangeBackgroundColors(alt2, alt2Color[index]);
    ChangeBackgroundColors(alt2active, alt2Color[index]);
    //ChangeBackgroundColors(headerbar, alt2Color[index]);
    headerbar.style.setProperty("background", alt2Color[index], "important");
    
    ChangeBackgroundColors(alt1, alt1Color[index]);
    ChangeBackgroundColors(alt1active, alt1Color[index]);
    
    ChangeBackgroundColors(page, pageColor[index]);
    //ChangeBackgroundColors(document.body, pageColor[index]);
    document.body.style.setProperty("background", pageColor[index], "important");
    
    ChangeBackgroundColors(panelSurround, panelSurroundColor[index]);
    ChangeBackgroundColors(panel, panelColor[index]);
    
    ChangeBackgroundColors(tborder, tborderColor[index]);
	
	ChangeBackgroundColors(vbEditor, editorPanelColor[index]);
	ChangeBackgroundColors(vbEditorButtons, editorPanelColor[index]);
}

function SetAllText()
{
    ChangeTextColors(thead, prefText[index]);
    ChangeTextColors(tfeet, prefText[index]);
    ChangeTextColors(vbmenu_control, prefText[index]);
    
    ChangeTextColors(tcat, tcatText[index]);
    
    ChangeTextColors(alt2, alt2Text[index]);
    ChangeTextColors(alt2active, alt2Text[index]);
    headerbar.style.setProperty("color", alt2Text[index], "important");
    
    ChangeTextColors(alt1, alt1Text[index]);
    ChangeTextColors(alt1active, alt1Text[index]);
    
    ChangeTextColors(page, pageColor[index]);
    document.body.style.setProperty("color", pageText[index], "important");
    
    ChangeTextColors(smallfont, smallfontText[index]);
    ChangeTextColors(time, timeText[index]);
    
    //and just about the worst way to handle link color. Oh well.    
    var links = document.getElementsByTagName( 'a' );
    for ( var i = 0; i < links.length; i++ ) 
    {
        links[i].style.color = pageText[index];
    }
}

function SetTThings()
{
    SetAllBackgrounds();
    SetAllText();    
}

GetState();

SetTThings();

//********************************//
//DropDownMenu

var selectionBox = document.createElement('select');

function OnChange()
{
  var myIndex  = selectionBox.selectedIndex;
  //var selValue = selectionBox.options[myIndex].value;
  index = myIndex;
  SetTThings();
  SaveState();
}

selectionBox.name = "ColorChooser";
selectionBox.addEventListener("change", function(e){OnChange()},false);

for(var i = 0; i<options.length;i++)
{
    selectionBox.appendChild(options[i]);
}

document.body.appendChild(selectionBox);

//********************************//
//save state

function SaveState()
{
    GM_setValue("cofoColorChoice2",index);
}

function GetState()
{
    index = GM_getValue("cofoColorChoice2");
    if(index == null)
    {
        index = 0;
    }
    
    options[index].selected = "selected";
}

Changes the editor box and buttons around it. The smiley faces aren't fully transparent around the borders, and there is a mouse over which changes the button color that I haven't found yet.

edit: It looks like the mouseover function is firing in vbulletin_global.js but it is a minimized script and my tidy program isn't working on it. Will try updating it later.

kobaj · Nov 1, 2011

mep916 said:
kobaj, we can't make any changes to the images, aside from removing them, is that correct? so no color changes or anything like that?

They can be changed, see Mihir's post. The only caveat is that the image you want to replace with must be hosted somewhere.

Cromewell said:
*snip*

I've uploaded your edit/post/comment/whateveritscalled/box code to the userscript page. I spent about an hour trying to get the dang boxes to change box to the background color after mouseover and was unsuccessful. I'll leave that up to you. I found a few other bugs I need to get myself anyway.

mihir · Nov 1, 2011

kobaj said:
They can be changed, see Mihir's post. The only caveat is that the image you want to replace with must be hosted somewhere.

They can be hosted on the CoFo server itself I guess.

kobaj said:
I've uploaded your edit/post/comment/whateveritscalled/box code to the userscript page. I spent about an hour trying to get the dang boxes to change box to the background color after mouseover and was unsuccessful. I'll leave that up to you. I found a few other bugs I need to get myself anyway.

I found when you edit a post, it loses the color scheme after you save it.

Cromewell · Nov 1, 2011

mihir said:
I found when you edit a post, it loses the color scheme after you save it.

This is because the script runs on page ready but new posts come in via an ajax call which doesn't reload the page. I'm sure there is a way around that, but you can just reset the theme and it will update the new post. Anything that works that way is affected, editing posts, making new ones with the quick reply, etc.

I spent about an hour trying to get the dang boxes to change box to the background color after mouseover and was unsuccessful. I'll leave that up to you.

I'll look at it again when I get a chance.

Cromewell · Nov 2, 2011

After trying off and on for the last day or so (with no results

) to get the mouseover to highlight a different color or at worst return it to the color we are setting I'm going to take a bit of a break. Going through all those JS files to find the name of the event handler to replace it with my own was maddening

kobaj · Nov 3, 2011

Cromewell said:
After trying off and on for the last day or so (with no results ) to get the mouseover to highlight a different color or at worst return it to the color we are setting I'm going to take a bit of a break. Going through all those JS files to find the name of the event handler to replace it with my own was maddening

Eh, I was approaching it a slightly different way.

PHP:

function replaceQuick()
{
var quickbox = document.getElementById('vB_Editor_QR_controls');
if (quickbox != null)
var td = quickbox.childNodes[1].childNodes[1].childNodes[0].childNodes;
for(var i=0; i < td.length; i++)
{
if(td[i].nodeName == "TD")
{
	td[i].childNodes[0].innerHTML = "<span style=\"background:" + editorPanelColor[index] + ";visibility:visable;padding:0;height:100%;width:100%;display:block;\">" + td[i].innerHTML + "</span>";
}
}

Which kinda works, but not really.

mep916 · Nov 3, 2011

I'm really impressed with what we have so far. Thanks guys. It always seems difficult to get something like this off the ground. Sorry I haven't been able to assist with the code effort. I know absolutely nothing about js, and very little HTML (took an old intro course in community college), so in the hours it would have took me to learn the basics, you guys cranked out some workable material.

lucasbytegenius · Nov 11, 2011

Well I'm trying to make the width of the forum smaller, but apparently the width was coded into the HTML, which Stylish can't change apparently

kobaj · Nov 11, 2011

lucasbytegenius said:
Well I'm trying to make the width of the forum smaller, but apparently the width was coded into the HTML, which Stylish can't change apparently

Do you mean something like this?

lucasbytegenius · Nov 12, 2011

kobaj said:
Do you mean something like this?

Yes exactly

kobaj · Nov 12, 2011

lucasbytegenius said:
Yes exactly

What size do you want? I'll make you a grease monkey/theme for it.

lucasbytegenius · Nov 12, 2011

kobaj said:
What size do you want? I'll make you a grease monkey/theme for it.

85% please

kobaj · Nov 12, 2011

lucasbytegenius said:
85% please

And done.

EVERYONE, If I could have your attention please!

Version 4 of the cofo color changer is released and available for download.

Change log:
Added Theme Green
Added Theme Red
Modified other Themes slightly
Added 85% width checkbox
Fixed a few bugs with font color
Fixed a few of the post box bugs

Enjoy (though if someone wants to spruce up green and red to make them more than what they currently are, feel free).

Also, let this be a testament and proof that if you request something (like 85% width) I will deliver!

Machin3 · Nov 12, 2011

Not to promote other forums, but overclock.net just redid their site and it looks great. IMHO, cf should be looking into modernizing the site. Just a thought though.

CF Greasemonkey Themes

VIP Member

VIP Member

VIP Member

Administrator

VIP Member

Administrator

Administrator

VIP Member

VIP Member

Administrator

Administrator

VIP Member

Administrator

Well-Known Member

VIP Member

Well-Known Member

VIP Member

Well-Known Member

VIP Member

New Member