• entries
    222
  • comments
    608
  • views
    588240

Back in Classic Black

Sign in to follow this  
benryves

1448 views

I've been working on a "classic black" style for the GameDev.net website for a little while. Being a creature of habit I could never get used to the lighter skins that the site has tended towards in recent years.

forum-index.png

topic-index.png

topic-post.png



GameDev.net is a large site and I haven't checked every page yet, so it is highly likely that you'll end up with some white text on white backgrounds or black text on black backgrounds. Unfortunately it seems that people are using inline colours more with the new system which I can't do much about through CSS, however !important I try to make the rule.

The stylesheet can be found here: classic-black.css. Firefox users can install Stylish and use benryves_classic-black-fixed-userstyle.css (many thanks to coldacid for this version and for fixing some bugs). I'm not sure how other browsers deal with user stylesheets (guides for IE indicated that the stylesheet would be loaded on every site, which isn't much use), I'm afraid, but in Opera you can right-click the page, select Edit site preferences and then select the stylesheet at the bottom of the Display tab.

For browsers that can't apply user stylesheets to specific websites, here's a bookmarklet that applies the stylesheet when clicked. Drag the link to your bookmarks, then visit a page on GameDev.net and click the link to apply the style. It's only temporary (and will be lost when you change page) but it is at least a preview.

If anyone tries this, I'd be happy to hear any feedback (especially bug reports!) I didn't write all of the CSS by hand; certain rules were set up in an INI file which is then "compiled" with a little command-line tool (usage: "CSS Compiler" classic-black.ini classic-black.css). The tool has no error handling whatsoever and will keel over if you so much as look at it funny but it sped up the process quite considerably.
Sign in to follow this  


42 Comments




Recommended Comments

[quote name='swiftcoder' timestamp='1296253357']
I like it. A Lot.
[/quote]
Thank you, and thank you for providing a handy post to include in the screenshot. :)

[quote name='Black Knight' timestamp='1296258676']
The bookmarklet doesn't work for me but the theme is really nice much better than the white version.
[/quote]
Sorry to hear that - I tried it in Firefox and IE. I'm not sure if these browsers provide ways to load custom stylesheets, though. A slightly more useful (yet still inelegant) approach is [url=http://members.gamedev.net/benryves/classic_black/gdnet-classic-black.user.js]this Firefox userscript[/url], which does the same thing as the bookmarklet but will run automatically on any *gamedev.net/* pages. Unfortunately, there'll be a brief flash of the default white theme before the additional stylesheet is applied, but it's the best I can think of in the short term!

Edit: Please see px's post below for better information for Firefox users. :)

Share this comment


Link to comment
Ahh, bliss. I was suffering along with a userscript that blackified a couple of things but this is much, [i]much [/i]better.

So, when do we get it as a theme selection? ;)

Share this comment


Link to comment
Firefox users rejoice!

Go to [url="https://addons.mozilla.org/en-US/firefox/addon/stylish"]https://addons.mozilla.org/en-US/firefox/addon/stylish[/url] and install the Styish add-on. Once installed you'll have a new icon in the bottom right corner if you Firefox window. Go to the gamedev (errr.... I guess you're already here...) and click the new icon. Select "Write new style..." then "For www.gamedev.net..." In the window that pops up give your script a name, then inside the { } copy&paste the code from [url="http://members.gamedev.net/benryves/classic_black/classic-black.css"]http://members.gamedev.net/benryves/classic_black/classic-black.css[/url] and hit save.

Yay black GD.net

Thanks benryves!

Share this comment


Link to comment
Just noticed it needs some work for the tracker and for Showcase... If I get a chance to figure it out, I'll post some CSS to tack on. No guarantees that I'll get around to it, though.

Share this comment


Link to comment
Works wonderfully and I love it!

The only thing I've noticed so far is replies to status updates in profiles. The background and text are both white and the user's name is yellow, so you can't read it at all. 'status_mini_content' and 'status_action_right' I think are the DIV classes (not positive though.)

Thanks for this!

Share this comment


Link to comment
Sorry for the MediaFire links, but I can't find how to just upload to here. Anyway, I've made a few adjustments to take care of the things I was complaining about, and while it's not perfect, we're a little bit closer to complete coverage of the new version of the site. Anyway:

* [url="http://www.mediafire.com/download.php?04nf0qd711u12ap"][url="http://www.mediafire.com/download.php?4mq1oyp1e919sto"]Regular version[/url][/url] which replaces regular classic-black.css
* [url="http://www.mediafire.com/download.php?jvpnc213ub8s9wb"][url="http://www.mediafire.com/download.php?ao7d648pi3a01ua"]Userstyle[/url][/url] for people who have Stylish installed

Ben, feel free to host these yourself here, in fact I insist on it.

[b]UPDATED:[/b] Fixing the problem Programmer16 reported. New links.

Share this comment


Link to comment
Many thanks, coldacid - I've replaced the file with your version and added a version for Stylish users.

Programmer16: If you have a screenshot (or a link to a page where the problem occurs) I'd be happy to look into it; I haven't been able to replicate the issue myself.

Share this comment


Link to comment
Looks great!

For Chrome, the Stylebot extention seems to work fine with it - [url="https://chrome.google.com/extensions/detail/oiaejidbmkiecgbjeifoejpgmdaleoha"]Stylebot[/url].

Just click the icon at the top while at a www.gamedev.net page, and then click 'edit css'. From there, just copy & paste the CSS file

Share this comment


Link to comment
[quote name='Ravyne' timestamp='1296359986']
Looks nice! Any chance we can get the proper authorities to add it to the official style selector?
[/quote]
I second this notion!

Share this comment


Link to comment
Thank you for all the kind comments!

Cheers for fixing that issue, coldacid: I've uploaded your fixes and also added another one for the weird-looking "Community Links" box on the "Community" page.

Share this comment


Link to comment
any way we can get this as an official sheet? gamedev as it is, is nearly unusable for me, and i don't feel like dicking around with my browser settings to get this to work.

Share this comment


Link to comment
Awesome. I noticed it wasn't working for the user profiles Latest Visitors and Comments on Status Updates (or at least not in Chrome). Added the Following:
[code]...
body#ipboard_body .general_box li.row1 {
background-color: #2C2C30 !important;
}
/***** ADDED THIS FOR ROW2 ****/
body#ipboard_body .general_box li.row2 {
background-color: #252525 !important;
}
/* Tab bars */
...[/code]


Then also this:
[code]...
/***** ADDED THIS TO THE END OF PROFILE ****/

body#ipboard_body .status_profile_actions .row1 {
background-color: #2C2C30 !important;
}
body#ipboard_body .status_profile_actions .row2 {
background-color: #252525 !important;
}
/* Galleries */
...[/code]


Colours may not match up with the profile yet (I just randomly picked a darker colour for row2).

Share this comment


Link to comment
And judging by the nasty colours in the code blocks I'd also recommend something a little more readable there:

[code]...

body#ipboard_body pre.prettyprint {
color: #333 !important;
}
/****** ADD SOME PRETTY PRINT COLOURS *******/
body#ipboard_body pre.prettyprint .com {
color: #D00 !important;
}
body#ipboard_body pre.prettyprint .pun {
color: #00D !important;
}
/* Polls */
...[/code]

Share this comment


Link to comment
Many thanks, dwarfsoft, I've added your fixes to the above linked files. I'm also glad to see that the code highlighter is capable of detecting and highlighting puns.

Share this comment


Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now