The Core Dump

It updates the blog, or it gets the hose again.

CSS goodness for NetNewsWire

One of the many good things about NetNewsWire is that you can tell it to use your own CSS to format the feeds. The official word from Brent Simmons can be found here.

Oliver Boermans went ahead and created a right nifty CSS sheet for NetNewsWire to use, and posted it on his website. After some tweaking of said CSS, I decided to post the results of my labors in case they’ll help somebody else get through their feed reading in the lap of luxury.

Here’s what a feed looks like with the CSS sheet.

The post itself is from BoingBoing. There was of course no way I was going to make a stylesheet for the Mac that doesn’t include text-shadow–oh, it’s so yummy.

The idea for the style sheet itself is to look nice but to not impose itself too much on the reader, but to rather fade into the background and allow the reader to get on with the consumption of feeds.

As the style sheet itself is a bit lengthy, you can find it in the extended body of this post. Please let me know if you use it or create any interesting modifications.

/* Stylesheet for NetNewsWire // http://ranchero.com/netnewswire/ */

/* CSS by Oliver Boermans // http://www.ollicle.com */

/* Modified by Niclas Lindh // http://thecoredump.org */

body { line-height: 1.7em; margin: 0; padding: 0; }

/* Link appearance */a { text-decoration: none; border-bottom: 1px dotted #c30; }

/* Specify link colors - including rollover and visited */a:link { color: #000; }a:visited { border-bottom: 1px dotted #00c; }a:hover { color: #c30; }

/* Assign specific font for titles - overrides NNW preferences */.newsItemTitle { font-family: “Lucida Grande”; font-size: 22px; font-weight: bold; }

/* Set basic parameters for the title */.newsItemTitle a { display: block; width: 94%; padding-left: 20px; padding-top: 10px; padding-right: 10px; padding-bottom: 0px; }

/* Tart up the title /.newsItemTitle a:link { text-shadow: #aaa 3px 3px 2px; / (color, left, down, blur) */ color: black; border: none; background: white; }

.newsItemTitle a:hover { text-shadow: #ccc 3px 3px 2px; color: #c30; border: none; background: white; }

/* Add some page margins for description text */.newsItemDescription { padding-top: 0px; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; max-width: 40em; }

/* Set blockquotes to use a delightful light gray background */blockquote { background-color: #eee; padding: 0.5em 2% 0.5em 2%; }

Posted Friday, 26 December, 2003 by

« Happy Solstice!

 »

Want to comment? I'm @niclindh on Twitter.