I spent a little time putting together a HackerNews stylesheet. I wanted something clean and with better alignment. For now its just a proof of concept with plenty of bugs on sub-pages, but check it out.
My main goal was to align the most important information for easy skimming. I kept the spacing tight as I enjoy the density. It’ not perfect, I wish I could right-align the points, but I couldn’t figure out a way to do it. Also needs work for sub-pages.
If you’re using Chrome, grab the Stylebot and paste this in:
Update: fixed styling on sub-pages
``` body { margin: 35px 0 0; }
table { background: none; }
/* header */
table td[bgcolor] { margin: 0 0 20px 0; padding: 5px; display: block; background-color: #eee; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; box-sizing: border-box; }
table td[bgcolor] b a { font-size: 12px; width: 99px; }
table td[bgcolor] a { font-size: 12px; }
.pagetop b { margin-right: 20px; }
table tr[style]:nth-child(2) { height: 15px ; }
tbody tr:nth-child(3) table { margin-left: 0; display: block; }
tbody tbody tr:nth-child(3n) { height: 12px ; }
tbody { position: relative; }
/* hide numbering */
tbody tbody td.title:first-child { font-size: 1px; visibility: hidden; }
.title:nth-child(3) { position: relative; z-index: 1; padding: 0 0 2px 0; }
.title a { font-size: 14px; }
.title a:visited { color: #999; }
.subtext { padding: 2px 0; color: #fff; position: relative; }
.subtext * { z-index: 10; color: #444; }
/* points */
.subtext span { font-weight: bold; position: absolute; left: 12px; top: 1px; word-spacing: 40px; white-space: nowrap; width: 50px; overflow: hidden; color: #999; font-size: 11px; z-index: 0; }
/* upvote */
a[id^=up], a[id^=down] { visibility: hidden; }
table table tr:hover a[id^=up], table table tr:hover a[id^=down] { visibility: visible; }
/* under title */
.subtext a { font-size: 11px; color: #999; }
/* url */
.title .comhead { position: absolute; top: 21px; left: 160px; font-size: 10px; width: 100px; text-overflow: ellipsis; overflow: hidden; color: #999; }
/* username */
.subtext a:nth-child(2) { position: absolute; left: 280px; }
/* flag */
.subtext a:nth-child(4) { position: absolute; left: 380px; top: 2px; color: #ccc; display: none; }
.subtext:hover a:nth-child(4) { display: block; }
/* comments */
.subtext a:nth-child(3) { position: absolute; left: 60px; }
/* comments list */
font { line-height: 1.4em; font-family: Georgia; font-size: 14px; } ```
