4 ms·

You currently use <button>s for your navigation (and in the footer) which means I can't use neither my scroll wheel button to open links in a new tab nor can I

You currently use <button>s for your navigation (and in the footer) which means I can't use neither my scroll wheel button to open links in a new tab nor can I right-click and open it in a new tab. I guess you could use <a href="/whatever" role="button"> to get the same semantics but also make it easier for people like me (and people using screen readers!) :)

bilater 6y ago
Sorry! It's because the Nextjs Link component is dumb and doesn't let you pass className directly so I can't style it without using button and the onClick option to navigate :( You can make it an <a> tag (as you pointed out) and add target="_blank" which will make it open in a new tab. Will also have to add "cursor-pointer" in the className to get the cursor on hover effect.
- carmen_sandiego 6y ago
  className should be set on your <a> which is wrapped by <Link>. Or have I misunderstood your problem?
  - bilater 6y ago
    Yeah that also works. I was trying to avoid a tag inside a tag. :D
  - bilater 6y ago
    ok - I was being dumb. Thanks for pointing this out. I have updated the desktop nav links and footer links so now it can be opened in a. new tab :)
bilater 6y ago
I've updated the code now - so you should be able to navigate it better!