1061312 - Similar Jobs left/right content panes obscure each other

Status: RESOLVED FIXED

(Tree Management :: Treeherder, defect, P2)

Description

[Jonathan French (:jfrench)]

Perhaps spawned from the work in bug 1042599, at pretty reasonable browser widths (eg. 1000 wide), the Similar Jobs right-panel, obscures content in the Similar Jobs left-panel.

To reproduce
o open treeherder production
o click on any job
o resize your browser down to about 1000px wide

Expected behavior
The left-hand and right-hand panels remain separate and I would assume overflow hidden.

Observed behavior
The right-hand 'Similar Jobs' pane overlays and obscures content in the left-hand 'Similar Jobs' pane. I will attach a screen grab.

Comment 1

[Jonathan French (:jfrench)]

Attachment: similarJobsObscuresAt1000pxWide

This is the observed behavior.

Comment 2

[William Lachance (:wlach)]

Yeah, this is a big problem. We need to fix it IMO. :)

Comment 3

[William Lachance (:wlach)]

Attachment: Fix/improve display of similar jobs

Comment 4

[William Lachance (:wlach)]

Attachment: similar-jobs-new-layout.png

Here's a screenshot of what the similar jobs view now looks like with the patch applied. Much better, and works on smaller screens. Note that log lines now wrap in the right panel (we turned that off before), but I think that's probably the behavior we want.

Comment 5

[Ed Morley [:emorley]]

Comment on attachment 8483105 [details] [review]
Fix/improve display of similar jobs

Looks much better thank you :-)

Comment 6

[Jonathan Eads ( :jeads )]

Comment on attachment 8483105 [details] [review]
Fix/improve display of similar jobs

Moar flex!

Comment 7

[Ed Morley [:emorley]]

https://github.com/mozilla/treeherder-ui/commit/adbe2b5f11af63b86f80dd1381da02287bae879a

Comment 8

[Treeherder GitHub Bugbot]

Commit pushed to master at https://github.com/mozilla/treeherder

https://github.com/mozilla/treeherder/commit/dae247d1907a8fcdd53447922a60f1ad1fd67b82
Bug 1061312 - Fix/improve display of similar jobs

In particular, overflow is now handled way better than it was before on small
screens.