SONAR-7962 increase visibility of size section

diff --git a/server/sonar-web/src/main/js/apps/overview/meta/Meta.js b/server/sonar-web/src/main/js/apps/overview/meta/Meta.js
index d672a56badc6892cf7b28ead479fa94a54d93475..70d063d3101df286e0555a49b2ad893a5ff3b152 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/meta/Meta.js
+++ b/server/sonar-web/src/main/js/apps/overview/meta/Meta.js
@@ -44,15 +44,11 @@ const Meta = ({ component, measures }) => {
 
   return (
       <div className="overview-meta">
-        <div className="overview-meta-card">
-          {hasDescription && (
-              <div className="overview-meta-description big-spacer-bottom">
-                {description}
-              </div>
-          )}
-
-          <MetaLinks component={component}/>
-        </div>
+        {hasDescription && (
+            <div className="overview-meta-card overview-meta-description">
+              {description}
+            </div>
+        )}
 
         <MetaSize component={component} measures={measures}/>
 
@@ -64,6 +60,8 @@ const Meta = ({ component, measures }) => {
             <MetaQualityProfiles profiles={profiles}/>
         )}
 
+        <MetaLinks component={component}/>
+
         <MetaKey component={component}/>
 
         {showShowEvents && (

diff --git a/server/sonar-web/src/main/js/apps/overview/meta/MetaLinks.js b/server/sonar-web/src/main/js/apps/overview/meta/MetaLinks.js
index a6f610728fc1389a46d63d7b45d42406ef8b19ac..25984706b786e49d76d6583b23a969524fee08e6 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/meta/MetaLinks.js
+++ b/server/sonar-web/src/main/js/apps/overview/meta/MetaLinks.js
@@ -67,17 +67,19 @@ export default class MetaLinks extends React.Component {
     const orderedLinks = orderLinks(links);
 
     return (
-        <ul className="overview-meta-list">
-          {orderedLinks.map(link => (
-              <li key={link.id}>
-                <a className="link-with-icon" href={link.url} target="_blank">
-                  {this.renderLinkIcon(link)}
-                  &nbsp;
-                  {link.name}
-                </a>
-              </li>
-          ))}
-        </ul>
+        <div className="overview-meta-card">
+          <ul className="overview-meta-list">
+            {orderedLinks.map(link => (
+                <li key={link.id}>
+                  <a className="link-with-icon" href={link.url} target="_blank">
+                    {this.renderLinkIcon(link)}
+                    &nbsp;
+                    {link.name}
+                  </a>
+                </li>
+            ))}
+          </ul>
+        </div>
     );
   }
 }

diff --git a/server/sonar-web/src/main/js/apps/overview/meta/MetaSize.js b/server/sonar-web/src/main/js/apps/overview/meta/MetaSize.js
index 9c073cfe28f8c060f2f46eb712375fae578e85b1..8717d86e587f9c62f239d81ba94da8ecf245e63b 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/meta/MetaSize.js
+++ b/server/sonar-web/src/main/js/apps/overview/meta/MetaSize.js
@@ -20,8 +20,8 @@
 import React from 'react';
 import { DrilldownLink } from '../../../components/shared/drilldown-link';
 import LanguageDistribution from '../../../components/charts/LanguageDistribution';
-import { translate } from '../../../helpers/l10n';
 import { formatMeasure } from '../../../helpers/measures';
+import { getMetricName } from '../helpers/metrics';
 
 export default class MetaSize extends React.Component {
   static propTypes = {
@@ -41,23 +41,15 @@ export default class MetaSize extends React.Component {
 
     return (
         <div id="overview-size" className="overview-meta-card">
-          <h4 className="overview-meta-header">
-            {translate('overview.domain.size')}
-          </h4>
-
-          <div>
-            <div id="overview-ncloc" className="overview-meta-size-ncloc">
-              <DrilldownLink
-                  className="overview-domain-secondary-measure-value"
-                  component={this.props.component.key}
-                  metric="ncloc">
-                {formatMeasure(ncloc.value, 'SHORT_INT')}
-              </DrilldownLink>
-            </div>
-            <div id="overview-language-distribution"
-                 className="overview-meta-size-lang-dist">
-              <LanguageDistribution distribution={languageDistribution.value}/>
-            </div>
+          <div id="overview-ncloc" className="overview-meta-size-ncloc">
+            <DrilldownLink component={this.props.component.key} metric="ncloc">
+              {formatMeasure(ncloc.value, 'SHORT_INT')}
+            </DrilldownLink>
+            <div className="overview-domain-measure-label text-muted">{getMetricName('ncloc')}</div>
+          </div>
+          <div id="overview-language-distribution"
+               className="overview-meta-size-lang-dist">
+            <LanguageDistribution distribution={languageDistribution.value}/>
           </div>
         </div>
     );

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 3723eed7a1452a64d04bfc02863849ff3602a7c7..8400857a470a28dffb848c683b348fc9c3b322a7 100644 (file)
--- a/server/sonar-web/src/main/js/apps/overview/styles.css
+++ b/server/sonar-web/src/main/js/apps/overview/styles.css
@@ -259,14 +259,20 @@
 .overview-meta-size-ncloc {
   display: inline-block;
   vertical-align: middle;
-  width: 80px;
+  width: 100px;
   text-align: center;
 }
 
+.overview-meta-size-ncloc a {
+  line-height: 1;
+  font-size: 24px;
+  font-weight: 300;
+}
+
 .overview-meta-size-lang-dist {
   display: inline-block;
   vertical-align: middle;
-  width: 180px;
+  width: 160px;
   min-height: 40px;
   border-left: 1px solid #e6e6e6;
   box-sizing: border-box;