annotations: fixed UI problems in annotation view for newer browsers.

rhodecode/public/css/code-block.less

@@ -969,17 +969,6 b' table.cb {'
     tr {
         &.cb-annotate {
             border-top: 1px solid #eee;
-
-            &+ .cb-line {
-                border-top: 1px solid #eee;
-            }
-
-            &:first-child {
-                border-top: none;
-                &+ .cb-line {
-                    border-top: none;
-                }
-            }
         }
 
         &.cb-hunk {
@@ -1114,7 +1103,9 b' table.cb {'
                 background: #ffdddd;
             }
         }
-
+        &.cb-annotate-message-spacer {
+             width:8px;
+        }
         &.cb-annotate-info {
             width: 320px;
             min-width: 320px;
@@ -1122,22 +1113,23 b' table.cb {'
             padding: 5px 2px;
             font-size: 13px;
 
-            strong.cb-annotate-message {
-                padding: 5px 0;
+            .cb-annotate-message {
+                padding: 2px 0px 0px 0px;
                 white-space: pre-line;
-                display: inline-block;
+                overflow: hidden;
             }
             .rc-user {
                 float: none;
                 padding: 0 6px 0 17px;
-                min-width: auto;
-                min-height: auto;
+                min-width: unset;
+                min-height: unset;
             }
         }
 
         &.cb-annotate-revision {
             cursor: pointer;
             text-align: right;
+            padding: 1px 3px 0px 3px;
         }
     }
 }

rhodecode/templates/codeblocks/source.mako

@@ -1,16 +1,50 b''
 <%def name="render_line(line_num, tokens,
                         annotation=None,
-                        bgcolor=None)">
+                        bgcolor=None, show_annotation=None)">
     <%
     from rhodecode.lib.codeblocks import render_tokenstream
     # avoid module lookup for performance
     html_escape = h.html_escape
     %>
-    <tr class="cb-line cb-line-fresh"
+    <tr class="cb-line cb-line-fresh ${'cb-annotate' if show_annotation else ''}"
     %if annotation:
     data-revision="${annotation.revision}"
     %endif
     >
+
+    % if annotation:
+        % if show_annotation:
+            <td class="cb-annotate-info tooltip"
+                title="Author: ${annotation.author | entity}<br>Date: ${annotation.date}<br>Message: ${annotation.message | entity}"
+            >
+              ${h.gravatar_with_user(annotation.author, 16) | n}
+              <div class="cb-annotate-message truncate-wrap">${h.chop_at_smart(annotation.message, '\n', suffix_if_chopped='...')}</div>
+            </td>
+            <td class="cb-annotate-message-spacer"></td>
+            <td
+              class="cb-annotate-revision"
+              data-revision="${annotation.revision}"
+              onclick="$('[data-revision=${annotation.revision}]').toggleClass('cb-line-fresh')"
+              style="background: ${bgcolor}">
+            <a class="cb-annotate" href="${h.url('changeset_home',repo_name=c.repo_name,revision=annotation.raw_id)}">
+              r${annotation.revision}
+            </a>
+            </td>
+        % else:
+            <td></td>
+            <td class="cb-annotate-message-spacer"></td>
+            <td
+              class="cb-annotate-revision"
+              data-revision="${annotation.revision}"
+              onclick="$('[data-revision=${annotation.revision}]').toggleClass('cb-line-fresh')"
+              style="background: ${bgcolor}">
+            </td>
+        % endif
+    % else:
+        <td colspan="3"></td>
+    % endif
+
+
     <td class="cb-lineno" id="L${line_num}">
       <a data-line-no="${line_num}" href="#L${line_num}"></a>
     </td>
@@ -27,40 +61,11 b''
 </%def>
 
 <%def name="render_annotation_lines(annotation, lines, color_hasher)">
-  <%
-  rowspan = len(lines) + 1 # span the line's <tr> and annotation <tr>
-  %>
-  %if not annotation:
-  <tr class="cb-annotate">
-    <td class="cb-annotate-message" rowspan="${rowspan}"></td>
-    <td class="cb-annotate-revision" rowspan="${rowspan}"></td>
-  </tr>
-  %else:
-  <tr class="cb-annotate">
-    <td class="cb-annotate-info tooltip"
-        rowspan="${rowspan}"
-        title="Author: ${annotation.author | entity}<br>Date: ${annotation.date}<br>Message: ${annotation.message | entity}"
-    >
-      ${h.gravatar_with_user(annotation.author, 16) | n}
-      <strong class="cb-annotate-message">${h.truncate(annotation.message, len(lines) * 30)}</strong>
-    </td>
-    <td
-      class="cb-annotate-revision"
-      rowspan="${rowspan}"
-      data-revision="${annotation.revision}"
-      onclick="$('[data-revision=${annotation.revision}]').toggleClass('cb-line-fresh')"
-      style="background: ${color_hasher(annotation.raw_id)}">
-    <a href="${h.url('changeset_home',repo_name=c.repo_name,revision=annotation.raw_id)}">
-      r${annotation.revision}
-    </a>
-    </td>
-  </tr>
-  %endif
-
   %for line_num, tokens in lines:
     ${render_line(line_num, tokens,
       bgcolor=color_hasher(annotation and annotation.raw_id or ''),
-      annotation=annotation,
+      annotation=annotation, show_annotation=loop.first
       )}
   %endfor
+
 </%def>