Skip to content

Instantly share code, notes, and snippets.

@roryokane
Created August 24, 2012 19:39
Show Gist options
  • Save roryokane/3454874 to your computer and use it in GitHub Desktop.
Save roryokane/3454874 to your computer and use it in GitHub Desktop.
Comfy Hacker News (from https://comfy-helvetica.jottit.com/user-CSS) with bugfixes
html {zoom:1.32;}
img, a[href=news] {zoom:.76;}
/* choose one: */
body * {font-family:'Helvetica Neue', Helvetica, 'Liberation Sans', sans-serif !important;}
/* body * {font-family:Palatino, 'Liberation Serif', Georgia, serif !important;} */
a[href=news] {font-family:Palatino, 'Liberation Serif', Georgia, serif !important;}
code {font:10px/1.5 Menlo, monospace !important;}
a:link {color:#222 !important;}
form {padding:0 1em;}
td[style='width:18px;padding-right:4px'] a[href='http://ycombinator.com']:after {
content:"Y";
font-family:Tahoma;
position:relative;
top:3em;
left:-1.55em;
color:#fff;
background: #ff6600; /* Old browsers */
background: -moz-linear-gradient(left, #ff6600 80%, #cc5500 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(80%,#ff6600), color-stop(100%,#cc5500)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #ff6600 80%,#cc5500 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #ff6600 80%,#cc5500 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, #ff6600 80%,#cc5500 100%); /* IE10+ */
background: linear-gradient(to right, #ff6600 80%,#cc5500 100%); /* W3C */
border-right:#a40 solid 1px;
padding:1px 6px;
}
img[src='y18.gif'] {
display:none;
position:relative;
top:4.2em;
right:3em;
height:36px !important;
width:36px !important;
}
a[href=news] {
font-size:1.45em;
line-height:9px;
letter-spacing:-1px;
margin-right:2em;
margin-left:-.75em;
color:#333 !important;
text-shadow:#f6f6ef -1px 0 0;
font-weight:200;
}
td[bgcolor] {
padding-top:1em;
padding-bottom:1em;
}
td[bgcolor='#ff6600'], td[bgcolor='#ffffff'] {
background: -moz-linear-gradient(top, #ffffff 28%, #f6f6ef 72%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(28%,#ffffff), color-stop(72%,#f6f6ef)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 28%,#f6f6ef 72%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 28%,#f6f6ef 72%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 28%,#f6f6ef 72%); /* IE10+ */
background: linear-gradient(to bottom, #ffffff 28%,#f6f6ef 72%); /* W3C */
}
center>table>tbody>tr>td>center {
background: -moz-linear-gradient(top, #f6f6ef 80%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,#f6f6ef), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #f6f6ef 80%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #f6f6ef 80%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #f6f6ef 80%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom, #f6f6ef 80%,#ffffff 100%); /* W3C */
}
.topsel a {
color:#222 !important;
font-weight:600;
}
span.pagetop {
color:#bbb !important;
font-size:.8em !important;
}
span.pagetop b {
font-size:2em;
font-weight:normal;
}
td.title a:visited {text-shadow:#fff 0px 1px 2px;}
td.title a {
background-color:#eee;
padding:0 3px;
margin:0 -3px;
}
td.title a[rel=nofollow] {background-color:#ddd;}
td.title a[href$=pdf] {background-color:#ccf;}
td.subtext span {
margin-right:15px;
margin-left:-78px;
display:block;
float:left;
width:64px;
text-align:right;
color:#dcb;
}
td.title .comhead {color:#f60!important;}
td[colspan='1'] {width:36px;}
tr[style='height:5px'] {height:7px;}
td.title a[href^=\/x], input[type=submit] {
color:#fff !important;
border:none;
background: #ff6600; /* Old browsers */
background: -moz-linear-gradient(top, #ff7722 0%, #ff6600 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7722), color-stop(100%,#ff6600)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ff7722 0%,#ff6600 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ff7722 0%,#ff6600 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ff7722 0%,#ff6600 100%); /* IE10+ */
background: linear-gradient(to bottom, #ff7722 0%,#ff6600 100%); /* W3C */
border-top:#fb8 solid 1px;
border-bottom:#d60 solid 1px;
}
td.title[align=right] {
padding:.22em .1em 0 1em;
font-weight:200;
font-size:.62em !important;
}
center a img {
position:relative;
top:-.1em;
padding:3px 4px;
margin:0 2px;
}
center>a img:hover {background:#fff;}
center>font[color='#ff6600'] {
padding:3px 4px;
margin:0 2px;
position:relative;
top:.8em;
}
td.default div {margin-top:.7em !important;}
.comhead {font-weight:300;}
.comhead a {font-weight:normal;}
.comhead span {color:#bbb;}
span.comment, span.comment p, span.comment font[color] {
color:#222 !important;
line-height:1.2em;
padding-right:1em !important;
}
span.dead, span.dead p, span.dead font[color] {
color:#ddd !important;
}
/* based on the version last modified Friday, April 27, 2012 */
/* from https://comfy-helvetica.jottit.com/user-CSS */
@roryokane
Copy link
Author

commit 1789e4: added version and source information to the bottom, in comments

commit 785c82: made gradients cross-platform, by recreating them in Ultimate CSS Gradient Generator

commit 4d866a: put alternate font in the source commented-out so it’s easier to switch

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment