PDA

View Full Version : New dark Forums Skin



bonzodog
September 16th, 2007, 02:35 PM
We have finally coded a dark grey forums skin via the Stylish Extension for Firefox.

http://xs219.xs.to/xs219/07370/ubuntuforumsgrey.png.xs.jpg (http://xs.to/xs.php?h=xs219&d=07370&f=ubuntuforumsgrey.png)

It can be found here:

http://userstyles.org/styles/3440
AND
http://userstyles.org/styles/3441

The theme is in two pieces -- it was simply too big to fit into one.

So, you cannot just save it from the userstyles page into stylish, as the code has to be edited slightly.

To do this, i suggest you go to the first part, and click 'show code'.

Right click on the Stylish icon in Firefox, and click 'manage styles'.

Click on 'Write..'

this will open a new clean area to compose code into. At the top, call the theme 'ubuntuforums grey'.

Then, go back to the page with the code for the first part on show, highlight all the code, and paste using middle click into the style editor. Remove the bit of code from the bottom of the first section..

Go back to the userstyles page, and change the last part of the web address to a 1, that will take you to the second half of the skin. Again, click show code, then highlight it, and middle click paste it into the style editor, and remove those first couple of lines of code that it says to.

Save the code, and you should now have the skin. :D

racoq
September 16th, 2007, 03:05 PM
i'm an web designer, and i don't find quite appealing the "Ubuntu forums" font color statement near the ubuntu logo.

If the background of the forum is grey then the black color of the "Ubuntu Forums" font, its easily confused with the gray background color.

I think that the color of "Ubuntu Forums" should be white to contrast away from the grey background color.

curuxz
September 16th, 2007, 03:12 PM
personaly (again im a web dev too) I dont like it, but the idea of a dark one for high contrast accessablity reasons may be a good idea :)

bonzodog
September 16th, 2007, 09:47 PM
You might have a good point there about the logo. I'm not sure whether we can alter the color of the text in the image, but it might be worth a try.

There may be various bugs and minor faults in this skin, as there is just so much detail to the forums.

Stylish works by re-rendering the site after it gets to your browser through the modified code.

So, keep us informed of anything else you find, and me and 'interestedinthepenguin' who actually authored the skin will see if a mod is possible. I have a feeling he now knows almost as much as ubuntugeek about the Vb theming, and if that skin is anything to go by, it's no wonder that ubuntugeek is a bit cautious about writing new skins!

Interestedinthepenguin
September 17th, 2007, 01:16 AM
I've updated both pieces of the style.

The link is in my sig.

bonzodog
September 17th, 2007, 04:25 PM
ooh, yes, thats better. Cool. :D

smartboyathome
September 17th, 2007, 04:30 PM
I think you should change the font color, it feels a little too "blue" for me on that grey background.

bonzodog
September 17th, 2007, 04:33 PM
I think you should change the font color, it feels a little too "blue" for me on that grey background.

I actually thought the blue links were quite good, and contrasted nicely.

The skin was modelled around another one used on digg. The main text font (all non-linkable text) is an offwhite, where as we have a cyan/blue for anything linkable.

Interestedinthepenguin
September 17th, 2007, 05:54 PM
I think you should change the font color, it feels a little too "blue" for me on that grey background.

What color do you want it to be?

Edit: To change the links' color, find the portion of the code that says /**links**/ (it's near the middle), and change hex number after 'color:'.

shznit
September 28th, 2007, 09:57 AM
how can i change the main font color to white? the light gray doesnt contrast very well with the darker gray background. thanks for the style.

Interestedinthepenguin
September 28th, 2007, 11:02 AM
how can i change the main font color to white? the light gray doesnt contrast very well with the darker gray background. thanks for the style.

Find the portion labeled /**text**/ (just before /**links**/), and change #b5b5b5 to #ffffff.

:)