We can use text zoom on the whole page, but I don’t need/want the generator page to be bigger, just the code itself. Having separate control over this would be great. My page is designed to look best at a certain kind of zoom level, so I need to keep changing back and forth if I want to see how it looks, know what I mean?

  • @perchanceM
    link
    English
    23 months ago

    Okay, it’s not very accessible for non-technical users, but for now I’ve just added localStorage.editorFontSize. The default value is currently 12. So you can open the browser console with Ctrl+Shift+J and then type/paste this:

    localStorage.editorFontSize = 10
    

    And then refresh the page, and you should see that the font size has decreased. And of course you can try:

    localStorage.editorFontSize = 14
    

    To make the editor text a bit bigger.

    You noted it in your question, but since others may find this via a web search, I’ll emphasize that you can also use the built-in browser zoom by holding Ctrl and then pressing the + sign or the - sign on your keyboard. But as noted that will also resize the output area, not just the editors.

    • @wthit56OP
      link
      English
      23 months ago

      Oh great! Thanks!

      As is my way, I’ve made a little bookmarklet for people to use to let them do this easier. Make a bookmark, then change its address to:

      javascript: if (window.location.host === "perchance.org") { var old_size = localStorage.editorFontSize; var new_size = prompt("What size do you want the code in the editor to be?", localStorage.editorFontSize || ""); if (new_size && new_size !== old_size) { localStorage.editorFontSize = new_size; if (confirm("Font size set. Would you like to refresh the page to see the changes?")) { window.location.reload(); } } } else if (confirm("Would you like to open perchance.org?")) { alert("Use this bookmarklet again when it loads."); window.open("https://perchance.org"); } void (0);
      

      If not on perchance, opens perchance. If on perchance, asks for a font size, sets it, and optionally refreshes the page. 👍