changeset 4841:bce8e20057e1

repository summary: avoid table bleed on long commit messages For commit messages with the first line being very long, the 'latest changes' table on the repository overview page can 'bleed', so that the commit number overlaps with the commit status. Commit 15cb8156b10d732cf39b37a88c656894621c0f54 changed the initial truncate on 50 characters to a chop at the first newline characters, causing this issue to pop up more frequently. Instead of using floating divs for the commit status and number of comments, use dedicated table columns, as compact as possible. Additionally, move these new columns to the very left of the table, instead of cramming them in between the revision and commit message. The comments-container class gets a new attribute 'white-space: nowrap' to avoid the comment icon to wrap from the number of comments, when the table does wrap on a small screen. Note that the icon currently does not display as it should be renamed from icon-comment-alt/colored to icon-comment. This will be fixed by Sean Farley.
author Thomas De Schampheleire <thomas.de_schampheleire@alcatel-lucent.com>
date Thu, 19 Feb 2015 22:39:53 +0100
parents 49521e9d20cb
children fd8c0117ca22
files kallithea/public/css/style.css kallithea/templates/changelog/changelog_summary_data.html
diffstat 2 files changed, 14 insertions(+), 5 deletions(-) [+]
line wrap: on
line diff
--- a/kallithea/public/css/style.css	Fri Feb 20 10:44:02 2015 +0100
+++ b/kallithea/public/css/style.css	Thu Feb 19 22:39:53 2015 +0100
@@ -1417,6 +1417,10 @@
     padding: 5px;
 }
 
+#content div.box table td.compact {
+    padding: 0;
+}
+
 #content div.box table tr.selected td {
     background: #FFC;
 }
@@ -2582,6 +2586,7 @@
     overflow: hidden;
     padding: 0;
     margin: 0;
+    white-space: nowrap;
 }
 
 #graph_content .comments-container {
--- a/kallithea/templates/changelog/changelog_summary_data.html	Fri Feb 20 10:44:02 2015 +0100
+++ b/kallithea/templates/changelog/changelog_summary_data.html	Thu Feb 19 22:39:53 2015 +0100
@@ -2,6 +2,8 @@
 %if c.repo_changesets:
 <table class="table_disp">
     <tr>
+        <th class="left"></th>
+        <th class="left"></th>
         <th class="left">${_('Revision')}</th>
         <th class="left">${_('Commit Message')}</th>
         <th class="left">${_('Age')}</th>
@@ -10,8 +12,7 @@
     </tr>
 %for cnt,cs in enumerate(c.repo_changesets):
     <tr class="parity${cnt%2}">
-        <td>
-          <div>
+        <td class="compact">
             <div class="changeset-status-container">
               %if c.statuses.get(cs.raw_id):
                 <div class="changeset-status-ico shortlog">
@@ -24,18 +25,21 @@
                 %endif
                 </div>
               %endif
+            </div>
+        </td>
+        <td class="compact">
               %if c.comments.get(cs.raw_id,[]):
                <div class="comments-container">
                    <div title="${('comments')}">
                        <a href="${h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id,anchor='comment-%s' % c.comments[cs.raw_id][0].comment_id)}">
-                          <i class="icon-comment-alt icon-comment-colored"></i> ${len(c.comments[cs.raw_id])}
+                          <i class="icon-comment-alt icon-comment-colored"></i>${len(c.comments[cs.raw_id])}
                        </a>
                    </div>
                </div>
               %endif
-            </div>
+        </td>
+        <td>
             <pre><a href="${h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id)}">${h.show_id(cs)}</a></pre>
-         </div>
         </td>
         <td>
             ${h.urlify_commit(h.chop_at(cs.message,'\n'),c.repo_name, h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}