I’m looking for a feature or a theme that would allow me, as a reader, to resize code blocks in posts.
Why? We spend a lot of time looking at logs, and depending on the environment, there can be a lot of “preamble” on each log line. Here’s an example:
Maybe we can re-use our “Expand Table” feature to work on codeblocks too…
Well, I haven’t figured out horizontal resize, but I was able to add vertical resize with some CSS:
// Scrollable code blocks
Edit: Well… nevermind. I just realized that when the code block is short, that^ makes the div too tall.
It’s probably a naïve suggestion, but what about a
white-space: break-spaces; to have word wrap?
I actually did some work earlier in the year to fullscreen code blocks. First, you have to have the
show_copy_button_on_codeblocks setting enabled. Then, any code block that has a horizontal scroll will have 2 buttons – the copy button and the fullscreen button (the copy button will be there regardless):
Then a modal will be shown without the horizontal scrolling:
@Canapin you really don’t want code blocks to wrap. That’s actually why I format 99% of the posts that I touch: to put the things that shouldn’t linewrap in code blocks.
And thanks for the tip @martin. I may try this in the meantime, but I’m still holding out hope for inline resize…
I’ve turned on
show_copy_button_on_codeblocks and this is a nice interim step.
Worth noting that you have to actually mouseover the code block for the buttons to show up. I thought at first it wasn’t working.
And on the topic of inline resizable code blocks, it might be worth pointing out that the Data Explorer SQL editor is fully resizable. (I know the page is built differently, but…)
So when I enable show_copy_button_on_codeblocks it doesn’t show the copy option (or the expand). Is there something else I’m missing?
The expand button will only show if the code block scrolls horizontally. I am not sure why the copy button wouldn’t show. It is hidden until you hover the code block, maybe that’s it?