Large images in merge requests are always displayed at full size and take up a lot of space
Summary
When you add images or screenshots to a merge request to help your reviewers understand a visual change, the screenshots are displayed at full size. If the images are very large, they take up an enormous amount of space and may not even be fully visible on the page. This problem is especially acute with high resolution portrait-oriented images which will generally span the full width of a maximized browser window page and be partially out of view, requiring scrolling to see the rest of the image. Screenshots taken on a 4k screen in particular suffer from this issue.
As a workaround, I am putting before-and-after screenshots in my merge requests into a table, like this:
| Discover, before | Discover, After |
|---|---|
|![Discover__before](/uploads/3bc3eeab7bd69cb0046532c75e043ded/Discover__before.jpeg) | ![Discover__after](/uploads/9f709fdd57fc0044914e04834f8be770/Discover__after.jpeg) |
Steps to reproduce
Create a merge request and attach tall high resolution images to it, such as the following:
- https://invent.kde.org/frameworks/kirigami/uploads/3bc3eeab7bd69cb0046532c75e043ded/Discover__before.jpeg
- https://invent.kde.org/frameworks/kirigami/uploads/9f709fdd57fc0044914e04834f8be770/Discover__after.jpeg
Example Project
https://invent.kde.org/plasma/plasma-workspace/-/merge_requests/185
What is the current bug behavior?
The image is enormous and takes up all of the available space
What is the expected correct behavior?
The image would be capped at a maximum height, or displayed as a small-medium thumbnail. This latter behavior is the default behavior in Phabricator, which KDE migrated away from when we moved to GitLab.