Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
hackernews dark mode
/* ==UserStyle==
@name HN Dark Mode
@namespace harryg.codes
@version 1.0.2
@description Dark mode for Hacker News, by [azerella](https://news.ycombinator.com/user?id=azerella)
@author Harry Gallagher <harrygallagher4@gmail.com> (https://keybase.io/harryg)
@license unlicense
@homepageURL https://harryg.codes
@updateURL https://gist.githubusercontent.com/harrygallagher4/025ce9f5767314641b838a9516a07ba3/raw/hn-dark-mode.user.css
@preprocessor less
@var checkbox invert-colors "Invert link/visited colors" 0
@var color default-link "Link color" #8c96ac
@var color default-visited "Visited link color" #979cf4
==/UserStyle== */
@-moz-document domain("news.ycombinator.com") {
@invert: boolean(@invert-colors > 0);
@link-color: if(@invert, @default-visited, @default-link);
@visited-color: if(@invert, @default-link, @default-visited);
body {
background-color: #1F2430;
}
#hnmain {
background-color: #232834;
}
a:link.storylink,
#hnmain > tbody > tr:first-child > td a,
.commtext,
.commtext a:link,
td,
b {
color: #fafafa;
}
.comment > .commtext {
color: #fafafa;
}
td > .title {
color: #fafafa;
}
#hnmain > tbody > tr:first-child > td {
background-color: #333a4a;
}
a:link,
.sitebit,
.subtext,
.sitestr,
.subtext a:link,
.rank,
a.morelink,
.pagetop,
.yclinks a,
.yclinks > a:link,
.comhead a:link,
.comhead,
.hnmore a:link,
.reply a:link {
color: @link-color;
}
td .pagetop {
color: @link-color;
}
td > a:link {
color: @link-color;
}
.title > a:link {
color: @link-color;
}
a > u {
color: @link-color;
}
.comment .reply u > a {
color: @link-color;
}
.title > a:visited {
color: @visited-color;
}
.commtext > p > a:link {
color: #fafafa;
}
.comment .commtext > a:link {
color: #fafafa;
}
.comment .commtext > a:visited {
color: @visited-color;
}
.commtext > p > a:visited {
color: @visited-color;
}
.votearrow {
overflow: visible;
position: relative;
}
.yclinks > a,
.yclinks > a:link {
color: @link-color;
}
.yclinks > a:visited {
color: @visited-color;
}
.votearrow::before {
content: "";
width: 0;
height: 0;
left: 1px;
top: 3px;
display: block;
position: absolute;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-bottom: 7px solid #bebfd1;
}
input[type=text],
textarea {
background-color: #333a4a;
color: #fafafa;
border: 1px solid #1F2430;
}
input[type=submit] {
background-color: #333a4a;
color: #fafafa;
border: 1px solid #1F2430;
}
b {
color: #fafafa;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.