Bug 578434 - Bug group checkboxes lay out poorly beside attachment field

skins/standard/global.css

@@ -286,7 +286,7 @@ div#docslinks {
 }
 
 .bz_comment_text {
-     width: 50em;
+     max-width: 60em;
 }
 
 .bz_comment_user, .bz_comment_time, .bz_comment_number, 
@@ -299,14 +299,6 @@ div#docslinks {
     float: right;
 }
 
-.bz_collapse_expand_comments {
-    padding: 0;
-    margin: 0 0 0 1em;
-    list-style-type: none;
-}
-.bz_collapse_expand_comments li {
-    margin-bottom: .5em;
-}
 .bz_collapse_comment {
     text-decoration: none;
 }
@@ -555,6 +547,19 @@ input.required, select.required, span.required_explanation {
     margin-left: -1px;
 }
 
+#bz_big_form_parts #left {
+    float: left;
+    min-width: 55em;
+    margin-right: 1em;
+    margin-bottom: 1em;
+}
+
+#bz_big_form_parts #right {
+    float: left;
+    width: auto;
+    max-width: 35em;
+}
+
 /*******************/
 /* Form Validation */
 /*******************/

skins/standard/show_bug.css

@@ -66,10 +66,6 @@ table#flags {
     vertical-align: top;
 }
 
-.bz_group_visibility_section {
-    margin-left: 1em;
-}
-
 .bz_group_visibility_section .instructions {
     font-style: italic;
 }

template/en/default/bug/comments.html.tmpl

@@ -56,10 +56,27 @@
 [% END %]
 
 <!-- This auto-sizes the comments and positions the collapse/expand links
-     to the right. -->
-<table class="bz_comment_table" cellpadding="0" cellspacing="0"><tr>
+     above the coments. -->
+<table class="bz_comment_table" cellpadding="0" cellspacing="0">
+[% IF mode == "edit" %]
+  <tr>
+    <td>
+      <div class="bz_collapse_expand_comments">
+        <a href="#" onclick="toggle_all_comments('collapse');
+                             return false;">Collapse All Comments</a> |
+        <a href="#" onclick="toggle_all_comments('expand');
+                             return false;">Expand All Comments</a>
+        [% IF user.settings.comment_box_position.value == "after_comments" && user.id %]
+          | <span class="bz_add_comment"><a href="#"
+                  onclick="return goto_add_comments('bug_status_bottom');">
+                  Add Comment</a></span>
+        [% END %]
+      </div>
+    </td>
+  </tr>
+[% END %]
+<tr>
 <td>
-
 [% FOREACH comment = comments %]
   [% IF comment.count >= start_at %]
     [% PROCESS a_comment %]
@@ -81,21 +98,6 @@
 [% Hook.process("aftercomments") %]
 
 </td>
-<td>
-  [% IF mode == "edit" %]
-    <ul class="bz_collapse_expand_comments">
-      <li><a href="#" onclick="toggle_all_comments('collapse'); 
-                               return false;">Collapse All Comments</a></li>
-      <li><a href="#" onclick="toggle_all_comments('expand');
-                               return false;">Expand All Comments</a></li>
-      [% IF user.settings.comment_box_position.value == "after_comments" && user.id %]
-        <li class="bz_add_comment"><a href="#" 
-            onclick="return goto_add_comments('bug_status_bottom');">
-            Add Comment</a></li>
-      [% END %]                               
-    </ul>
-  [% END %]
-</td>
 </tr></table>
 
 [%############################################################################%]

template/en/default/bug/edit.html.tmpl

@@ -119,12 +119,15 @@
     </tr>
   </table>
 
-  <table id="bz_big_form_parts" cellspacing="0" cellpadding="0"><tr>
-  <td>
+  <div id="bz_big_form_parts">
+    <div id="left">
       [% IF user.is_timetracker %]
+        <div id="timetracking">
           [% PROCESS section_timetracking %]
+        </div>
       [% END %]
 
+      <div id="attachments">
         [%# *** Attachments *** %]
 
         [% PROCESS attachment/list.html.tmpl
@@ -133,15 +136,13 @@
                    num_attachment_flag_types = bug.num_attachment_flag_types
                    show_attachment_flags = bug.show_attachment_flags
         %]
+      </div>
 
       [% IF user.settings.comment_box_position.value == 'before_comments' %]
+        <div id="comment_box">
           [% PROCESS comment_box %]
+        </div>
       [% END %]
-  </td>
-  <td>
-    [% PROCESS section_restrict_visibility %]
-  </td>
-  </tr></table>
 
       [%# *** Additional Comments *** %]
       <div id="comments">
@@ -152,10 +153,20 @@
       </div>
 
       [% IF user.settings.comment_box_position.value == 'after_comments' %]
-    <hr>
+        <div id="comment_box">
           [% PROCESS comment_box %]
+        </div>
       [% END %]
+    </div>
 
+    <div id="right">
+      <div id="restrict_visibility">
+        [% PROCESS section_restrict_visibility %]
+      </div>
+    </div>
+
+    <div style="clear:both;"></div>
+  </div>
 </form>
 
 [%############################################################################%]