SONAR-10188 Update project/organization header

3 files changed, 38 insertions, 17 deletions

diff --git a/server/sonar-web/src/main/js/components/common/BranchStatus.css b/server/sonar-web/src/main/js/components/common/BranchStatus.css
index ccfccb351f1..ac0a177c6a5 100644
--- a/server/sonar-web/src/main/js/components/common/BranchStatus.css
+++ b/server/sonar-web/src/main/js/components/common/BranchStatus.css
@@ -1,5 +1,8 @@
 .branch-status {
+  display: flex;
+  align-items: center;
   min-width: 64px;
+  line-height: calc(2 * var(--gridSize));
   text-align: right;
 }
 
diff --git a/server/sonar-web/src/main/js/components/common/BranchStatus.tsx b/server/sonar-web/src/main/js/components/common/BranchStatus.tsx
index bb9069bc234..e0e4fa55b1d 100644
--- a/server/sonar-web/src/main/js/components/common/BranchStatus.tsx
+++ b/server/sonar-web/src/main/js/components/common/BranchStatus.tsx
@@ -44,26 +44,26 @@ export default function BranchStatus({ branch, concise = false }: Props) {
     const indicatorColor = totalIssues > 0 ? 'red' : 'green';
 
     return concise ? (
-      <ul className="list-inline branch-status">
+      <ul className="branch-status">
         <li>{totalIssues}</li>
         <li className="spacer-left">
           <StatusIndicator color={indicatorColor} size="small" />
         </li>
       </ul>
     ) : (
-      <ul className="list-inline branch-status">
+      <ul className="branch-status">
         <li className="spacer-right">
           <StatusIndicator color={indicatorColor} size="small" />
         </li>
-        <li>
+        <li className="spacer-left">
           {branch.status.bugs}
           <BugIcon />
         </li>
-        <li>
+        <li className="spacer-left">
           {branch.status.vulnerabilities}
           <VulnerabilityIcon />
         </li>
-        <li>
+        <li className="spacer-left">
           {branch.status.codeSmells}
           <CodeSmellIcon />
         </li>
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/BranchStatus-test.tsx.snap b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/BranchStatus-test.tsx.snap
index 8833bab3ceb..d648e77db49 100644
--- a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/BranchStatus-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/BranchStatus-test.tsx.snap
@@ -16,7 +16,7 @@ exports[`renders status of long-living branches 2`] = `
 
 exports[`renders status of short-living branches 1`] = `
 <ul
-  className="list-inline branch-status"
+  className="branch-status"
 >
   <li
     className="spacer-right"
@@ -26,15 +26,21 @@ exports[`renders status of short-living branches 1`] = `
       size="small"
     />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     0
     <BugIcon />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     0
     <VulnerabilityIcon />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     0
     <CodeSmellIcon />
   </li>
@@ -43,7 +49,7 @@ exports[`renders status of short-living branches 1`] = `
 
 exports[`renders status of short-living branches 2`] = `
 <ul
-  className="list-inline branch-status"
+  className="branch-status"
 >
   <li
     className="spacer-right"
@@ -53,15 +59,21 @@ exports[`renders status of short-living branches 2`] = `
       size="small"
     />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     0
     <BugIcon />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     0
     <VulnerabilityIcon />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     1
     <CodeSmellIcon />
   </li>
@@ -70,7 +82,7 @@ exports[`renders status of short-living branches 2`] = `
 
 exports[`renders status of short-living branches 3`] = `
 <ul
-  className="list-inline branch-status"
+  className="branch-status"
 >
   <li
     className="spacer-right"
@@ -80,15 +92,21 @@ exports[`renders status of short-living branches 3`] = `
       size="small"
     />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     7
     <BugIcon />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     6
     <VulnerabilityIcon />
   </li>
-  <li>
+  <li
+    className="spacer-left"
+  >
     3
     <CodeSmellIcon />
   </li>