Improve diff nav header
We've made progress improving the diff nav header and it is functionally better, but it lacks polish with strange borders and alignment. Developers spend lots of time looking at the page, so we should fix this debt.
Solution
- Compare versions header should always be full width except in the unified diff mode with no tree sidebar
- BONUS: Bar is always full width, but the content within stays centered when unified and no tree sidebar
- File header should be the same height as the "Compare versions header" - preferably aligns with the design system grid guidelines =>
56px
- Diff file headers should use a button group, switch icon order to open file externally being the last option, all buttons will become icon buttons (icon delivery by @dimitrieh)
- If a file header becomes sticky no rounder corner/double border problem should be visible anymore
Icon mr's created: gitlab-svgs!198 (merged) & gitlab-svgs!199 (merged)
doc-expand
& doc-changes
-
Show full file
=>doc-expand
with tooltipShow full file
-
Show changes only {spinner}
=> Just show the spinner (no tooltip needed, but if soLoading file
) -
Show changes only
=>doc-changes
with tooltipShow changes only
Links / references
Edited by Dimitrie Hoekstra