daff: add colors

60dfcebc · Jérome Perrin · cfcdf7ad · 60dfcebc · 60dfcebc · 60dfcebc
Commit 60dfcebc authored Jul 23, 2015 by Jérome Perrin
3 changed files
--- a/dream/platform/src/daff/daff.js
+++ b/dream/platform/src/daff/daff.js
@@ -22,7 +22,7 @@

      return this.getElement()
        .push(function (element) {
-          $(element).html(table_diff_html);
+          $(element).addClass("highlighter").html(table_diff_html);
        });
    });
 }(window, jQuery, rJS, JSON, daff));
--- a/dream/platform/src/daff/daff_handsontable.css
+++ b/dream/platform/src/daff/daff_handsontable.css
+.highlighter .add { 
+  background-color: #7fff7f;
+}
+
+.highlighter .remove { 
+  background-color: #ff7f7f;
+}
+
+.highlighter td.modify { 
+  background-color: #7f7fff;
+}
+
+.highlighter td.conflict { 
+  background-color: #f00;
+}
+
+.highlighter .spec { 
+  background-color: #aaa;
+}
+
+.highlighter .move { 
+  background-color: #ffa;
+}
+
+.highlighter .null { 
+  color: #888;
+}
+
+.highlighter table { 
+  border-collapse:collapse;
+}
+
+.highlighter td, .highlighter th {
+  border: 1px solid #2D4068;
+  padding: 3px 7px 2px;
+}
+
+.highlighter th, .highlighter .header { 
+  background-color: #aaf;
+  font-weight: bold;
+  padding-bottom: 4px;
+  padding-top: 5px;
+  text-align:left;
+}
+
+.highlighter tr.header th {
+  border-bottom: 2px solid black;
+}
+
+.highlighter .gap {
+  color: #888;
+}
+
+.highlighter td {
+  empty-cells: show;
+}
+
+.highlighter tr:first-child td {
+  border-top: 1px solid #2D4068;
+}
+
+.highlighter td:first-child { 
+  border-left: 1px solid #2D4068;
+}
+
+.highlighter tr.index td, .highlighter .index, .highlighter tr.header th.index, .highlighter td.index:first-child, .highlighter tr:first-child td.index {
+  background-color: white;
+  border: none;
+}
--- a/dream/platform/src/daff/index.html
+++ b/dream/platform/src/daff/index.html
@@ -2,6 +2,7 @@
 <html>
  <head>
    <meta charset="utf-8">
+    <link rel="stylesheet" href="./daff_handsontable.css"></link>

    <script src="../<%= curl.jquery.relative_dest %>"></script>
    <script src="../<%= copy.rsvp.relative_dest %>"></script>