Skip to content

Fix Bitbucket file path wrapping

Administrator requested to merge bitbucket-file-path-wrapping into master

Created by: felixfbecker

This is a quick PoC to help fixing https://github.com/sourcegraph/sourcegraph/issues/11110 while maintaining wrapping capability when action items are long. It basically applies the same style as used for GitHub, with some use of display: contents to make nested buttons participate in a shared wrapping context.

I.e. the behavior is: When both file path and action items don't fit next to each other, use a two-row layout instead (using flex-wrap: wrap and by disallowing shrinking of the file path with flex: 0). Secondly both the file path and the action items are allowed to wrap within themselves if they are even longer than a single row.

A: Both fit in one row

Screen Shot 2020-07-14 at 23 44 07

B: Don't fit in one row, use two rows

Screen Shot 2020-07-14 at 23 42 47

B2: Blob view

image

C: File path and action items don't fit into one row each, have their own contents also wrap

Screen Shot 2020-07-14 at 23 42 25

For comparison, here's the same layout behavior on GitHub:

image

I only quickly hacked this together in dev tools and tried to copy it over into SCSS. @marekweb could you see if this works? I hope this helps!

Fixes #11110

Merge request reports

Loading