Skip to content

Instantly share code, notes, and snippets.

@Kovah
Last active February 25, 2016 14:23
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Kovah/62a7e16e7534ce939f45 to your computer and use it in GitHub Desktop.
Save Kovah/62a7e16e7534ce939f45 to your computer and use it in GitHub Desktop.
Hacker News Theme Celadon

Hacker News Theme Celadon

Preview

More information

=======================

*, *:before, *:after {
    box-sizing: border-box;
}

* {
    font-family: 'Helvetica', sans-serif;
    font-weight: 300;
}

html {
    font-size: 17px;
}

body {
    font-size: 100%;
    color: #838383;
    padding: 1rem 0;
}

a {
    color: #838383;
}

a:hover {
    color: #424242;
}

table:first-child {
    background: #F8F8F8;
}

table tbody tr:first-child table {
    background: #ABD4C1;
    color: #838383;
    padding: 0 1rem;
    display: block;
}

table.comment-tree tbody tr:first-child table {
    background: none;
}

table tbody tr:first-child table td {
    padding: 0;
    display: block;
}

table tbody tr:first-child .pagetop {
    color: #ABD4C1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

table tbody tr:first-child .pagetop a {
    color: #434343;
    padding: 1rem 0.7rem;
    display: inline-block;
    margin: 0 -4px -1px;
    font-size: 0.9rem;
    border-bottom: 3px solid #ABD4C1;
    transition: border 200ms ease-in-out;
}

table tbody tr:first-child .pagetop a:hover {
    border-bottom: 3px solid #434343;
}

table tbody tr td:last-child > .pagetop {
    color: #434343;
    display: block;
    height: 3.3rem;
}

table tbody tr:first-child table td:first-child {
    display: block;
    padding: 0 1rem 0 0.5rem;
}

table table {
    padding: 1rem;
}

tr.spacer {
    height: 1.4rem;
}

tr.athing td.title {
    font-size: 1rem;
}

tr.athing .rank {
    padding-right: 0.7rem;
    color: #838383;
}

tr.athing .votearrow {
    margin: 0.5rem 0.5rem 0 0;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #9DE0AD;
}

tr.athing .sitebit {
    color: #838383;
    opacity: 0.5;
}

tr td.subtext {
    padding-top: 0.5rem;
    color: #838383;
}

tr td.subtext a, tr td.subtext a:visited {
    color: #434343;
}

table tr:last-child table td {
    background: none;
}

table tr:last-child center {
    font-size: 0.8rem;
}

form table td {
    padding: 0.4rem 0.7rem;
}

form input, form textarea {
    border: 1px solid #ABD4C1;
}

form input[type=submit] {
    background: #ABD4C1;
    padding: 0.6rem 1.2rem;
    font-family: sans-serif;
    cursor: pointer;
}

td.ind {
    max-width: 2rem;
}
@onebree
Copy link

onebree commented Feb 25, 2016

As per the article, you can add the following to make the theme full-width:

body {
    padding: 0;
    margin: 0;
}
table:first-child {
    width: 100%;
}

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