PDA

View Full Version : Changelog: Black background with white text?



Nicholas Steel
11-14-2008, 10:09 PM
Hello, I was wondering if it could be made so the changelog at shardstorm is shown with a black background with white text? To me it would make it much easier to read for extended periods of time.

_L_
11-15-2008, 04:52 AM
My posts aren't that verbose, are they?

Gleeok
11-15-2008, 07:12 AM
Haha wait 'till you get to chapter twelve and find out that LW_HOOKSHOT's father is really non other than...

...well I don't want to spoil it for you. :p

Nicholas Steel
11-15-2008, 08:44 AM
I just think it would make it readable and reduce the chance of damaging peoples eyes from eye strain lol ;), that way you will still have some testers with eye sight when ZC 2.5 comes out :D.

ShadowTiger
11-15-2008, 09:33 AM
Does a temporary Ctrl+A do anything for you? :shrug: That might not be enough.

Saffith
11-15-2008, 11:15 AM
If you're using Firefox, you can just change the default text and background colors in your preferences. And, of course, there's always Greasemonkey.

Nicholas Steel
11-15-2008, 08:23 PM
oooh, nice tips there, thanks :)

EDIT: that changes multiple things, so that isn't a viable solution unless it can be a per page setting >.>"

Pielord
11-15-2008, 11:57 PM
You could just copy everything in MS word then change the text color to white and make the background black.

Revfan9
11-16-2008, 12:24 PM
GreaseMonkey allows you to apply userscripts to individual pages in the form of Javascript. It sounds like a really simple thing to do, but I've never used Javascript a day in my life, so...

I've actually been trying to get into it for a while now, but I can't find any resources that are intuitive. Everything I've been able to get my hands on either:

A. Assumes you've been using Javascript since before the internet was invented.

B. Uses methods that are impractical for GreaseMonkey (Every last resource I've come across has shown everything in the context of how to manipulate your own web pages. With GreaseMonkey, you don't have the ability to modify the web page source yourself.)

After an hour of deciphering tech-speakz, I managed to get this far:

document.body.style.backgroundColor = "#1f1f1f";

Nothing else I've tried with changing the text color has worked. Everything is telling me to assign text color by the body IDs, and the Shardstorm page either doesn't have any or I'm too much of a noob to find them in the source.

pkmnfrk
11-16-2008, 03:19 PM
Dunno, try this:


document.body.style.backgroundColor = "black";
document.body.style.color = "white";

The changelog is a very HTML 3ish page, full of font tags and other nastiness that isn't very hackable, but that should work.

I don't actually have greasemonkey yet, but I'll grab it and test this when I do.

However, I should point out that I prefer the black on white text, myself.

Edit: Yup, works like a charm. However, there's no easy way to change the link colours, or the red timestamps...

Revfan9
11-16-2008, 04:19 PM
How come that didn't work when I tried it with my own code? I hate computers ;-;

pkmnfrk
11-16-2008, 04:25 PM
Not sure, but:

* it's "color", not "Color", "textColor" or any other permutation of "text" and "color".
* it's "black", not "Black", "BLACK", or "0". "#000000" will work as well.
* it's "white", not "White", "WHITE", or "F". "#FFFFFF" will work as well.

Other than that, it's pretty easy.

Revfan9
11-16-2008, 04:59 PM
I tried all sorts of shit, and nothing worked. I also could've sworn that one of the things I tried was exactly the code you have up there, and it didn't work. Though I guess it doesn't matter anymore.

Dark Nation
11-16-2008, 09:44 PM
Use this for your GreaseMonkey script:



// ==UserScript==
// @name White on Black Shardstorm
// @namespace http://www.shardstorm.com/
// @include http://www.shardstorm.com/
// ==/UserScript==
document.body.style.backgroundColor = "black";
document.body.style.color = "white";

Revfan9
11-16-2008, 10:58 PM
I use this one:


// ==UserScript==
// @name Shardstorm Pimpification
// @namespace http://shardstorm.com
// @description Makes the change log page look all cool and stuff...
// @include *.shardstorm.com/*
// ==/UserScript==

document.body.style.backgroundImage="url(http://img291.imageshack.us/img291/4940/sswallue5.jpg)";
document.body.style.color = "#c8c8c8";

(Note: I couldn't find anywhere how to have the image scaled to fit the screen, it just tiles by default, so the image is 1440x900 to match my resolution)

(Another Note: I have no idea how to make the text "Glide" over the image when you scroll up and down. That's what I wanted to do, but again I have failed.)

pkmnfrk
11-17-2008, 01:07 AM
// ==UserScript==
// @name Shardstorm Pimpification
// @namespace http://shardstorm.com
// @description Makes the change log page look all cool and stuff...
// @include *.shardstorm.com/
// leave this at this, unless you want to affect other things than the change log
// ==/UserScript==

document.body.style.backgroundImage="url(http://img291.imageshack.us/img291/4940/sswallue5.jpg)";
document.body.style.backgroundAttachment="fixed";
document.body.style.backgroundRepeat="no-repeat";
document.body.style.color = "#c8c8c8";
document.body.style.color = "black";
document.body.style.backgroundPosition="top center";

This should do what you want. You can make the image smaller, and it'll center it in the top-middle of the screen (and, won't tile any more). Alas, you can't scale it at all. But, you can rely on the black background to fill in the blanks.

To learn more about what you can do, be sure to check out a CSS reference (http://www.w3schools.com/css/css_reference.asp).

To figure out the javascript "name" of a CSS property, just remove dashes (-) in the property name, and then make the next letter capital. Eg, "foo-bar" becomes "fooBar". "zelda-classic" turns into "zeldaClassic". Etc.

Selecting other elements than the body is more difficult (and all but impossible on the change log), but if you wish to learn more, I can teach.

Nicholas Steel
11-17-2008, 03:36 AM
Is Greasemonkey an addon for Firefox?
If you're using Firefox, you can just change the default text and background colors in your preferences.
anyways to make this affect only certain pages with Firefox 3?

EDIT 1: how to add scrips to greasemonkey and how to add http://www.shardstorm.dreamhosters.com/ ? it doesnt add when i add it and it doesnt get added to exluded either, I assume something im doing is wrong.

EDIT 2: Eh, I also tried the exact same formatting as DN and it doesnt work :/

pkmnfrk
11-17-2008, 04:05 AM
For the URL, put "*.shardstorm.com", nothing else. That way, it'll only affect the Change log (and not, say, the wiki).

If you're using DN's version, make sure each comment (line starting with //) is on a separate line.

And, make sure that greasemonkey is enabled (smiling face), not disabled (greyed out frowny face).

Other than those things, it should work.

Nicholas Steel
11-17-2008, 05:38 AM
I figured out why it wasn't working lol, I was just overlooking the fact that I was looking at the full address, http://www.shardstorm.dreamhosters.com/ instead of http://www.shardstorm.com/ ^_^"