Stylish (re)design of Cigarcyclopedia's Comparison Shopper

[Ivanovich]

This is basically for Firefox users nerdy 'puter h4x0r5 anal-retentive designer types who can't leave poor readability alone.

I've spent the past year on CP Reading More and Posting Less. It really is useful to just shut-up and listen. This week I finally fixed something that's been bugging me about Cigarcyclopedia's Comparison Shopper and figured a few others might be interested.

Firstly, if you haven't checked out the Comparison Shopper, it's worth a look for pricing boxes of sticks you may be looking for online. Beware, though, the page can take a couple minutes to load due to the volume of data it's rendering (in a single gigantic TABLE no less–an excel doc saved as HTML, ugh).

If you have been there (at least with Firefox) you may have seen the same alignment problems I did:

Okay, so the data isn't impossible to read, but I'm a designer damnit and I just couldn't not notice. So, I whipped up a Stylish redesign in a few lines of CSS and tada...

Alternating table rows highlighted – columns re-aligned. All is well. It's not perfect (one background image for the entire table instead of starting new for each brands' line) but it works.

If you're a Firefox (or Opera or Greasmonkey) user, you can install the Stylish extension/add-on and feel free to use my design. (I'm not concerned about the bandwidth for the background image being served off my site. I have a kick-ass web host.)
Stylish Extension site
my Cigarcyclopedia userstyle page

Enjoy.

...and I slip back to quietly Reading More.

 

[MX]

OK, so I am a new Firefox user, how do I make this work on my browser?

Tim

 

[Ivanovich]

OK, so I am a new Firefox user, how do I make this work on my browser?

Tim

No problem:
1. go to the Stylish Extension install page anc click "Install Now"
2. A little window should appear counting down for 3 or 4 seconds before downloading and installing the extension.
3. After being in stalled, you'll need to restart the browser
4. After restart, go to the UserStyle installer page and scroll down and click on "Load into Stylish"
5. Little windown pops up, click "Save". All done.

6. If you get to the Comparison Shopper page and it doesn't look like it's fixed, look for the Stylish icon on your browser, maybe the bottom right corner. It looks like a white document with a paintbrush on it. Click once on that menu, there should be a listing for "Cigarcyclopedia rows and alignment" there with a checkmark next to it. No checkmark? Click on it to activate it.

 

[MX]

Thx