Programming exercises: Assessment editor does not show many lines

[BaumiCoder]

Describe the bug

The new assessment editor (Monaco) waste quite a lot of space in the height. The boxes for the inline comments have much margin and there is also much space between the lines. This allows to view less lines than with the old editor.

(An possibility to enlarge the editor in height would also help to view more lines without scrolling.)

To Reproduce

1. Open some assessment of a programming exercise
2. Add some inline comments

Expected behavior

I am able to view about as many lines without scrolling as with the old editor.

Screenshots

Which version of Artemis are you seeing the problem on?

7.1.2

What browsers are you seeing the problem on?

Firefox

Additional context

No response

Relevant log output

No response

[Strohgelaender]

We could:

• Hide the build output per default if there are no build logs (build did not fail)
• Reduce the bottom margin of the comment boxes

This should open up more space for the editor.

[BaumiCoder]

To hide the output would be nice, but you can already increase the height of the text editor. So the height of elements outside the editor is not the big problem.

The margin of the comment boxes is a good idea 👍 Is it also possible to reduce the vertical space between the lines of the editor?

Another thing we encountered is the weight handling of the comment boxes is a bit strange. The boxes them self does not use the full width of the text editor and the text uses even less width. This leads to more line breaks in the comments than necessary, which also waste height through the higher number of lines.

[pzdr7]

• The vertical resize handle is indeed a little difficult to see in light mode - we could adjust the color to make it more prominent. - Do you think a fullscreen mode (of just the editor) could help?
• We should definitely reduce the margin of the comment boxes 👍
• Regarding the space between the lines, I'm not sure - as far as I can tell, the Monaco editor does not put any space between the lines (you can check this by clicking on a line, then switching to the line below it. the editor highlights the entire active line and there doesn't appear to be space between them).
• The feedback widget max width seems to be a leftover from the original implementation. I think we could get rid of it or make it larger. I'll try a few things and get back to you 👍

[BaumiCoder]

A complete full-screen mode, which also hides the Artemis controls at the top of the screen, maybe could also help. Would only the editor part of the visible content? I think the File browser should be also part of such a mode. When scrolling down in fullscreen the other elements, like the Assessment notes field, could be also visible (or should the user close this mode to access them?).

[pzdr7]

Basically to get a fullscreen layout, I need to provide a single HTML element that "requests" the fullscreen. One unrelated example is implemented in #8856. We'd have to try it out separately, I think. The more elements we include, the less space we save.

[chrisknedl]

Aside from the proposed fullscreen mode, the only thing that is still missing here is the line height. I'll open a PR to see if more people are interested in this.