SONAR-8643 Make the color palette consistent

diff --git a/server/sonar-web/src/main/js/apps/component-measures/details/treemap/MeasureTreemap.js b/server/sonar-web/src/main/js/apps/component-measures/details/treemap/MeasureTreemap.js
index 12060645ba4103039891571baf3d9a104fdd51f5..5cd860c9ab5e4bf33fffaab9bc69e1b29bf7db9e 100644 (file)
--- a/server/sonar-web/src/main/js/apps/component-measures/details/treemap/MeasureTreemap.js
+++ b/server/sonar-web/src/main/js/apps/component-measures/details/treemap/MeasureTreemap.js
@@ -101,21 +101,21 @@ export default class MeasureTreemap extends React.Component {
   getPercentColorScale (metric) {
     const color = d3.scale.linear().domain([0, 25, 50, 75, 100]);
     color.range(metric.direction === 1 ?
-        ['#ee0000', '#f77700', '#ffee00', '#80cc00', '#00aa00'] :
-        ['#00aa00', '#80cc00', '#ffee00', '#f77700', '#ee0000']);
+        ['#d4333f', '#ed7d20', '#eabe06', '#b0d513', '#00aa00'] :
+        ['#00aa00', '#b0d513', '#eabe06', '#ed7d20', '#d4333f']);
     return color;
   }
 
   getRatingColorScale () {
     return d3.scale.linear()
         .domain([1, 2, 3, 4, 5])
-        .range(['#00aa00', '#80cc00', '#ffee00', '#f77700', '#ee0000']);
+        .range(['#00aa00', '#b0d513', '#eabe06', '#ed7d20', '#d4333f']);
   }
 
   getLevelColorScale () {
     return d3.scale.ordinal()
         .domain(['ERROR', 'WARN', 'OK', 'NONE'])
-        .range(['#d4333f', '#ff9900', '#85bb43', '##b4b4b4']);
+        .range(['#d4333f', '#ed7d20', '#00aa00', '#b4b4b4']);
   }
 
   getScale () {

diff --git a/server/sonar-web/src/main/js/apps/overview/styles.css b/server/sonar-web/src/main/js/apps/overview/styles.css
index 5778a0ceaefdea57cee46fdb23c7ff712fd233ff..609305faa346bece30788e3e6230c2d2ba12d60d 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/styles.css
+++ b/server/sonar-web/src/main/js/apps/overview/styles.css
@@ -110,7 +110,7 @@
 }
 
 .overview-quality-gate-condition-warn {
-  border-color: #f90;
+  border-color: #ed7d20;
 }
 
 .overview-quality-gate-condition-error .overview-quality-gate-threshold {
@@ -118,7 +118,7 @@
 }
 
 .overview-quality-gate-condition-warn .overview-quality-gate-threshold {
-  color: #f90;
+  color: #ed7d20;
 }
 
 

diff --git a/server/sonar-web/src/main/js/components/source-viewer/templates/measures/_source-viewer-measures-coverage.hbs b/server/sonar-web/src/main/js/components/source-viewer/templates/measures/_source-viewer-measures-coverage.hbs
index 7258237382a7621cd3a9165fd1e58c0cf079fc85..2598e962d774204a4a02ce71ddebb09501c1a14d 100644 (file)
--- a/server/sonar-web/src/main/js/components/source-viewer/templates/measures/_source-viewer-measures-coverage.hbs
+++ b/server/sonar-web/src/main/js/components/source-viewer/templates/measures/_source-viewer-measures-coverage.hbs
@@ -4,7 +4,7 @@
       <span class="js-pie-chart"
             data-value="{{measures.coverage_raw}}"
             data-max="100"
-            data-color="#85bb43"
+            data-color="#00aa00"
             data-base-color="#d4333f"
             data-size="47"></span>
     </div>

diff --git a/server/sonar-web/src/main/js/components/ui/CoverageRating.js b/server/sonar-web/src/main/js/components/ui/CoverageRating.js
index bb65d33d7c3824f13a29575f9b1ce54588b51185..177bc35673d8b62e696315d69cdb272b62eea39c 100644 (file)
--- a/server/sonar-web/src/main/js/components/ui/CoverageRating.js
+++ b/server/sonar-web/src/main/js/components/ui/CoverageRating.js
@@ -30,7 +30,7 @@ const SIZE_TO_WIDTH_MAPPING = {
 const SIZE_TO_THICKNESS_MAPPING = {
   'small': 2,
   'normal': 3,
-  'big': 4
+  'big': 3
 };
 
 export default class CoverageRating extends React.Component {
@@ -51,8 +51,8 @@ export default class CoverageRating extends React.Component {
     if (this.props.value != null) {
       const value = Number(this.props.value);
       data = [
-        { value, fill: this.props.muted ? '#bdbdbd' : '#85bb43' },
-        { value: 100 - value, fill: this.props.muted ? '#f3f3f3' : '#d4333f' }
+        { value, fill: this.props.muted ? '#bdbdbd' : '#00aa00' },
+        { value: 100 - value, fill: '#d4333f' }
       ];
     }
 

diff --git a/server/sonar-web/src/main/js/components/ui/DuplicationsRating.css b/server/sonar-web/src/main/js/components/ui/DuplicationsRating.css
index 6e9842abc7764150a898060c48d7b57c4bf803c7..f8b14c03087e14b9f8cf8984401ba15c6e54d050 100644 (file)
--- a/server/sonar-web/src/main/js/components/ui/DuplicationsRating.css
+++ b/server/sonar-web/src/main/js/components/ui/DuplicationsRating.css
@@ -6,7 +6,7 @@
   align-items: center;
   width: 24px;
   height: 24px;
-  border: 3px solid #f3ca8e;
+  border: 3px solid #ed7d20;
   border-radius: 24px;
   box-sizing: border-box;
 }
@@ -33,21 +33,25 @@
 
 .duplications-rating:after {
   border-radius: 24px;
-  background-color: #f3ca8e;
   content: "";
 }
 
 .duplications-rating-A {
-  border-color: #85bb43;
+  border-color: #00aa00;
 }
 
 .duplications-rating-A:after {
   display: none;
 }
 
+.duplications-rating-B {
+  border-color: #b0d513;
+}
+
 .duplications-rating-B:after {
   width: 6px;
   height: 6px;
+  background-color: #b0d513;
 }
 
 .duplications-rating-small.duplications-rating-B:after {
@@ -60,9 +64,14 @@
   height: 12px;
 }
 
+.duplications-rating-C {
+  border-color: #eabe06;
+}
+
 .duplications-rating-C:after {
   width: 8px;
   height: 8px;
+  background-color: #eabe06;
 }
 
 .duplications-rating-small.duplications-rating-C:after {
@@ -76,13 +85,13 @@
 }
 
 .duplications-rating-D {
-  border-color: #d4333f;
+  border-color: #ed7d20;
 }
 
 .duplications-rating-D:after {
   width: 12px;
   height: 12px;
-  background-color: #d4333f;
+  background-color: #ed7d20;
 }
 
 .duplications-rating-small.duplications-rating-D:after {

diff --git a/server/sonar-web/src/main/js/components/ui/Level.css b/server/sonar-web/src/main/js/components/ui/Level.css
index 0d2a90de193bebcf2c9569c0daf0663dab963578..e48587f6e8ac59f53d94a44a797df08a546bcfe5 100644 (file)
--- a/server/sonar-web/src/main/js/components/ui/Level.css
+++ b/server/sonar-web/src/main/js/components/ui/Level.css
@@ -37,11 +37,11 @@ a > .level:hover {
 }
 
 .level-OK {
-  background-color: #85bb43;
+  background-color: #00aa00;
 }
 
 .level-WARN {
-  background-color: #f90;
+  background-color: #ed7d20;
 }
 
 .level-ERROR {

diff --git a/server/sonar-web/src/main/js/components/ui/Rating.css b/server/sonar-web/src/main/js/components/ui/Rating.css
index f2bffe4ea8170cfe2d06d88d6333acc0ea1f1b9f..e470205830260bf05e97b449757d7992cf973a24 100644 (file)
--- a/server/sonar-web/src/main/js/components/ui/Rating.css
+++ b/server/sonar-web/src/main/js/components/ui/Rating.css
@@ -38,32 +38,30 @@ a > .rating:hover {
 }
 
 .rating-A {
-  background-color: #0a0;
+  background-color: #00aa00;
 }
 
 a > .rating-A {
-  border-bottom-color: #0a0;
+  border-bottom-color: #00aa00;
 }
 
 .rating-B {
-  background-color: #80cc00;
+  background-color: #b0d513;
 }
 
-a .rating-B { border-bottom-color: #80cc00; }
+a .rating-B { border-bottom-color: #b0d513; }
 
 .rating-C {
-  background-color: #fe0;
-  color: #444;
-  text-shadow: none;
+  background-color: #eabe06;
 }
 
-a .rating-C { border-bottom-color: #fe0; }
+a .rating-C { border-bottom-color: #eabe06; }
 
 .rating-D {
-  background-color: #f77700;
+  background-color: #ed7d20;
 }
 
-a .rating-D { border-bottom-color: #f77700; }
+a .rating-D { border-bottom-color: #ed7d20; }
 
 .rating-E {
   background-color: #e00;

diff --git a/server/sonar-web/src/main/js/helpers/constants.js b/server/sonar-web/src/main/js/helpers/constants.js
index 14d5a2f3b423303668238d075131024500e5191c..802a12c23277cae93cadc2273ca946bd83f9eb15 100644 (file)
--- a/server/sonar-web/src/main/js/helpers/constants.js
+++ b/server/sonar-web/src/main/js/helpers/constants.js
@@ -20,5 +20,5 @@
 export const SEVERITIES = ['BLOCKER', 'CRITICAL', 'MAJOR', 'MINOR', 'INFO'];
 export const STATUSES = ['OPEN', 'REOPENED', 'CONFIRMED', 'RESOLVED', 'CLOSED'];
 
-export const CHART_COLORS_RANGE_PERCENT = ['#00aa00', '#80cc00', '#ffee00', '#f77700', '#ee0000'];
-export const CHART_REVERSED_COLORS_RANGE_PERCENT = ['#ee0000', '#f77700', '#ffee00', '#80cc00', '#00aa00'];
+export const CHART_COLORS_RANGE_PERCENT = ['#00aa00', '#b0d513', '#eabe06', '#ed7d20', '#d4333f'];
+export const CHART_REVERSED_COLORS_RANGE_PERCENT = ['#d4333f', '#ed7d20', '#eabe06', '#b0d513', '#00aa00'];

diff --git a/server/sonar-web/src/main/less/deprecated.less b/server/sonar-web/src/main/less/deprecated.less
index bb8bb2652e590ffcb7b08b566cf38be050185fce..eb5e54dd766af5ee1ac38d9ab24e7e14667f54f2 100644 (file)
--- a/server/sonar-web/src/main/less/deprecated.less
+++ b/server/sonar-web/src/main/less/deprecated.less
@@ -343,13 +343,13 @@ div.autocompleteNote {
 }
 
 .color_OK {
-  border: 2px solid #85bb43 !important;
-  color: #85bb43 !important;
+  border: 2px solid #00aa00 !important;
+  color: #00aa00 !important;
 }
 
 .color_WARN {
-  border: 2px solid #f90 !important;
-  color: #f90 !important;
+  border: 2px solid #ed7d20 !important;
+  color: #ed7d20 !important;
 }
 
 .color_ERROR {

diff --git a/server/sonar-web/src/main/less/init/tables.less b/server/sonar-web/src/main/less/init/tables.less
index 427536371bb4d1a811a2a405cde6810eb6b5c5c3..63809c03cca7cba091ff407ca56b74426f11f254 100644 (file)
--- a/server/sonar-web/src/main/less/init/tables.less
+++ b/server/sonar-web/src/main/less/init/tables.less
@@ -234,7 +234,7 @@ td.sep {
 
 .formError {
   display: inline-block;
-  background-color: #FF9090;
+  background-color: #ed7d20;
   color: #000;
   padding: 0 5px;
 }

diff --git a/server/sonar-web/src/main/less/variables.less b/server/sonar-web/src/main/less/variables.less
index 57871ac69c2b603e3b2ad80878e0c01f36217ba3..51a49a78e71f1735ff8452a91d23b98fabdb8e53 100644 (file)
--- a/server/sonar-web/src/main/less/variables.less
+++ b/server/sonar-web/src/main/less/variables.less
@@ -65,16 +65,16 @@
 
 @blue: #4b9fd5;
 @lightBlue: #cae3f2;
+@darkBlue: darken(@blue, 20%);
+@green: #00aa00;
+@lightGreed: #b0d513;
+@yellow: #eabe06;
+@orange: #ed7d20;
 @red: #d4333f;
 @lightRed: #d49f98;
-@green: #85bb43;
-@yellow: #fede06;
-@orange: #f90;
 @lightOrange: #f3ca8e;
 @purple: #9139d4;
 
-@darkBlue: darken(@blue, 20%);
-
 @darkColor: #262626;
 @lightColor: #fff;