affordance for full-width code blocks

[cellio]

meta:295243
meta:294306 (the request is different but the root cause is the same)

80 characters is a common width for code blocks, but in our standard styling, even on desktop, we usually can't show that much without horizontal scrolling. The linked meta posts propose some ways to work around this but they might cause other problems. Instead of playing whack-a-mole with font sizes, margins, etc, can we add a control to code blocks to, when activated, show the block using the full width (overlaying the right column)? I have the impression that it would be more useful to users if we could do that "in-page", but if it had to be a modal overlay, that could work so long as it's scrollable and copyable.

Raised in a comment: if the browser window is wide enough to have space to the left, should we use that? Before beginning work on this, we should ask for feedback from the community.

[trichoplax]

can we add a control to code blocks to, when activated, show the block using the full width (overlaying the right column)?

That's an interesting idea. Do you mean the full width of the screen/window, or the full width of the display area (post plus right hand panel)?

I'm asking because I wonder if it's also worth considering the empty margins that show to the left and right on many screens at standard (100%) zoom. Should the empty space to the left be overlaid before obscuring the right hand panel? The right hand panel could still be overlaid on screens/zooms that don't leave empty space to the left.

Here's what 100% looks like on my screen:

In this case there is more than enough space in the left hand margin to extend code blocks to 80 characters wide, although an early code block would then overlap the voting buttons. I often zoom in further than this, or use a smaller screen, so I still like the idea of overlaying the right hand panel when there is insufficient empty left margin.

[cellio]

Oh, I wasn't considering the space to the left because I don't browse full-screen on a humongous monitor so I never see it. Interesting idea. Would it be jarring to have the left margin jump way over as you move from the post text to the code block and back? (I'm talking about a scenario where the post explains something in the code block, so you want to look at both -- one reason I'd favor an overlay over a modal.)

[trichoplax]

Would it be jarring to have the left margin jump way over as you move from the post text to the code block and back?

Good point. Now that you mention it, I guess that having the left hand edge of the text lined up with the left hand edge of the code block would feel more comfortable for most people. I'm not a good judge of what most people like though, so it's probably worth getting feedback from more people.