578434 - Bug group checkboxes lay out poorly beside attachment field

Status: NEW

(Bugzilla :: User Interface, defect)

Description

[Mike Beltzner [:beltzner, not reading bugmail]]

Screenshot: http://grab.by/5oVO

Should either be aligned with the edge of the comments area, or not beside the attachment table, but in some way not so ugly that it hurts me oh how it hurts.

Comment 1

[Reed Loden [:reed]]

I agree... This is actually an upstream change, but I'll probably change something locally to get this fixed, as well.

Comment 2

[Max Kanat-Alexander]

  Hmm, yes, I see what you mean. In other news, CSS should suck a lot less.

Comment 3

[Max Kanat-Alexander]

Note that in most circumstances for most users, that won't be a problem, though, because they'll either have an attachment or they won't have so many group options. It's pretty unusual to have six or more group options on one bug, but it's still worth fixing if there's some reasonable fix.

Comment 4

[Max Kanat-Alexander]

  Oh, I just realized why I never noticed this--in stock 3.6, there is no "put my additional comments box on the bottom" preference, so the comment box is up top, and it doesn't look nearly as strange with the additional comments box and the <hr> there.

Comment 5

[Guy Pyrzak]

So this is basically caused by the fact that the comments are in a table by themselves. Removing the table from the comments will let us make this into a 2 column layout which should fix the issue being described here

Comment 6

[Mike Beltzner [:beltzner, not reading bugmail]]

I could kiss comment 5 on the mouth.

Comment 7

[David Lawrence [:dkl]]

FWIW, recent BMO customization has been pushed out that makes the attachments table and the comment boxes the same width which helps things line up better on show_bug.cgi. Having alot of groups still causes the comments to be pushed down however.

dkl

Comment 8

[David Lawrence [:dkl]]

Attachment: Patch to use two column layout for comments and groups (v1)

Here is a proof concept (first crack if you will) at converting the current table layout of timetracking, attachments, groups and comments to a two column layout using divs. It is not perfect as a I had to change the collapse/expand links from an unordered list to normal links above the comments to keep them in the same template as the comment code. My other thought was to put the old collapse/expand links in the right side column but use some js/css work to make them always align with the top comment no matter how many groups there are displayed.

Thoughts?
dkl

Comment 9

[Frédéric Buclin]

Screenshot, please. :)

Comment 10

[David Lawrence [:dkl]]

Attachment: group checkboxes before change

Shows the gap between the attachments table and the first comment which groups the more groups you are in.

Comment 11

[David Lawrence [:dkl]]

Attachment: group checkboxes after change

Shows the checkboxes using a 2 column div only layout. more tweaking is needed to make it closer to the other fields on the left but you get the idea. No matter how many groups a person is in it doesn't push the comments down.

Comment 12

[:glob ✱]

Comment on attachment 556115 [details] [diff] [review]
Patch to use two column layout for comments and groups (v1)

i like the idea, but floating the groups right leaves a gap between the comments and the groups, especially on widescreens.  the group list needs to be left aligned in the right column next to the comments.

Comment 13

[David Lawrence [:dkl]]

Attachment: Patch to use two column layout for comments and groups (v2)

New patch that doesn't use width:auto and also floats both divs to the left so the right one butts up against the left instead of going all the way to the right. Seems to look better now to me. Will attach a new screenshot.

dkl

Comment 14

[Max Kanat-Alexander]

Just FYI, if this is going into 5.0, it's likely that this will be pointless as far as upstream goes, as this entire UI is being redesigned. But I am always in favor of incremental improvements, nonetheless.

Comment 15

[David Lawrence [:dkl]]

(In reply to Max Kanat-Alexander from comment #14)
> Just FYI, if this is going into 5.0, it's likely that this will be pointless
> as far as upstream goes, as this entire UI is being redesigned. But I am
> always in favor of incremental improvements, nonetheless.

Yeah we may just hold off on this one for the time being until it becomes a bigger problem, and then just do it as a BMO customization. With Red Hat, it was not uncommon for a product to have 20-30 groups enabled for one bug and so this would be a major issue. But with BMO people generally do not see more than 10 or so groups since they are pretty well filtered by product at the moment.

But if we will have another release before 5.0 then this could be useful to finish and commit.

dkl

Comment 16

[:glob ✱]

(In reply to David Lawrence [:dkl] from comment #15)
> But if we will have another release before 5.0 then this could be useful to
> finish and commit.

looks like there will be a 4.4 release before 5.0; i'll try to review this one soon.

Comment 17

[Frédéric Buclin]

glob: ping?

Comment 18

[Frédéric Buclin]

We are going to branch for Bugzilla 4.4 next week and this bug is too invasive or too risky to be accepted for 4.4 at this point. The target milestone is set to 5.0 which is our next major release.

I ask the assignee to reassign the bug to the default assignee if you don't plan to work on this bug in the near future, to make it clearer which bugs should be fixed by someone else on time for 5.0.

Comment 19

[:glob ✱]

Comment on attachment 557298 [details] [diff] [review]
Patch to use two column layout for comments and groups (v2)

this looks great!

the only thing i think it needs is additional margins around #right to provide a gap between the top of #right and the bottom of #left when the browser window is narrow.  this can be fixed on commit.

Comment 20

[David Lawrence [:dkl]]

Comment on attachment 557298 [details] [diff] [review]
Patch to use two column layout for comments and groups (v2)

Found a bug where the textarea for a new comment is resized horizontally we it displays behind the group list :( We either:

1) limit horizontal resizing to specific percentage, or
2) move the groups div down to align with the top of the comments allowing the comment textarea to resize all it needs to.

Which do you prefer? Either way I will need to make a new patch.

dkl

Comment 21

[:glob ✱]

(In reply to David Lawrence [:dkl] from comment #20)
> Found a bug where the textarea for a new comment is resized horizontally we
> it displays behind the group list :(

it looks like this is happening because the fixed width of "#bz_big_form_parts #left" prevents it from expanding.  if you change it to:

#bz_big_form_parts #left {
    float: left;
    min-width: 55em;
}

then the group list moves out of the way when the textarea is resized. assuming this doesn't cause other issues, that would be my preferred fix for the overlapping issue.

Comment 22

[David Lawrence [:dkl]]

Attachment: 578434_3.patch

Comment 23

[:glob ✱]

Comment on attachment 803064 [details] [diff] [review]
578434_3.patch

r=glob

Comment 24

[David Lawrence [:dkl]]

Committing to: bzr+ssh://[e-mail]/bugzilla/trunk
modified skins/standard/global.css
modified skins/standard/show_bug.css
modified template/en/default/bug/comments.html.tmpl
modified template/en/default/bug/edit.html.tmpl
Committed revision 8742.

Comment 25

[Frédéric Buclin]

Sorry, but the UI is broken for restricted bugs when using the Dusk skin. The group checkboxes appear at the very bottom of the page. With the Classic skin, or if the bug is public, then the UI is fine.

Comment 26

[Frédéric Buclin]

And as discussed on IRC, my screen resolution is 1280 x 1024.

Comment 27

[David Lawrence [:dkl]]

Backed out to make adjustments and will request verification from glob.

dkl

Comment 28

[:glob ✱]

after discussions with dkl, i'll work on finishing this patch.

Comment 29

[Darryl Gtp]

Attachment: same problem

Thanks from stoodalwelpanc1985.