Why do you like full-width code mode

[iHiD]

Having full-width code for mentors dramatically reduces the amount of options we have with building a new UX. So we're trying to understand whether it's truly necessary or if there might be better ways we can do it.

For those people who have full-width enabled, could you please outline why below. Preferably with an example solution or two for us to look at. Thanks :)

[SaschaMann]

could you please outline why below

Because horizontal scrolling sucks.

[SaschaMann]

(which is what I get in full-width mode)

Could you post an example of what it looks like for you, please?

Why, for example, line-wrapping wouldn't be a better solution.

Completely personal preference, but I find line-wrapping works well for text, but makes code much harder to read because it typically breaks the indentation and splits up in the wrong places.

Take a look at the wikipedia page Sascha linked to for example - on my big screen it's unreadable because it's so long, whereas the mobile version looks great for me, because it has space either side.

try putting another article next to it in mobile mode and you'll likely still have plenty of whitespace for aesthetics while making better use of the space :) E.g. one article with some definitions on the left, and another article that uses them.

[iHiD]

Sure. These screenshots are full size on my macbook. This solution is a good example, as it has long lines.

In full width mode, the code takes the full screen and I have to scroll down to see the new comment box. Once that first comment is posted, I wouldn't then see any code at the same time as future comments:

---

With LHS/RHS, I have to horizontally scroll to see a couple of the LOCs but I can write the comment while reading most of the code:

[kotp]

So would it be reasonable to orient feedback at around 60 characters, and
have the space reserved for a longer line for the code side?

Potentially yes. Although your subsequent comment in brackets is my concern.

Yep, this area, what I would prefer is having independent vertical scroll, so I
can see comments when looking at parts of the code, so further on down when it
is side by side, and it is the 7th round of comments, I can't see the code where
I want to see it, perhaps line 4 or 10, while being way down on the right hand
side in the comments. Independent vertical scrolling to have the context while
in the browser.

Also, the views for the students and mentor don't need to be similar, as they
serve different purposes and different mindsets.

I definitely see that being the case.

The key need right now is to understand why the horizontal scrolling is a
bigger problem than vertical scrolling. Why people feel it's better to be able
to see none of the code while writing the comment (which is what I get in
full-width mode) than seeing most of the code while writing the comment, but
having to scroll if the code is too long. Why, for example, line-wrapping
wouldn't be a better solution.

Line wrapping poses other problems if it is not apparent or obvious that it is a
line continuation. I don't find that so much of a problem when it is indicated.
I really try to avoid reading code in the browser though, same with writing
comments, but we are stuck reading comments in the browser for the most part.

[taiyab]

I like some of the ideas coming out of this.

What it looks like is, the UI should maybe:

• Use full-width, edge-to-edge window
• Use width constraints/wrapping on non-code content
• Have the option to either split panes across or down (like a text editor)
• Have the option to adjust pane widths

It'll be difficult to maybe get all of this working perfectly, but in essence if the code never wraps, it makes things a lot easier (as the code pane can always take up the remainder of excess space).

[ynfle]

could you please outline why below

Because horizontal scrolling sucks.

I wonder if it differs for different computers and input devices?
I use a MacBook and the trackpad has excellent horizontal scrolling support

[wneumann]

I… didn't even know there was such a thing as full-width mode.

Having said that, I can't imagine I'd need it. Any code that I would need to keep scrolling side-to-side for, I'd probably download and look at in my text editor. For a quick glance, I don't really care if I need to scroll once or twice.

[tjarratt]

I too only discovered this feature today. It's interesting, and I'm trying it out, but I personally find that it is less helpful at the beginning of the tracks. Some of the later core problems and side problems benefit from this, where the code can frequently go past 80 characters.

Personally my workflow is to take the solution source code, copy it, and then use pbpaste to drop it into my own solution (which I have tracked by git) so that I can run the tests, try out any refactors before I propose them and make sure I'm not leading anyone astray.

Sometimes when I copy and paste I end up copying the first letter of the following word of column to the right (which is invariably an M from the phrase Mentor discussion. Having a button to automatically put the source code into my clipboard so I can bring it onto my local machine would be very helpful for my own workflow, but I don't know if anyone else does this.

[taiyab]

Interesting comments about side-by-side being more useful during lighter exercises.

Also, for sure, bringing a copy function into the code previewer is a great idea.

[Eiermann]

For those people who have full-width enabled, could you please outline why below.

Since discovering full-width mode a few hundred mentorings ago I've never been tempted to go back. Losing context when looking at partial lines of code is significantly more frustrating for me than needing to scroll between code and comment. I would prefer wrapping to horizontal scrolling but I'm pretty content with the existing full-width mode.

[SleeplessByte]

I personally would want a ~125ch width box, with a line at 80 and 120ch (but maybe configurable per language).

This looks like this:

Why?

• It creates a reference point, allowing visual distancing from either side, which can be really helpful skimming code
• Long lines (over 120ch) are terrible to read, or select using a mouse. Try selecting a bit of minimified code. Don't do it.
• For JavaScript and TypeScript I want to turn on prettier by default, which will wrap it at 80/120 anyway.

---

Why use full width mode?

Because half-screen mentoring is horrible when I'm not using full width mode.

---

What is it really solving?

I want to be able to turn on and off the comment section more easily. I'd love it if comments could overlay, or maybe only the last one, or maybe each one in a box, or maybe all the previous ones and mine separately. Think: gmail email response which you can "pop out". This would solve most the issues for most people.

And don't make me scroll for at least the first 80ch.

🤷‍♂️

[kotp]

Being able to easily switch between the two views is something that I would think would be nice.