Show HN: I made a modern web UI for Hacker News | Hacker News Reader

Show HN: I made a modern web UI for Hacker News

modernhn.com

308 pointssjdz198 comments

Hey HN,

I made this free browser extension that modernizes the Hacker News design.

I previously launched Modern for Wikipedia [1] here back in December, and it seemed like the obvious next choice to build one for HN too! So I've taken what I learned from building that, and have spent all my spare time this year building Modern for HN.

I realize this won't be for everyone, but it was a fun project to work on, and I'm really happy with the result so far. Hope you like it too!

Lots more planned for future updates, and suggestions welcome :)

[1] https://news.ycombinator.com/item?id=29461735

Open articleView on HN

I kinda come here because it doesn't have this :)

But this is the good thing about it, people can extend it as they wish.

I love it. I wonder if it's possible to do this by proxying requests to HN instead of a Chrome extension -- that way I don't have to bloat the browser's start-up time and don't have to "worry" about this extension spying on other websites, even though I realize it's unlikely, it's good principle to not have to give this permission.

It's possible, but as I mentioned in another comment, building this as an extension has some added benefits [1].

> that way I don't have to bloat the browser's start-up time and don't have to "worry" about this extension spying on other websites, even though I realize it's unlikely

No need to worry about that, as it's limited by the permissions specified in the extension manifiest. So this extension can only access news.ycombinator.com and extensionpay.com to facilitate the Pro upgrade.

[1] https://news.ycombinator.com/item?id=32769145

I wish this were more of an SPA with an account system/db of it's own, I'd even pay for a subscription (small one). I'd basically like there to be a mobile app and desktop version that no matter where I read an article, it's marked read. I use materialize and hckrnews now, if both of these could keep track of the same bookmarks, visited links, and maybe allow note taking or creating groups of saved things, that'd be awesome. Also notifications and a messaging system like reddit has would be cool...in fact I just want a redditized HN experience lol.

Cool ideas! It would definitely be possible to build in a cloud sync feature at some point to enable those features.

> it's good principle to not have to give this permission.

Well consider that when you go to a proxied version of HN, you're essentially giving an opaque server "permission" to view all your traffic it sends to HackerNews... but you can't verify what it's doing with that

At least this extension states exactly what permissions it needs, and I can inspect it and see what it's doing...

There's [Hackerweb](https://hackerweb.app/) which uses the HN API and does some clever stuff delegating to a webview.

Thanks for sharing! I love this skin, the dark mode is really easy on my eyes. And the threading is really nice too.

Depends on what you mean by "proxying". Everything you do (serving a Single-Page Application or requesting HN by backend, processing it's HTML and sending the content to your own frontend) will take traffic away from news.ycombinator.com and to another domain - which comes with it's own set of dreadful scenarios.

There used to be (and still are) things like https://mreidsma.github.io/bookmarklets/jquerify.html which allow to inject JavaScript on click (and thus would make it possible to transform that site), but I gave it a shot and HN is set up to disallow this:

  Refused to load the script 'https://code.jquery.com/jquery.min.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' https://www.google.com/recaptcha/ https://www.gstatic.com/recaptcha/ https://cdnjs.cloudflare.com/". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

I use hckrnews.com but it only changes the start page.

To be fair, I wish HN had a substantially bigger font, for phone reading.

That's about my only complaint.

Oh, and way bigger links for my big thumbs

> To be fair, I wish HN had a substantially bigger font, for phone reading.

On desktop, HN is the only website that I have "zoomed". 120%, btw.

Ah, mostly the same for me! (I'm very happy with it this way and wouldn't expect the site to change). But I do this on a couple of other text-heavy sites also, but not many.

So often a zoom will break complicated UI layouts and their JS interactions, so I appreciate the simplicity of this site allowing my user agent to customise my experience and still have it work.

Number one should be larger up/down buttons. Not much larger, but just big enough.

I zoom in via my phone’s browser and it works well

> But this is the good thing about it, people can extend it as they wish.

You would think that but no. The HTML is so full of tables everywhere that it's not that easy to do anything creative with it. I'm pretty sure that's why some features such as collapsing comments took so long to be implemented (and not because "not collapsing forces you to read")

I really like the current simple design of HN, my only issue with it is how ridiculously zoomed out it is by default. I've been viewing HN at 150% zoom for as long as I can remember.

I apparently set HN to 150% so long ago and had gotten so used to it I didn't even realize that I had until reading this comment.

Just tried 100% out of curiosity and you're right, it's ridiculous.

Hm, dunno. Just tried out zoomed in to 150% and switched it back. I like having more text on the page without scrolling. Esp given how wordy people get get here, and as the nesting grows.

But I guess to each their own. +1 for loving simplicity of current design though.

For me, I dislike that it is not in dark mode without some userscript

A toggle switch would be very nice for night time reading.

I am viewing the standard version of HN at 270% on a 4K screen. The main reason is not the font size but the layout.

Only at that zoom level would the page span the entire width of the screen and wrap the text around.

120% here. I suddenly feel very young.

Hah, I have particularly bad eyesight and HN and Terminal are both around 175% normal (12pt) zoom levels.

I only have an average bad eyesight, but I still prefer ridiculously zoomed text. My focus simply is always on very little code or text at a time, so I don’t see the point of not utilising my screens fully.

Same here.

Firefox on iPhone/iOS can't zoom text (a long time open request.) Therefor it's impossible to this website with it. Kind of ridiculous.

Is it really so hard to create a proper default layout? Text size seems so basic...

The current design is simple but lacking imo. Font size is small, not touch friendly. Also annoying that a single new line doesn't do anything, you need to have two. Doesn't make sense at all.

> Also annoying that a single new line doesn't do anything, you need to have two. Doesn't make sense at all.

This is how markdown works, so it feels natural to me (although then the differences from markdown become apparent...)

I view HN at 200% Getting old :/

I've always felt bad about 133% and this thread is putting things in perspective for me

I use 200% and I'm in my 20s. Nothing wrong with reading comfortably!

I normally use 160%, I love this site.

The following is not any sort of critique on the author’s work. The design looks quite fresh, in fact. This is merely a tangential observation.

Anyone else see the mock-up and think “this looks slow”?

Logically, it’s not a defensible inference in the slightest. There’s nothing about this design that would necessitate performance tradeoffs. But that’s the barely-conscious, emotional first impression I had.

I wonder if there’s something about “modern” design (or a specific subset thereof) that correlates with subpar performance.

I had your exact same reaction.

Related story: In my free time I am a coach for a competitive math team, I recently had to design an application to automate multiple choice problem submissions. Nothing stellar, your run-of-the-mill CRUD app. But it was under some interesting engineering constraints: users would have to log in from a variety of devices, phones, tablets, bad chromebooks, etc., possibly on slow cellular connections.

So naturally I went for a simple server-rendered design, with stock Bootstrap hosted on a CDN.

The overwhemling reaction was "this is so fast". Now, being server-rendered with absolutely no XHR, the app spends most of the time doing nothing, but it's interesting laymen think it's fast.

I think we came to associate "modern" designs with piles of javascript, requests everywhere, popups, ads, and the like.

Probably the correlation is indeed there, even if it's obviously not causation.

A few years ago I learned to code using YouTube how to videos and stackoverflow. I made a Saas for the industry I work in. I use php, bootstrap and jQuery. I even built it as a SPA technically.

It is faster than basically any modern CRM in existence.

30+ companies use it daily. It runs in a namecheap shared hosting for $4 a month.

The ability of simple server-side applications to solve problems quickly and efficiently is vastly underrated these days.

> Anyone else see the mock-up and think “this looks slow”?

It just looks clumsy and distracting compared to plain HN, IMHO. It highlights elements like usernames, the total amount of comments(!) or the upvote/favorite actions, that users will only rarely interact with or even want to look for. Meanwhile other actions have to be hidden beneath a "…" widget, lest the page become too cluttered. The factory HN look does a much better job of bringing the comment text into focus and reflects the threading hierarchy without needing a lot of padding to space things out.

No, funny -- for me it's precisely the opposite.

The design is clean, modern, minimalist -- and I associate sites that look like that with loading in a blink.

It's the sites where everything is crammed in and packed with ads that load slowly, like most news sites.

Everything about this style of design says "fast" to me.

> Logically, it’s not a defensible inference in the slightest.

We have different views of "defensible". I imagine clicking something on that page and waiting for a response. I learned to make that association based on experience.

Yep! My pattern-matching brain assessed as both slow load time (probably not infact true due to it being an installable browser extension?), and high input latency.

Yes, as soon as I saw "Modern UI" I rolled my eyes and thought of common modern web components and how annoying they can be.... loading spinners, animations, annoying transitions.

I was also pleasantly surprised at the speed and snappiness. It must of taken some restraint to keep it so fast

For me it's the word "modern" makes me think it'll be slow and unnecessary, I think it's just the fact that a lot of apps titled "modern" are slow bad that made us think this when we see the word. (OP's app is decent tho)

At first I thought 'Not another one'.

But this is really well designed and great to have the style customization available.

Are you a designer?

The upvote, bookmark buttons etc probably need a tooltip - not everyone might know what those icon buttons do. In fact I'd add a tooltip to all icons buttons.

Also, when the width is set to 100% - the menu that appears after clicking on the more button (3 dots) is cut off - as it appears to the right. You probably have to do some edge detection or always show it to the left.

And nice one for trying to earn a buck.

Thanks for the feedback, glad you like it :) Will add tooltips to icons in the next update + fix that 100% width bug too.

Also i would really like an option to being able to collapse comments just clicking the comment box/card Excellent work ~

This is not a critique of the work, I understand that some folk prefer it and that its beautiful work.

I _hate_ modern web UIs however. Give me plain old websites that are information dense, with none of the fluff. HN and old.reddit.com are my daily reads.

I will be _very very_ sad when old.reddit goes away and I probably will have to go app only (Apollo) when that happens.

Same here and in my opinion one of the reasons HN became what it is: they didn’t fuss with the interface, kept it simple and light. When old.redit stops working I’ll probably stop using it altogether.

Why not make this a user-style? [0]

In particular I ask this because your approach -if generally applied- means installing an extension for each single site, which feels a bit too much.

[0] https://userstyles.org/styles/browse/ycombinator

There're some extra features (e.g. bookmarks) that utilize scripting and data storing. So a userstyle wouldn't cut it. A user script though would. Also privacy-wise I think there isn't a way to limit an extension to a single site, something possible with a user script.

> Also privacy-wise I think there isn't a way to limit an extension to a single site

On Chrome/Edge you can, not sure about Firefox.

Additionally this extension only even asks for permission to access Hacker News and some backend stuff presumably used for the paid tier.

Yes, you're right on asking permissions. I didn't had a site-specific extension so couldn't see them. Unfortunately restricting any extension, if it doesn't restrict itself, is only possible on Chrome and its derivatives.

I really like this!

Just a subjective thing -- I would consider offering Verdana in a future release, for those (like me) who aren't yet ready to lose that flavor of HN. But all the other adjustments are very desirable to me so far.

Regarding the name: The horse might be out of the barn, but calling this a "modern" HN sounds a bit too much like a value judgment to me, though I doubt you meant it that way (and I doubt anyone at HN really took offense). It also triggers all the curmudgeons who are hellbent against anything "modern" just because it's modern.

Great job!

Thanks :) Yes the plan is definitely to add more font selection, including Verdana for the classic look!

I'd like to eventually add a full theme editor to change all aspects of the UI.

This looks very nice, great job!!

I used to use HN-Special[1] (by the same dev who made that 2048 game[2]) but I stopped a while ago and I don't miss it. I like HN as is (for now), but I do have it at 150% zoom using the native browser built in zoom, which works great for my needs.

The one thing I really really want is the equivalent of the "[l+c]" button from Reddit Enhanced Suite. In one click you open both the comments and the submission (if it's just a text one) in new tabs.

1. https://gabrielecirulli.github.io/hn-special/

2. https://github.com/gabrielecirulli/2048

Congrats, it looks very nice! One critical feature that this cuts from native HN is the changing colour of links already visited. I'll often click an article, then navigate back, and use the changed link colour to reorient myself on the page.

Thanks! Yeah I forgot that, will add a setting in the next update to change the color of visited links.

Nice!

It's a neat idea to implement it as an extension. And I enjoy how it just overlays the normal site (loads separate pages as separate pages, etc)

And finally a dark mode. Dear god.

One bit of feedback: it took me a minute or two to figure out how to comment on an article (to write this very comment); I actually had to look back at the website to make sure commenting wasn't a "Pro" feature. I don't know if the reply-arrow really translates to comment threads, especially when you're not "replying" to another comment but to the main post. Some sort of comment-bubble icon might be clearer. At the very least I think those icons could use titles, and/or "modern" tooltips.

Overall pretty cool! I think I'll try it out at least for a little bit

Edit: A couple other things,

- It's a bummer that karma and threads (now "Comments") are hidden behind an extra click. When I'm actively participating in a thread those are two of my most frequently-used parts of the UI

- The thread UI is a little too minimalist I think; it's a little hard to visually parse where one comment ends and another starts, nesting levels, etc. Some tasteful borders or lines would go a long way here, though so would some slightly-more-contrasted colors

- I don't see a way to see upvotes on your own comments like in the main UI. My dopamine receptors would like that feature back ;)

Thanks for the feedback, glad you like it!

- Will definitely add tooltips and have a think about how to make the reply process clearer.

- I'd like to make the top nav customizable at some point, so when I do I'll add options for the account sections (threads etc). Will add a setting to show karma next to the user icon too.

- Yeah a couple of others have requested that too. The next logical step is a theme editor, which would allow changing border colors etc. It's on the TODO :)

- Yes that should be there, will add it back in the next update.

I've seen a hundred of these but this is quite nice, I'll give it a shot for a week. The configuration makes it much nicer, others have been too opinionated.

One thing: it'd be nice to click the whole top header of the comments to collapse them, instead of clicking the far left toggle.

Edit: also not seeing my comment score inline on the page header makes it difficult to know if I should check my comments for activity. this one might be a deal breaker.

Thanks :) Will add the comment score. Clicking the header to collapse is a good idea, I'll get that working too.

also the more I use this the more I like it, nice work :)

(I'm an HN-junkie)

highlighting the OP w/ a color was a nice touch btw

It's very nice-looking!

One deal-breaker for me, sadly -- having the collapse/expand and upvote/downvote buttons on opposite sides (left, right) of the page is way too annoying.

When I read comments, I'm constantly voting and collapsing. Using my trackpad to jump back and forth is just too much.

Current HN isn't great for that, but it's usually only traversing about a quarter of the page's distance.

Thanks for the feedback. I'm going to make the space in the comment header clickable to collapse/expand, which will reduce the distance a bit. Would that work for you?

The other alternative might be to add a setting to move the collapse/expand arrow to be part of the icons on the right.

I would find it much more natural to have both expand/collapse and upvote/downvote on the left, simply because text is left-aligned.

I find any functionality pushed all the way to the right side to be harder to use, simply because it's not "together" with everything else on the left. Your eye has to do more work to match right-side content to left-side across a whitespace.

Yeah that makes sense. I'll add a setting to move vote icons to the left. Thanks.

Oh wow, it's like HN has entered the 21st century all of a sudden

great design, Im keeping it enabled for testing

Do you accept feature requests/think this might be a good idea?

I've been thinking about creating this + adding https://github.com/mozilla/readability to grab the links that are text articles and present them in-page (and cleaned up, just the text+images+similar, removing all the sidebars, popups, etc) instead of having to go to a 3rd party website with all the popups and such.

It'd have to be either a personal website or a browser extension like yours, since I wouldn't be able to host a given article for anyone to read (for copyright reasons), but I can have a modified browser that loads a 3rd party article different.

It's a nice idea! One consideration would be how to grab the html of the pages. In my experience, using either fetch() or an ajax request often runs into problems with CORS etc on the destination site blocking the request.

Maybe there's a better way someone knows for extensions to grab remote html without running into these problems?

The alternative would be for the extension to grab the html via API from a crawler running on a server (or SaaS), which should work pretty well.

Yes, I'm pretty sure (but not 100%) that extensions normally can avoid CORS/same-origin/etc issues.

> The alternative would be for the extension to grab the html via API from a crawler running on a server

Oh like 'https://myplainwebsite.com/parse?url=https://example.com/doc...'

So I just launched this inspired on our brief conversation! :)

https://content-parser.com/

You can parse any URL into markdown with `https://content-parser.com/markdown?url={encodeURIComponent(...}`.

That's awesome, works really well! Good luck with it :)

No thank you.

HN is great because it /isn’t/ … that.

I'm late to this but just wanted to mention - I'm checking out the extension and like it quite a lot.

Only feedback I have right now (that I haven't seen anyone else mention) is that I'm finding it hard to jump to the next "top-level" comment. If I'm half way down a comment thread and decide I just want to skip the rest of this thread, I'm used to just scrolling down a bit until I see the next top-level comment and I'll read from there. It's easy enough to do in non-skinned HN because the everything is left-aligned, but with the extension I haven't been able to intuit a left 'border' yet and am not sure if it'll ever come to me.

Looks good! Biggest appeal for me is that it provides dark mode without needing to use a third party webapp or a CSS customization extension with broad permissions requirements.

Some things I noticed: changes to the font size/width/line height don't seem to persist between the comments page and the front page. On top of this, the bars don't have clear numerical values so it's hard if you make any tweaks on them to match the settings across pages. ALSO I got kind of out of hand with those settings (line height in particular) and wanted to return to the default, but there's no reset button as far as I can tell.

Thanks for the suggestions, glad you like it.

The theme settings (font size/width/line height) apply to the current view. So you can setup the style separately for each of the 3 views: story pages + index pages (list or table view).

I'll add all this info to the help section shortly.

Will also add tooltips to the sliders (with current value) in the next update + a reset button :)

This is awesome, I'm using it as I type. very refreshing. The only thing that is missing, is that the front page does not show which articles i've already clicked (the link is not grayed), so I can't quickly scan the list.

Thanks! great job!

It is way less efficient to consume HN with this design, so I won't use it.

There's some overhead, but not much. It basically just parses the underlying HTML as soon as it's loaded, then redraws it with added features.

Also no heavy frameworks used, just basic hand-coded JS + jquery + a few helper libraries (luxon for dates etc)

The post was about efficiency for the user, not for the computer.

Yeah I missed that, first thought was efficient performance!

I agree, it's a lot harder to logically/visually move through comments. The grey-black-black-with-underlines is a lot easier to read then the bold-black/black/thin-hl. It's kind of why I hate the new reddit style too.

I also don't like having to hover to see the icons for reply. Why are you hiding the parent/context buttons for navigation in a dot-dot-dot menu when you drill into a comment chain? Where's prev/next? Upvote/Downvote/hover UI covers stuff, and no alt tags anywhere to be seen.

Also why does it need perms to firebase and extensionpay again?

It just feels clunky even as a redesign.

I think there’s a trend to replace applications having information-dense designs with all actions at your fingertips with ones that add so much padding that you can only see a little bit of information at a time and in order to perform any action, you have to hover or click several times.

yes, and i find it disturbing. either a feature is there, then it should be visible at all times, or it should be off completely. while i am reading my eyes are tracking the locations of those buttons/links so that i can quickly move the mouse to use them. if they are hidden that slows me down and gets in the way. it makes sense on small screen like mobile where it is better to use the space to show more content and have actions hidden behind a menu, but not on the desktop.

https://hackrnews-dj.netlify.app Have you tried to use this HN clone? It is a SPA, but it has very similar UI to the original site, and it has some extra features added (dark an modern UI, bookmarking with highliting new comments, searching through comments, navigating, root comment collapsing in any child comment, and a few other). It is also optimized for desktop and mobile reading, and very readable.

- Good point, I'll add a setting in the next update to always show icons.

- Parent / context are in the menu just to keep the design clean. But I understand that's not what everyone wants, so I will add a setting to show these with the other icons, instead of in the menu.

- Prev / next are moved to the "control pad" (pro feature), but my intention is for the free version to support all current HN features, so I will add those back in the next update.

- The permission to firebase is to access the HN API [1] to grab user profile info etc. The other is for the pro upgrade using ExtPay [2]

[1] https://github.com/HackerNews/API

[2] https://github.com/glench/ExtPay

For right now I'm back to using the Hacker News enhancement suite, it builds on top of the compact ui.

could you link to that please?

https://chrome.google.com/webstore/detail/hacker-news-enhanc...

Why is it way less efficient?

because it hides important UI elements. in particular prev and next which i use frequently are completely missing. that alone forced me to turn off the extension after just a few minutes, because unfortunately it made pages very difficult to navigate.

Good point, I'll add prev / next back in the next update. They've been moved to the "control pad" (pro feature) in the extension, but my intention is for the free version to support all current HN features.

It's not of course

I'd day there is a balance between form and function when it comes to websites, and I'd rather stare at a nice looking slightly less efficient webpage rather than an ugly but more efficient one.

Nice! Any way to set previously read items with different CSS, so — as in the basic HN UI — you can tell at a glance whether you’ve already been there? Don’t see that option mentioned for either free or Pro.

Good idea, thanks, I'll add that in the next version.

I'd like to be able to navigate each comment by pressing 'j' to go down one comment, 'k' to go up one comment, and enter to collapse the comment.

Love this; really nice work. It's so much more readable. Older eyes thank you. I would upvote it just for having a lighter-charcoal background available for dark mode.

My one piece of feedback is this: the line height adjustment on the comment pages changes the distance between comments as well as the space between lines within comments, but I think those are better decoupled. I would like to see comments fairly close together while maintaining a readable line height for the comments themselves.

Thanks, glad to hear it helps :) Good point, they should be separate settings. I'm going to add more theme adjustment settings in future updates to solve that.

I'm not a huge fan of how it removes the built-in account-linked bookmarking functionality (favorites) and replaces it with a pro-only feature (locally stored bookmarks).

Looks like that's a bug, sorry about that. Will be fixed in the next update.

For reference, in the Pro version you can set the storage for your favorites to private (local browser storage) or public (HN profile). It's currently set to private storage for free users, but should be set to public (to save to your HN profile).

Regardless of whether it's a pro-only feature, my feedback is that I need this to use the existing HN favorites capability before I feel comfortable using it.

Finally, I use HN exclusively through glider on android, because the Website is less than stellar tbh.

I like the modern UI for Wikipedia too, it would be great if you can make it work on Wiktionary.org too!

A note, the wikipedia extension doesn't work on non-engoish versions of Wikipedia, for example de or ar.Wikipedia.org

Unfortunately it doesn't seem to be open source, a big nono with browser extensions

It would be great if you can show the fav icon of the link beside the titles, it helps differentiate posts.

Yes, lack of source makes this difficult to trust.

Shameless plug for a small Userstyle I wrote: https://git.gioia.cloud/andrew/gists/src/branch/master/Users...

It adds dark mode and some spacing/font size/readability improvements for wider screens.

Just a little usability tip, if you name the css file with the extension .user.css, when viewed as raw from Github, Gitea, etc extensions like Stylus will offer to install it so users don't need to create the userstyle entry themselves.

> suggestions welcome

One tweak I hope HN will roll into its own UI: if "HN Can't Process Your Requests This Quickly", then offer a "window.reload()" link. Comes up when I'm opening a bunch of bookmarks at once and maybe there's three or four HN links that open. Same thing as hitting refresh, just a added convenient step.

It looks great, but a little disappointed to see no mobile version. I'll use this the next time I'm on my computer.

Glider is a pretty great client on mobile IMO.

My favorite iOS client for Hacker News (so far) is HACK: https://apps.apple.com/us/app/hack-for-hacker-news-developer...

Great job, thank you! Installed it at once and trying to use. Was not obvious how to reply at first glance, but I managed in a couple of minutes)

Please consider adding some kind of comment's depth indicator. My most frequent action on long threads is "stop reading the rest and move to next top-level comment". If previous top level comment is beyond top of the screen - I just scroll down looking for minimal indent. With your centered design it is impossible. A thin line by the left side of text column wuld be enough, or you may go further and add some dots or pictograms on the left of each comment. Just a suggestion.

Hi,

I quite like this extension! One minor criticism though that prevents me from using it: links I've clicked through to from the front page don't change colour indicating where I've been in the past. This is infinitely useful on a heavy HN browsing day :)

Yeah forgot to add visited link color, it's coming in the next update :)

Out of all the HN extensions/websites I've used, this one has become my favorite. I really like the customizations available and also, it really does feel "modern" in that some things just feel easier to do with this tool.

I immediately installed it, thank you. I really like the dark mode.

However, I couldn't figure out how to comment initially and looked for the comment box, even at the bottom and couldn't find it. I finally realized it is the left facing arrow on the right just under the title. I think that UX could be improved to surface the comment feature.

Also, one feature I really wanted that I don't see on the extension is the ability to "favorite" it without clicking into it. So, I'd love to see that added. I will consider paying for the pro version to support you, but am going to give it a week or so on the free version.

Thanks

I think I'm really going to like the easy access to the history as well!

Thanks, glad you're enjoying it :) Good suggestions, I will try to make the commenting process clearer, and add a favorite icon to the lists too.

It's probably on me, but is there no change in color for visited links?

Personally the only problem I have with the current UI is that I have to hit the arrow at the bottom to expand for more comments. Kills my ability to CTRL/CMD F and find keywords.

What do you mean by the arrow at the bottom? I don't recognize that.

Correction, I was referring to "X more comments..." like seen on https://news.ycombinator.com/item?id=32755893

I just want all comments to load on page load so I can search easily.

Ah ok. Actually we've mostly turned pagination off lately because recent performance improvements (not the big ones - those are still coming!) made it possible. But I forgot to turn it off when I restarted the server today, and with the big QE thread burning hot at the moment, we should maybe wait a while.

I agree that it's annoying and it will be a happy day when we can turn it off properly.

oh, that's great news. pagination always got in the way when tracking new comments because when switching to the next page the order of the comments may have changed, and i see comments on the second page which i already read on the first, and i wonder which comments i am missing because they moved from the second to the first page by the time i switch pages.

Yes, it's actually a hard problem to solve when the content isn't ordered chronologically. The front page(s) have the same issue. With /newest and other chronological feeds, of course, getting pagination correct is easier—though you still have to account for new items having shown up in the meantime.

I think this is a relatively new feature - HN used to show all comments, but the feature very frequently caused a lot of load on the servers which would cause HN to go down.

I totally love this! IMHO worth the upgrade. Kudos. This solves one of my biggest pain points on my Ultrawide monitor. Excellent layouts/fonts and dark mode. Perfect!

I love that as an "end user", I can easily choose to have (or not) this degree of customization by simply using (or not) an addon like this and HackerNews itself (due to it's simplicity of design) does not get in the way of this at all. Just one more reason that HN's design is basically perfect. Thanks much to both the author of this addon, and to HackerNews dev(s) for contributing to a "better Web" for all.

Hi, are you familiar with https://github.com/plibither8/refined-hacker-news ? I'm currently using it

It has some features like, if I select a part of a comment and hit reply, it will reply quoting that part

edit: oh, you're charging for it

anyway, my feedback is: there's a slow loading time whenever I open a link and I don't understand this

Why is this a browser extension not a web app on its own domain?

Also curious if there's any flaw in the official HN web app you see that incentives you to make this.

Oh THANK YOU. The extension I’d been using before has been having bugs recently and stopped showing “next page” buttons.

Curious why a browser extension and not a site like https://hckrnews.com/?

Good question. There's a few key benefits:

- It builds on the existing site, so the new design is always applied to HN urls. No need to visit a separate website.

- Privacy - everything is stored locally in your browser, there's no 3rd party website to track your activity etc. Also with JSON backup you're in full control of your data.

- Unlimited storage - local browser storage has limits, but extensions can request unlimited storage. This is useful for the history and bookmark features.

I personally love this. I hope this wasn't a web extension but i really like it nonetheless. The design is very clean and i don't feel like it's wasting my time with lots of unnecessary stuff in the screen.

Good job honestly, it really modernizes an old site without doing stupid sh*t

I really dig it. Great job. It might not be for everyone, but to me it’s a real breath of fresh air.

One nit, it seems to hijack going back/forward in history using touchpad? Browser buttons work. idk

Funny how every some years a young developer comes and does the same again and again. It's always fun to watch. It's even better that HN hasn't changed in all this time. I don't even ever go to HN, I just read it on my RSS feed.

Used it the past hour, I really like it. Thanks for making this.

Can you add the "past" section too? Also, it would be great if you add left margin indicator for comment threads, otherwise for long comment threads it is not clear how deep inside I am in the thread.

One thing I'd like to see is the ability to filter out posts with less than X amount of points. At certain times of the day, the first page (30 entries) has ~30% of entries which are low points, and I usually prefer to avoid these.

Thanks for your work!

Good idea, I will add that to a future version. Thanks!

Ah, and also thank you very much for hiding a number of upvotes/karma by the username. It was really disctracting, and there was no way to remove it with uBlock Origin, only with the whole login block.

Modern HN. *only works on desktop computers.

The screenshots look nice on mobile though. Good effort but I'm kind of attacked to HN how it is and I hope they never change it (and that they continue to make it east for people to riff on the original).

Hey man, I installed the Firefox extension and I am loving it. However the Auto Dark Theme does not work and DarkReader does nothing at all on your layout.

Having a dark version of this would be awesome :) Thanks for your hard work. I appreciate it! :)

It has a dark version already. Press the "aA" icon on the top right toolbar

Already found that. Thats what I meant with "Auto Dark Theme", however it does not work :).

Nice, but no thanks. HN's old boring design is an oasis on the modern web.

I've been pretty happy with this one: https://github.com/plibither8/refined-hacker-news

Gave it a try, and so far, I love it!

I especially like that I can make the site look incredibly nondescript and hide my username, so that it's less obvious at work when I have my pinned HN tab tucked away.

It installs fine on Chrome but fails to install on Brave (network error download interrupted). Too bad as Brave is my main browser. I have no problem installing some other Chrome extensions on Brave.

It looks great, is there a way to reduce the margins on the left and the right? Right now the padding is taking up about 40% of the usable space. Where on the normal HN the padding is about 15%

Yes, just click the "aA" icon to open the settings, and use the bottom slider to adjust the content width.

I really hate how there's no alt tags or anything like that to actually tell you what any of the sliders mean.

Good point, I'll add tooltips to the next version.

That worked thanks, I would recommend adding a tooltip to explain what that action is doing.

Will do, thanks.

Top right theres 'aA' setting button. Play with is.

Bit late to the party, but there's no visual distinction between visited and unvisited links - is that by design?

I really like this. Thank you. I'll use it and see how I go.

This is great! Congrats and thanks for sharing your work! People have been asking for dark mode for years. This has it and so many other nice UI improvements too. Well done!

I kinda like it. The font-size and container size are a nice touch. I like that I can keep the cream background. I think the nested comments are still a bit hard to read.

My first reaction: gosh, another one. My second reaction: hmm, it's an extension, I'm curious, show me. My third reaction: I absolutely love it.

What an excellent look, great work putting this together!

Looks great, and I like the customize settings. I couldn't figure out how to comment though. Not sure if I missed it or it's not yet a feature.

Glad you like it :) You should just be able to hover over a comment and click the reply icon?

I too am unable to do this, there isn't a comment box for top level comments.

EDIT: I would expect a comment block to be before the "${count} Comments" tag.

LOVE.

Great job. Already using and enjoying this. Keep up the great work.

Thanks, glad you like it :)

Can't see my karma :-(

It's in the user menu (icon top right). If you mean for your own comments, that's a bug and will be fixed in the next update.

I like this, but I would love it even more if there was a theme with a background gradient - maybe navy blue at the top to dark grey.

I think HN looks fine already. The only real problem with this site's design is that the text is too small.

Looks neat! Going to give it a try...

Would be great if there was an option to change the font color for more contrast :)

Using it now — I like it!

when I saw this, first thing that came to mind is the awesome wiki redesign addon I'm loving so much and its the same guy making it!! what a legend :) thanks

on hackernews, comments appear really as a tree, and that is pleasant. Not so much with this extension. It is not so clear where stands the comment we are reading.

I really like that HN is not like that, but nice work anyway :)

What does "Font smoothing" do?

It applies -webkit-font-smoothing to anti-alias the fonts.

Doesn't work with Chrome Android.

Beautiful design op. Well done!

This is unexpectedly great.

doesn't reflow text properly on zoom in firefox, had to disable

also on mobile widths it breaks (on dsktop) when making window narrower

Thanks for the heads up, will fix that in the next update.

Why? If it ain't broke, don't fix it.

Thus the reason it's nice that it's packaged as a browser addon. Easy for those who don't like or want it to simply never install it.

I love it

hckrnews.com user here. I might try it out, what are your hosting plans and are you able to keep it standing for the future? Good work!

Firefox ask for permission for "Access your data for extensionpay.com" ??????

What for ?????????

Seriously : I can't understand... and I surely WONT install this because I cant ANY REASON. Really disapointed :-(

Why would a extension that has a paid upgrade option potentially contact a provider of services to implement paid upgrades in browser extensions, mysterious indeed. A question requiring many, many question marks.

The extension uses ExtensionPay [1] to accept payments via Stripe for the Pro upgrade. It's open source and created by HN user Glench [2].

[1] https://github.com/glench/ExtPay

[2] https://news.ycombinator.com/user?id=glench

But Google Chrome has the following note in the extension details view after you install it:

> This extension is not trusted by Enhanced Safe Browsing. Learn more[1]

[1]: https://support.google.com/chrome_webstore/answer/2664769?vi...

Hmm, this seems to be because of Google's new policy for verifying extensions. The domain (modernhn.com) hasn't been used for an extension before, so it needs to be around for a few months with a good track record to be verified. Their page [1] says:

> For new developers, it will take at least a few months of respecting these conditions to qualify.

Modern for Wikipedia [2] already meets those standards, and has the relevant badges, so I guess it'll just take some time for those to be approved and for the "Enhanced Safe Browsing" warning to be removed.

[1] https://developer.chrome.com/docs/webstore/discovery/#publis...

[2] https://chrome.google.com/webstore/detail/modern-for-wikiped...

If you read the site, there is an option to pay for premium features. I would assume that extensionpay is a vendor that helps with facilitating those payments.

Reply on news.ycombinator.com