SONAR-5851 clean up profiles ui

2 files changed, 57 insertions, 32 deletions

diff --git a/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-layout.hbs b/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-layout.hbs
index e171121f21a..d6ccad88da6 100644
--- a/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-layout.hbs
+++ b/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-layout.hbs
@@ -9,5 +9,5 @@
 
 <div class="search-navigator-workspace">
   <div class="search-navigator-workspace-header"></div>
-  <div class="search-navigator-workspace-list"></div>
+  <div class="search-navigator-workspace-details"></div>
 </div>
diff --git a/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-profile-details.hbs b/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-profile-details.hbs
index ea796d3189b..2dbd17a71ca 100644
--- a/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-profile-details.hbs
+++ b/server/sonar-web/src/main/hbs/quality-profiles/quality-profiles-profile-details.hbs
@@ -1,33 +1,56 @@
-<h3>{{t 'coding_rules'}}</h3>
-<p class="spacer-top">Total: <a href="{{link rulesSearchUrl}}">{{formatMeasure activeRuleCount 'INT'}}</a></p>
-{{#notEmpty rulesSeverities}}
-  <ul class="spacer-top list-inline">
-    {{#each rulesSeverities}}
-      <li>
-        {{severity val}}
-        <a href="{{link ../rulesSearchUrl '|severities=' val}}">{{formatMeasure count 'INT'}}</a>
-      </li>
-    {{/each}}
-  </ul>
-{{/notEmpty}}
-
-<hr class="spacer-top spacer-bottom">
-
-<h3>{{t 'projects'}}</h3>
-{{#if isDefault}}
-  <p class="alert alert-info">{{t 'quality_profiles.projects_for_default.edit'}}</p>
-{{else}}
-  <div id="quality-profile-projects"></div>
-{{/if}}
-
-<hr class="spacer-top spacer-bottom">
+<div class="panel panel-vertical" id="quality-profile-rules">
+  <header class="page-header">
+    <h3 class="page-title">{{t 'coding_rules'}}</h3>
+  </header>
+  <p>
+    <a class="big" href="{{link rulesSearchUrl}}">{{formatMeasure activeRuleCount 'INT'}}</a>
+    activate rules
+  </p>
+  {{#notEmpty rulesSeverities}}
+    <div class="abs-width-400 spacer-top">
+      <div class="columns">
+        <div class="column-half">
+          {{#eachEven rulesSeverities}}
+            <p class="spacer-top">
+              {{severityIcon val}}
+              <a href="{{link ../rulesSearchUrl '|severities=' val}}">{{formatMeasure count 'INT'}}</a>
+              <span class="text-lowercase">{{t 'severity' val}}</span>
+            </p>
+          {{/eachEven}}
+        </div>
+        <div class="column-half">
+          {{#eachOdd rulesSeverities}}
+            <p class="spacer-top">
+              {{severityIcon val}}
+              <a href="{{link ../rulesSearchUrl '|severities=' val}}">{{formatMeasure count 'INT'}}</a>
+              <span class="text-lowercase">{{t 'severity' val}}</span>
+            </p>
+          {{/eachOdd}}
+        </div>
+      </div>
+    </div>
+  {{/notEmpty}}
+</div>
 
-<h3>{{t 'permalinks'}}</h3>
-<p class="alert alert-warning">Coming soon...</p>
+<div class="panel panel-vertical" id="quality-profile-projects">
+  <header class="page-header">
+    <h3 class="page-title">{{t 'projects'}}</h3>
+  </header>
+  {{#if isDefault}}
+    <p class="alert alert-info">{{t 'quality_profiles.projects_for_default.edit'}}</p>
+  {{else}}
+    <div id="quality-profile-projects-list"></div>
+  {{/if}}
+</div>
 
-<hr class="spacer-top spacer-bottom">
+<div class="panel panel-vertical" id="quality-profile-permalinks">
+  <header class="page-header">
+    <h3 class="page-title">{{t 'permalinks'}}</h3>
+  </header>
+  <p class="alert alert-warning">Coming soon...</p>
+</div>
 
-<div id="quality-profile-inheritance">
+<div class="panel panel-vertical" id="quality-profile-inheritance">
   <header class="page-header">
     <h3 class="page-title">{{t 'quality_profiles.profile_inheritance'}}</h3>
     <div class="page-actions">
@@ -85,7 +108,9 @@
   </div>
 </div>
 
-<hr class="spacer-top spacer-bottom">
-
-<h3>{{t 'changelog'}}</h3>
-<p class="alert alert-warning">Coming soon...</p>
+<div class="panel panel-vertical" id="quality-profile-changelog">
+  <header class="page-header">
+    <h3 class="page-title">{{t 'changelog'}}</h3>
+  </header>
+  <p class="alert alert-warning">Coming soon...</p>
+</div>