From cbaebde0219b22b32553d4c3f5aa737f00b00950 Mon Sep 17 00:00:00 2001
From: Stas Vilchik <vilchiks@gmail.com>
Date: Thu, 26 Jan 2017 10:12:01 +0100
Subject: [PATCH] SONAR-8515 Align boxes on the About page

---
 .../src/main/js/apps/about/components/AboutApp.js    | 12 ++++++------
 server/sonar-web/src/main/js/apps/about/styles.css   |  9 +++++++++
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/server/sonar-web/src/main/js/apps/about/components/AboutApp.js b/server/sonar-web/src/main/js/apps/about/components/AboutApp.js
index e95674f2c6b..542056a1329 100644
--- a/server/sonar-web/src/main/js/apps/about/components/AboutApp.js
+++ b/server/sonar-web/src/main/js/apps/about/components/AboutApp.js
@@ -128,21 +128,21 @@ class AboutApp extends React.Component {
                 <div className="about-page-section" dangerouslySetInnerHTML={{ __html: customText }}/>
             )}
 
-            <div className="columns">
-              <div className="column-two-thirds">
+            <div className="flex-columns">
+              <div className="flex-column flex-column-two-thirds about-page-group-boxes">
                 <AboutCleanCode/>
                 <AboutLeakPeriod/>
               </div>
-              <div className="column-third">
+              <div className="flex-column flex-column-third about-page-group-boxes">
                 <AboutIssues/>
               </div>
             </div>
 
-            <div className="columns">
-              <div className="column-half">
+            <div className="flex-columns">
+              <div className="flex-column flex-column-half about-page-group-boxes">
                 <AboutQualityGates/>
               </div>
-              <div className="column-half">
+              <div className="flex-column flex-column-half about-page-group-boxes">
                 <AboutStandards/>
               </div>
             </div>
diff --git a/server/sonar-web/src/main/js/apps/about/styles.css b/server/sonar-web/src/main/js/apps/about/styles.css
index 46cd9c9375f..a3aba28b9b7 100644
--- a/server/sonar-web/src/main/js/apps/about/styles.css
+++ b/server/sonar-web/src/main/js/apps/about/styles.css
@@ -199,3 +199,12 @@
   width: 310px;
   margin-top: 40px;
 }
+
+.about-page-group-boxes {
+  display: flex;
+  flex-direction: column;
+}
+
+.about-page-group-boxes > .boxed-group {
+  flex-grow: 1;
+}
-- 
2.39.5