SONAR-12539 More consistent colors for leak metrics border

6 files changed, 20 insertions, 20 deletions

diff --git a/server/sonar-web/src/main/js/app/styles/init/misc.css b/server/sonar-web/src/main/js/app/styles/init/misc.css
index d209ecbd8fb..bd3ba06d26f 100644
--- a/server/sonar-web/src/main/js/app/styles/init/misc.css
+++ b/server/sonar-web/src/main/js/app/styles/init/misc.css
@@ -473,7 +473,7 @@ th.huge-spacer-right {
 }
 
 .leak-box {
-  background-color: var(--leakColor);
-  border: 1px solid var(--leakBorderColor);
+  background-color: var(--leakPrimaryColor);
+  border: 1px solid var(--leakSecondaryColor);
   padding: 4px 6px;
 }
diff --git a/server/sonar-web/src/main/js/app/theme.js b/server/sonar-web/src/main/js/app/theme.js
index 5796ca65c00..f8595e9a861 100644
--- a/server/sonar-web/src/main/js/app/theme.js
+++ b/server/sonar-web/src/main/js/app/theme.js
@@ -64,8 +64,8 @@ module.exports = {
     mandatoryFieldColor: '#a4030f',
 
     // leak
-    leakColor: '#fbf3d5',
-    leakBorderColor: '#eae3c7',
+    leakPrimaryColor: '#fbf3d5',
+    leakSecondaryColor: '#f1e8cb',
 
     snippetFontColor: '#f0f0f0',
 
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 1acd134e8e0..dfa82a9d694 100644
--- a/server/sonar-web/src/main/js/apps/overview/styles.css
+++ b/server/sonar-web/src/main/js/apps/overview/styles.css
@@ -91,7 +91,7 @@
 }
 
 .overview-quality-gate-condition-leak {
-  background-color: var(--leakColor);
+  background-color: var(--leakPrimaryColor);
 }
 
 .overview-quality-gate-condition-metric,
@@ -206,7 +206,7 @@
 
 .overview-domain-leak {
   flex: 2;
-  background-color: var(--leakColor);
+  background-color: var(--leakPrimaryColor);
 }
 
 .overview-domain-leak .overview-domain-measures {
@@ -450,7 +450,7 @@
   right: -1px;
   padding: 5px 0 2px;
   border: 1px solid var(--barBorderColor);
-  background-color: var(--leakColor);
+  background-color: var(--leakPrimaryColor);
   font-size: var(--mediumFontSize);
   text-align: center;
   transform: translateY(-4px);
diff --git a/server/sonar-web/src/main/js/apps/projects/styles.css b/server/sonar-web/src/main/js/apps/projects/styles.css
index bf04dc9a2b5..279ae1b0449 100644
--- a/server/sonar-web/src/main/js/apps/projects/styles.css
+++ b/server/sonar-web/src/main/js/apps/projects/styles.css
@@ -86,8 +86,8 @@
 .project-card-leak-date {
   padding: 4px 8px;
   margin: -5px -4px -5px 24px;
-  background-color: var(--leakColor);
-  border: 1px solid var(--leakBorderColor);
+  background-color: var(--leakPrimaryColor);
+  border: 1px solid var(--leakSecondaryColor);
 }
 
 .project-card-measures {
@@ -100,17 +100,17 @@
   display: flex;
   padding: 8px 0;
   margin: 4px -4px;
-  background-color: var(--leakColor);
-  border: 1px solid var(--leakBorderColor);
+  background-color: var(--leakPrimaryColor);
+  border: 1px solid var(--leakSecondaryColor);
 }
 
 .projects-leak-sorting-option {
-  background-color: var(--leakColor);
+  background-color: var(--leakPrimaryColor);
   margin-bottom: 2px;
 }
 
 .projects-leak-sorting-option.is-focused {
-  background-color: var(--leakBorderColor);
+  background-color: var(--leakSecondaryColor);
 }
 
 .project-card-measure {
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/Line.css b/server/sonar-web/src/main/js/components/SourceViewer/components/Line.css
index 0c034c301ae..6641874c03c 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/components/Line.css
+++ b/server/sonar-web/src/main/js/components/SourceViewer/components/Line.css
@@ -53,7 +53,7 @@
 }
 
 .source-line-filtered .source-line-code {
-  background-color: var(--leakColor) !important;
+  background-color: var(--leakPrimaryColor) !important;
 }
 
 .source-line-filtered.source-line-highlighted .source-line-code,
@@ -62,7 +62,7 @@
 }
 
 .source-line-filtered:hover .source-line-code {
-  background-color: #f1e8cb !important;
+  background-color: var(--leakSecondaryColor) !important;
 }
 
 .source-line-filtered.source-line-filtered-dark .source-line-code {
diff --git a/server/sonar-web/src/main/js/components/search-navigator.css b/server/sonar-web/src/main/js/components/search-navigator.css
index 74fef2124af..617b82c9424 100644
--- a/server/sonar-web/src/main/js/components/search-navigator.css
+++ b/server/sonar-web/src/main/js/components/search-navigator.css
@@ -38,8 +38,8 @@
 }
 
 .search-navigator-facet-box.leak-facet-box {
-  background-color: var(--leakColor);
-  border: 1px solid var(--leakBorderColor);
+  background-color: var(--leakPrimaryColor);
+  border: 1px solid var(--leakSecondaryColor);
 }
 
 .search-navigator-facet-box.is-inner {
@@ -173,15 +173,15 @@ a.search-navigator-facet:focus,
 }
 
 .leak-facet-box .search-navigator-facet .facet-name {
-  background-color: var(--leakColor);
+  background-color: var(--leakPrimaryColor);
 }
 
 .leak-facet-box .search-navigator-facet .facet-stat {
-  background-color: var(--leakColor);
+  background-color: var(--leakPrimaryColor);
 }
 
 .leak-facet-box .search-navigator-facet .facet-stat:before {
-  background-image: linear-gradient(to right, rgba(251, 243, 213, 0), var(--leakColor) 75%);
+  background-image: linear-gradient(to right, rgba(251, 243, 213, 0), var(--leakPrimaryColor) 75%);
 }
 
 .search-navigator-facet.active {