Refined Look for HN Mobile (snipboard.io)

I got sick of looking at the crowded mobile look of HN. It needed breathing room. Plus I wanted to use iOS’s system font; and it should pick up Android’s default also.

Here’s a CSS stylesheet you can paste into a Safari extension like Makeover (free). This is my first time posting on HN, or I think it is so I don’t know if posting code is acceptable…

  body, table, td, span {font-family:system-ui !important;font-size:1rem !important;}

  #hnmain > tbody > tr > td > table:not(.itemlist) > tbody > tr > td {padding:0.5rem !important;}

  table.itemlist {margin:1.2rem !important;}

  td.votelinks {padding-left:0.7rem !important;padding-right:0.4rem !important;}

  div.votearrow {margin-top:0.38rem !important;}

  div.votearrow::before {content:'' !important; display:inline-block !important; width:1rem !important; height:1rem !important; background: rgba(0,0,0,0.05) !important; border:solid 1px rgba(0,0,0,0.1) !important; border-radius:100px !important; margin-left:-0.27rem !important; margin-top:-0.13rem !important;}

  td.title {line-height:1.5 !important;}

  td.subtext {padding-top:0.25rem !important; line-height:1.5 !important;}

  tr.spacer {height:1.2rem !important;}

  table.fatitem {margin-left:-0.9rem !important; margin-top: 1rem !important; margin-bottom:-2.5rem !important;}