Improve commits list UI

app/assets/stylesheets/sections/commits.scss

@@ -345,46 +345,6 @@
 }
 
 
-/**
- * COMMIT ROW
- */
-.commit {
-  .browse_code_link_holder {
-    float: right;
-  }
-
-  .committed_ago {
-    float: right;
-    @extend .cgray;
-  }
-
-  .notes_count {
-    float: right;
-    margin-right: 10px;
-  }
-
-  code {
-    background: #FCEEC1;
-    color: $style_color;
-  }
-
-  .commit_short_id {
-    float: left;
-    @extend .lined;
-    min-width: 65px;
-    font-family: $monospace_font;
-  }
-
-  .row_title {
-    font-weight: bold;
-    color: #444;
-    &:hover {
-      color: #444;
-      text-decoration: underline;
-    }
-  }
-}
-
 .file-stats a {
   color: $style_color;
 }
@@ -472,24 +432,6 @@
   line-height: 2;
 }
 
-li.commit {
-  .avatar {
-    width: 24px;
-    top:-5px;
-    margin-right: 5px;
-    margin-left: 10px;
-  }
-
-  code {
-    padding: 2px 2px 0;
-    margin-top: -2px;
-    &:hover {
-      color: black;
-      border: 1px solid #ccc;
-    }
-  }
-}
-
 .commit-breadcrumb {
   padding: 0;
 }
@@ -506,8 +448,50 @@ li.commit {
   }
 }
 
-.commits-row {
-  padding-bottom: 10px;
-  margin-bottom: 10px;
-  border-bottom: 1px solid #DDD;
+.lists-separator {
+  margin: 10px 0;
+  border-top: 1px dashed #CCC;
+}
+
+/**
+ * COMMIT ROW
+ */
+li.commit {
+  padding: 8px;
+
+  .commit-row-title {
+    font-size: 14px;
+    margin-bottom: 2px;
+
+    .notes_count {
+      float: right;
+      margin-right: 10px;
+    }
+
+    .commit_short_id {
+      float: left;
+      min-width: 65px;
+      font-family: $monospace_font;
+    }
+
+    .commit-row-message {
+      color: #555;
+      font-weight: bolder;
+      &:hover {
+        color: #444;
+        text-decoration: underline;
+      }
+    }
+  }
+
+  .commit-row-info {
+    a {
+      color: #777;
+    }
+
+    .committed_ago {
+      float: right;
+      @extend .cgray;
+    }
+  }
 }

app/views/projects/commits/_commit.html.haml

 %li.commit
-  .browse_code_link_holder
-    %p
-      %strong= link_to "Browse Code »", project_tree_path(project, commit), class: "right"
-  %p
+  .commit-row-title
     = link_to commit.short_id(8), project_commit_path(project, commit), class: "commit_short_id"
-    = commit_author_link(commit, avatar: true, size: 24)
      
-    = link_to_gfm truncate(commit.title, length: 70), project_commit_path(project, commit.id), class: "row_title"
-
-    %time.committed_ago{ datetime: commit.committed_date, title: commit.committed_date.stamp("Aug 21, 2011 9:23pm") }
-      = time_ago_in_words(commit.committed_date)
-      ago
-       
-
-    %span.notes_count
+    = link_to_gfm truncate(commit.title, length: 70), project_commit_path(project, commit.id), class: "commit-row-message"
+    = link_to "Browse Code »", project_tree_path(project, commit), class: "pull-right"
+    .notes_count
       - notes = project.notes.for_commit_id(commit.id)
       - if notes.any?
         %span.badge.badge-info
           %i.icon-comment
           = notes.count
+
+  .commit-row-info
+    = commit_author_link(commit, avatar: true, size: 16)
+    %time.committed_ago{ datetime: commit.committed_date, title: commit.committed_date.stamp("Aug 21, 2011 9:23pm") }
+      = time_ago_in_words(commit.committed_date)
+      ago
+       

app/views/projects/commits/_commits.html.haml

@@ -8,3 +8,4 @@
     .span10
       %ul.well-list
         = render commits, project: @project
+  %hr.lists-separator