Ask HN: Dark mode for HN please?

Post by sexy_seedbox » Sat, May 16, 2020, 1:12 AM UTC

Post by vardump » Sat, May 16, 2020, 1:13 AM UTC

gkoberger wrote: post #76

DoreenMichele wrote: post #66

Earlier quoted context omitted.

Anyone who wants to make a suggestion is welcome to. I'm not a programmer, so I'm probably saying something incredibly, fantastically stupid. Take this in the spirit of "Brainstorming" where you say even the stupid stuff because that sometimes leads to good things. I am not a programmer, but I do know some HTML and CSS and studied it a bit and Blogger (aka Blogspot) let's you dig in the code of the theme if you want,…

I don't think it's a good idea for HN to add this (a lot of work and potential downsides, for minimal returns), however you can do it using this extension! https://chrome.google.com/webstore/detail/witchcraft-jscss-i... I use it for a bunch of minor HN mods already, and it's great :)

Post by ldd » Sat, May 16, 2020, 1:19 AM UTC

ldd wrote: post #75

zainali wrote: post #48

Earlier quoted context omitted.

I'll check this thread but also feel free to email me zain@yc for more feedback - just add [HN FEEDBACK] in the subject :-) don't worry, we'll make sure we don't pull a reddit on you ;)

I replied to the top post, but just in case, here is my idea It uses prefers-color-scheme and 28 lines of CSS: https://pastebin.com/4JYbSi5F

Post by [deleted] » Sat, May 16, 2020, 1:22 AM UTC

ldd wrote: post #70

dang wrote: post #32

Ok, you guys, this isn't the first time we've heard this request ( https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que... ). I'm willing to do it (edit: not to change the default! just to add the option). It's just that any CSS issue that goes more than a quarter-inch deep is outside both my expertise and my interest. We can add CSS to https://news.ycombinator.com/news.css for prefers-color-scheme: dark , bu…

minimal CSS to add (nothing to remove): https://pastebin.com/4JYbSi5F [edit]: fixed, shorter version: https://pastebin.com/dT4KKt3s [edit 2: fixed textarea, dead links: https://pastebin.com/CKy4HQXE ] [edit 3: added a screenshot: https://imgur.com/a/Ont553x ]

Post by kohtatsu » Sat, May 16, 2020, 1:28 AM UTC

dang wrote: post #32

Ok, you guys, this isn't the first time we've heard this request ( https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que... ). I'm willing to do it (edit: not to change the default! just to add the option). It's just that any CSS issue that goes more than a quarter-inch deep is outside both my expertise and my interest. We can add CSS to https://news.ycombinator.com/news.css for prefers-color-scheme: dark , bu…

  @media (prefers-color-scheme: dark) {
      
      body { background-color:#000; }
      #hnmain { background-color:#000; }
      
      a:link { color:#eee; }
      a:visited { color:#b2b2b2; }
      
      .default, .title, .subtext, .yclinks, .comhead { color:#a2a2a2; }
      .admin { color:#eee; }
      .pagetop { color:#222; } /* not inverted */
      
      .c00, .c00 a:link { color:#eee; }
      .c5a, .c5a a:link, .c5a a:visited { color:#a5a5a5; }
      .c73, .c73 a:link, .c73 a:visited { color:#8c8c8c; }
      .c82, .c82 a:link, .c82 a:visited { color:#7d7d7d; }
      .c88, .c88 a:link, .c88 a:visited { color:#777777; }
      .c9c, .c9c a:link, .c9c a:visited { color:#636363; }
      .cae, .cae a:link, .cae a:visited { color:#515151; }
      .cbe, .cbe a:link, .cbe a:visited { color:#414141; }
      .cce, .cce a:link, .cce a:visited { color:#313131; }
      .cdd, .cdd a:link, .cdd a:visited { color:#222222; }
      
      .pagetop a:link, .pagetop a:visited { color: #000; } /* not inverted */
      .topsel a:link, .topsel a:visited { color:#000; }
      .subtext a:link, .subtext a:visited { color:#7d7d7d; }
      .comhead a:link, .subtext a:visited { color:#7d7d7d; }
      .hnmore a:link, a:visited { color:#7d7d7d; }
      
      textarea { background-color: #000; color: #eee; }
      
  }