[dxxvi]

My hacker news modified with violentmonkey: https://vercel-html-example.vercel.app/hn-violentmonkeys.png

The + - buttons on the top panel change the font size of every thing except the font size of the panel.

Things are arranged to minimize the page scrolling.

The news title and number of comments are darker and a little bit bigger than other elements for an easy reading.

[archb]

Do you mind sharing the script?

[dxxvi]

    // ==UserScript==
    // @name        ycombinator
    // @namespace   Violentmonkey Scripts
    // @match       https://news.ycombinator.com/*
    // @grant       GM_addStyle
    // @version     1.0
    // @author      -
    // @description 10/5/2022, 6:35:39 PM
    // ==/UserScript==

    GM_addStyle(`
      .pagetop { color: #fff }
      body .title { font: 19px/1.5 sans-serif }
      body a, body a:link { color: #222 }
      body .comhead { font-size: 16px; font-style: italic }
      body .title .rank { color: #aaa; font-size: 14px }
      body .subtext { font-size: 16px; padding: 4px 0 6px 19px }
      .c00, .c00 a:link { color: #444 } body .comment { font: 16px/1.45 sans-serif; max-width: none }
      body span.pagetop a, body span.pagetop a:visited { color: #fff }
      body tr.athing:not(.comtr):nth-child(even) { background: linear-gradient(#f4f4f4, #eee, #f4f4f4) }
      body tr.athing > td { padding: 5px 10px 5px 1px }
      body tr.athing > td.votelinks { padding-right: 5px }
      td.zoom { font-weight: 700; color: #fff; width: 32px }
      td.zoom > span { cursor: pointer; font-size: 1.5rem }
      div.toptext { font-size: 17px; color: #333 }
      span.number-of-comments { font-size: 18px; color: #666 }
    `);

    const t = document.getElementById('hnmain');
    if (t != null) {
      t.removeAttribute('bgcolor');
      t.removeAttribute('width');
      t.parentNode.removeChild(t);
      document.body.prepend(t);
    }

    const spanPagetop = document.querySelector('td span.pagetop');
    if (spanPagetop) {
      const tr = spanPagetop.parentElement.parentElement;
      tr.insertAdjacentHTML('afterbegin', `
        <td class="zoom"><span onclick="zoomIn(); return false">+</span></td>
        <td class="zoom"><span onclick="zoomOut(); return false">-</span></td>
      `);
    }

    setTimeout(function() {
      while (true) {
        const td = document.querySelector('tr:not([id]) > td.subtext');
        if (td == null) {
          break;
        }

        const tr = td.parentElement;
        const previousTr = tr.previousElementSibling;
        if (previousTr != null) {
          tr.parentElement.removeChild(tr);
          previousTr.append(td);
        } else {
          break;
        }
      }

      while (true) {
        const tr = document.querySelector('tr.spacer');
        if (tr == null) {
          break;
        }
        tr.parentElement.removeChild(tr);
      }

      document.querySelectorAll('td.title[valign="top"]').forEach(td => td.setAttribute('valign', 'middle'));

      document.querySelectorAll('table > tbody > tr:has(> td + td + td + td) + tr + tr > td[colspan="2"]:first-child + td:last-child').forEach(td => {
        td.setAttribute('colspan', '2');
      });

      document.querySelectorAll('a[href^="item?id="]').forEach(a => {
        const arr = a.innerHTML.split('&nbsp;');
        if (arr.length == 2) {
          a.innerHTML = `<span class="number-of-comments">${arr[0]}</span> ${arr[1]}`;
        }
      });
    }, 419);

    const myScript = document.createElement('script');
    myScript.innerHTML = `
      const FONT_SIZE_THRESHOLD = 26.9;
      function zoomIn() {
        const bodyTitle = document.querySelector('body .title');
        if (bodyTitle) {
          const newFontSize = parseFloat(getComputedStyle(bodyTitle).getPropertyValue('font-size').replace('px', '')) + 1;
          document.querySelectorAll('body .title').forEach(t => {
            t.style.fontSize = newFontSize + 'px';
            if (newFontSize > FONT_SIZE_THRESHOLD) t.style.fontWeight = 300;
          });
        }
        const bodyComment = document.querySelector('body .comment');
        if (bodyComment) {
          const newFontSize = parseFloat(getComputedStyle(bodyComment).getPropertyValue('font-size').replace('px', '')) + 1;
          document.querySelectorAll('body .comment').forEach(t => {
            t.style.fontSize = newFontSize + 'px';
            if (newFontSize > FONT_SIZE_THRESHOLD) t.style.fontWeight = 300;
          });
        }
      }

      function zoomOut() {
        const bodyTitle = document.querySelector('body .title');
        if (bodyTitle) {
          const newFontSize = parseFloat(getComputedStyle(bodyTitle).getPropertyValue('font-size').replace('px', '')) - 1;
          if (newFontSize > 12) document.querySelectorAll('body .title').forEach(t => {
            t.style.fontSize = newFontSize + 'px';
            if (newFontSize < FONT_SIZE_THRESHOLD) t.style.fontWeight = 400;
          });
        }
        const bodyComment = document.querySelector('body .comment');
        if (bodyComment) {
          const newFontSize = parseFloat(getComputedStyle(bodyComment).getPropertyValue('font-size').replace('px', '')) - 1;
          if (newFontSize > 12) document.querySelectorAll('body .comment').forEach(t => {
            t.style.fontSize = newFontSize + 'px';
            if (newFontSize < FONT_SIZE_THRESHOLD) t.style.fontWeight = 400;
          });
        }
      }
    `;
    document.head.appendChild(myScript);