3 ms·

Show HN: Darker News for Safari (Dark Mode for Hacker News)

11 points by willswire 5y ago

gnicholas 5y ago
Cool! How is this different from other HN apps? I think there is room to innovate here — I have an iPhone and iPad, and I check HN many times daily. But after trying several apps, I always go back to the web. I haven't found one that makes it intuitive/easy to comment, upvote, downvote, collapse/expand, and search. UI improvements like dark mode are certainly a plus also!
- willswire 5y ago
  As a Safari Web Extension, this app is actually intended for use alongside the ole' faithful web version of HN. I found myself in the same boat as yourself - trying other HN clients, but always coming back to the web version. But DAMN! the lack of dark mode kills... so I built this small CSS injector plugin to help :) Speaking of which... I found a few minor adjustments that still need to be done w/ regards to the CSS rules (for example, reply links are still dark text in dark mode; oops).
  - gnicholas 5y ago
    Ah, I didn't understand that this wasn't an iOS app. Now I get it! So this is just for desktop Safari? I think there are general-purpose dark mode extensions for Chrome/Firefox that are pretty popular, but it's quite possible that they don't handle all the unique bits of HN (collapse triangles, etc.)
    - willswire 5y ago
      Yes - that's correct! Those were my thoughts too; that maybe a general-purpose dark mode extension for Safari would work nicely, but the ones I found costed $$$ and I didn't want to have to pay for something I could easily code myself. Appreciate your thoughts on comments on this!
sampsa 5y ago
Hello everyone. I would like to advertise my small iOS app that has has dark mode and reader mode for articles. I made it for my own use case and I think it suits the topic perfectly. https://apps.apple.com/app/hakkeri-readable-hacker-news/id1115084104 https://apps.apple.com/app/hakkeri-readable-hacker-news/id11...
- gnicholas 5y ago
  I get the desire to post this here, but if everyone with a HN app posted here, it would drown out the discussion on this person's tool. I'm mentioning this instead of downvoting your comment since your karma indicates you are probably new-ish here.
foolproofplan 5y ago
Just installed for Safari and enabled but not seeing the Dark Mode applied on Hacker News. Am I missing something here?
- willswire 5y ago
  Try flipping your macOS theme thru control center. Hacker News won't go dark unless the system UI is set to it.
deleted 5y ago
[deleted]
hivacruz 5y ago
Really cool. Browsing HN at night was painful on my Macbook. It's a shame we need an extension for this, a few CSS lines could fix this while keeping the website small. By the way, I think some of your CSS rules need to be fixed. Contrasts between elements for example. When looking at comments, the username has a foreground of #828282 and the background is #161618. That's a 4.7:1 ratio. You pass the AA level but not the AAA level, which requires a 7:1 ratio for small texts: https://webaim.org/resources/contrastchecker/?fcolor=828282&bcolor=161618 https://webaim.org/resources/contrastchecker/?fcolor=828282&...
- willswire 5y ago
  Thank you so much for catching this!! I’ll post an update this week fixing that CSS rule (and make sure to give credit where it’s due in the change log ;)
anosidium 5y ago
I love that you posted a part of the source code on the last screenshot. It is quite ingenious. It is nice to see a Safari extension! It is quite rare.
- willswire 5y ago
  Appreciate your comment - thanks! Yes, I wanted to make sure people saw how lightweight the app was.

11 points by willswire 5y ago

Cool! How is this different from other HN apps? I think there is room to innovate here — I have an iPhone and iPad, and I check HN many times daily. But after trying several apps, I always go back to the web. I haven't found one that makes it intuitive/easy to comment, upvote, downvote, collapse/expand, and search. UI improvements like dark mode are certainly a plus also!

willswire 5y ago
As a Safari Web Extension, this app is actually intended for use alongside the ole' faithful web version of HN. I found myself in the same boat as yourself - trying other HN clients, but always coming back to the web version. But DAMN! the lack of dark mode kills... so I built this small CSS injector plugin to help :) Speaking of which... I found a few minor adjustments that still need to be done w/ regards to the CSS rules (for example, reply links are still dark text in dark mode; oops).
- gnicholas 5y ago
  Ah, I didn't understand that this wasn't an iOS app. Now I get it! So this is just for desktop Safari? I think there are general-purpose dark mode extensions for Chrome/Firefox that are pretty popular, but it's quite possible that they don't handle all the unique bits of HN (collapse triangles, etc.)
  - willswire 5y ago
    Yes - that's correct! Those were my thoughts too; that maybe a general-purpose dark mode extension for Safari would work nicely, but the ones I found costed $$$ and I didn't want to have to pay for something I could easily code myself. Appreciate your thoughts on comments on this!

sampsa 5y ago

Hello everyone. I would like to advertise my small iOS app that has has dark mode and reader mode for articles. I made it for my own use case and I think it suits the topic perfectly. https://apps.apple.com/app/hakkeri-readable-hacker-news/id1115084104 https://apps.apple.com/app/hakkeri-readable-hacker-news/id11...

gnicholas 5y ago
I get the desire to post this here, but if everyone with a HN app posted here, it would drown out the discussion on this person's tool. I'm mentioning this instead of downvoting your comment since your karma indicates you are probably new-ish here.

foolproofplan 5y ago

Just installed for Safari and enabled but not seeing the Dark Mode applied on Hacker News. Am I missing something here?

willswire 5y ago
Try flipping your macOS theme thru control center. Hacker News won't go dark unless the system UI is set to it.

deleted 5y ago

[deleted]

hivacruz 5y ago

Really cool. Browsing HN at night was painful on my Macbook. It's a shame we need an extension for this, a few CSS lines could fix this while keeping the website small. By the way, I think some of your CSS rules need to be fixed. Contrasts between elements for example. When looking at comments, the username has a foreground of #828282 and the background is #161618. That's a 4.7:1 ratio. You pass the AA level but not the AAA level, which requires a 7:1 ratio for small texts: https://webaim.org/resources/contrastchecker/?fcolor=828282&bcolor=161618 https://webaim.org/resources/contrastchecker/?fcolor=828282&...

willswire 5y ago
Thank you so much for catching this!! I’ll post an update this week fixing that CSS rule (and make sure to give credit where it’s due in the change log ;)

anosidium 5y ago

I love that you posted a part of the source code on the last screenshot. It is quite ingenious. It is nice to see a Safari extension! It is quite rare.

willswire 5y ago
Appreciate your comment - thanks! Yes, I wanted to make sure people saw how lightweight the app was.