change the way to highlight new code

2 files changed, 13 insertions, 5 deletions

diff --git a/server/sonar-web/src/main/js/source-viewer/viewer.js b/server/sonar-web/src/main/js/source-viewer/viewer.js
index fcb4fb1e958..fd234f62677 100644
--- a/server/sonar-web/src/main/js/source-viewer/viewer.js
+++ b/server/sonar-web/src/main/js/source-viewer/viewer.js
@@ -605,8 +605,10 @@ define([
               $lines = this.$('.source-line');
           this.model.set('filterLinesFunc', func);
           lines.forEach(function (line, idx) {
-            var $line = $($lines[idx]);
-            $line.toggleClass('source-line-shadowed', !func(line));
+            var $line = $($lines[idx]),
+                filtered = func(line) && line.line > 0;
+            $line.toggleClass('source-line-shadowed', !filtered);
+            $line.toggleClass('source-line-filtered', filtered);
           });
         },
 
diff --git a/server/sonar-web/src/main/less/components/source.less b/server/sonar-web/src/main/less/components/source.less
index aae632723b7..43b3ac81dce 100644
--- a/server/sonar-web/src/main/less/components/source.less
+++ b/server/sonar-web/src/main/less/components/source.less
@@ -54,13 +54,19 @@
 }
 
 .source-line-shadowed {
-  opacity: 0.4;
+  .source-line-code {
+    background-color: #f9f9f9;
+  }
+}
 
-  .source-meta {
-    border-color: #f9f9f9 !important;
+.source-line-filtered {
+  .source-line-code {
+    border-left: 4px solid @lightBlue;
+    padding-left: 6px;
   }
 }
 
+
 .source-line-expand {
   .source-line-code {
     background: url(../images/gray-stripes.png) repeat;