Pretty highlighted diffs for every theme

4 files changed, 31 insertions, 11 deletions

diff --git a/app/assets/stylesheets/highlight/dark.scss b/app/assets/stylesheets/highlight/dark.scss
index 3ba2cc94ad2..8464727de9d 100644
--- a/app/assets/stylesheets/highlight/dark.scss
+++ b/app/assets/stylesheets/highlight/dark.scss
@@ -22,11 +22,16 @@
   // Diff line
   .line_holder {
     .diff-line-num.new, .line_content.new {
-      @include diff_background(51, 255, 51, #808080);
+      @include diff_background(rgba(51, 255, 51, 0.1), rgba(51, 255, 51, 0.2), #808080);
     }
 
     .diff-line-num.old, .line_content.old {
-      @include diff_background(255, 51, 51, #808080);
+      @include diff_background(rgba(255, 51, 51, 0.2), rgba(255, 51, 51, 0.2), #808080);
+    }
+
+    .line_content.match {
+      color: rgba(255, 255, 255, 0.3);
+      background: rgba(255, 255, 255, 0.1);
     }
   }
 
diff --git a/app/assets/stylesheets/highlight/monokai.scss b/app/assets/stylesheets/highlight/monokai.scss
index b47aef73d2b..516d8aef960 100644
--- a/app/assets/stylesheets/highlight/monokai.scss
+++ b/app/assets/stylesheets/highlight/monokai.scss
@@ -6,7 +6,7 @@
   }
 
   .diff-line-num, .diff-line-num a {
-    color: #f8f8f2;
+    color: rgba(255, 255, 255, 0.3);
   }
 
   // Code itself
@@ -22,11 +22,16 @@
   // Diff line
   .line_holder {
     .diff-line-num.new, .line_content.new {
-      @include diff_background(156, 175, 183, #808080);
+      @include diff_background(rgba(166, 226, 46, 0.2), rgba(166, 226, 46, 0.3), #808080);
     }
 
     .diff-line-num.old, .line_content.old {
-      @include diff_background(254, 147, 140, #808080);
+      @include diff_background(rgba(254, 147, 140, 0.2), rgba(254, 147, 140, 0.3), #808080);
+    }
+
+    .line_content.match {
+      color: rgba(255, 255, 255, 0.3);
+      background: rgba(255, 255, 255, 0.1);
     }
   }
 
diff --git a/app/assets/stylesheets/highlight/solarized_dark.scss b/app/assets/stylesheets/highlight/solarized_dark.scss
index 0aab580bd3c..ae7ecc65c39 100644
--- a/app/assets/stylesheets/highlight/solarized_dark.scss
+++ b/app/assets/stylesheets/highlight/solarized_dark.scss
@@ -6,7 +6,7 @@
   }
 
   .diff-line-num, .diff-line-num a {
-    color: #93a1a1;
+    color: rgba(255, 255, 255, 0.3);
   }
 
   // Code itself
@@ -22,11 +22,16 @@
   // Diff line
   .line_holder {
     .diff-line-num.new, .line_content.new {
-      @include diff_background(255, 255, 255, #808080);
+      @include diff_background(rgba(133, 153, 0, 0.2), rgba(133, 153, 0, 0.3), #808080);
     }
 
     .diff-line-num.old, .line_content.old {
-      @include diff_background(255, 51, 51, #808080);
+      @include diff_background(rgba(220, 50, 47, 0.2), rgba(220, 50, 47, 0.3), #808080);
+    }
+
+    .line_content.match {
+      color: rgba(255, 255, 255, 0.3);
+      background: rgba(255, 255, 255, 0.1);
     }
   }
 
diff --git a/app/assets/stylesheets/highlight/solarized_light.scss b/app/assets/stylesheets/highlight/solarized_light.scss
index 3aaadcd0f96..1c138572145 100644
--- a/app/assets/stylesheets/highlight/solarized_light.scss
+++ b/app/assets/stylesheets/highlight/solarized_light.scss
@@ -6,7 +6,7 @@
   }
 
   .diff-line-num, .diff-line-num a {
-    color: #586e75;
+    color: rgba(0, 0, 0, 0.3);
   }
 
   // Code itself
@@ -22,11 +22,16 @@
   // Diff line
   .line_holder {
     .diff-line-num.new, .line_content.new {
-      @include diff_background(92, 164, 169, #FAF3DD);
+      @include diff_background(rgba(133, 153, 0, 0.2), rgba(133, 153, 0, 0.3), #FAF3DD);
     }
 
     .diff-line-num.old, .line_content.old {
-      @include diff_background(237, 106, 90, #FAF3DD);
+      @include diff_background(rgba(220, 50, 47, 0.2), rgba(220, 50, 47, 0.3), #FAF3DD);
+    }
+
+    .line_content.match {
+      color: rgba(0, 0, 0, 0.3);
+      background: rgba(255, 255, 255, 0.4);
     }
   }