Merge pull request #3652 from brodock/beautifull-diff

Diff with better colors and some spacing on the corners

app/assets/stylesheets/sections/commits.scss

@@ -99,12 +99,24 @@
         }
       }
     }
+    .line_holder {
+      &.old .old_line,
+      &.old .new_line {
+        background: #FCC;
+        border-color: #E7BABA;
+      }
+      &.new .old_line,
+      &.new .new_line {
+        background: #CFC;
+        border-color: #B9ECB9;
+      }
+    }
     .line_content {
       display: block;
       white-space: pre;
       height: 18px;
       margin: 0px;
-      padding: 0px;
+      padding: 0px 0.5em;
       border: none;
       &.new {
         background: #CFD;

app/assets/stylesheets/sections/notes.scss

@@ -213,7 +213,17 @@ ul.notes {
 .reply-btn {
   @extend .btn-primary;
 }
-.file .content tr.line_holder:hover > td { background: $hover !important; }
+.file .content tr.line_holder:hover {
+  &> td.line_content {
+    background: $hover !important;
+    border-color: darken($hover, 10%) !important;
+  }
+  &> td.new_line,
+  &> td.old_line {
+    background: darken($hover, 4%) !important;
+    border-color: darken($hover, 10%) !important;
+  }
+}
 .file .content tr.line_holder:hover > td .line_note_link {
   opacity: 1.0;
   filter: alpha(opacity=100);

app/views/commits/_text_file.html.haml

@@ -4,7 +4,7 @@
 
 %table.text-file{class: "#{'hide' if too_big}"}
   - each_diff_line(diff, index) do |line, type, line_code, line_new, line_old|
-    %tr.line_holder{ id: line_code }
+    %tr.line_holder{ id: line_code, class: "#{type}" }
       - if type == "match"
         %td.old_line= "..."
         %td.new_line= "..."