Air design for navigator pages

diff --git a/sonar-server/src/main/coffee/coding-rules/app.coffee b/sonar-server/src/main/coffee/coding-rules/app.coffee
index d32e5d91208d54ec7f8a2790f4e0bcf78447e119..e9bc853cd8af6a04aca88c5f98a63c63fc7682d5 100644 (file)
--- a/sonar-server/src/main/coffee/coding-rules/app.coffee
+++ b/sonar-server/src/main/coffee/coding-rules/app.coffee
@@ -171,7 +171,8 @@ requirejs [
   # Construct layout
   App.addInitializer ->
     @layout = new CodingRulesLayout app: @
-    jQuery('body').append @layout.render().el
+    jQuery('#content').append @layout.render().el
+    @layout.onResize()
 
 
   # Construct header

diff --git a/sonar-server/src/main/coffee/coding-rules/layout.coffee b/sonar-server/src/main/coffee/coding-rules/layout.coffee
index 3f6e6221d72f262245444c23fef21273ef9ff631..48b4e68444c78e7ca04325ecef0941f2fd89d037 100644 (file)
--- a/sonar-server/src/main/coffee/coding-rules/layout.coffee
+++ b/sonar-server/src/main/coffee/coding-rules/layout.coffee
@@ -21,9 +21,25 @@ define [
       facetsRegion: '.navigator-facets'
 
 
-    onRender: ->
-      # Adjust details region height
-      @$(@detailsRegion.el).css 'bottom', jQuery('#footer').outerHeight()
+    initialize: ->
+      jQuery(window).on 'resize', => @onResize()
+
+
+    onResize: ->
+      footerEl = jQuery('#footer')
+      footerHeight = footerEl.outerHeight true
+
+      resultsEl = jQuery('.navigator-results')
+      resultsHeight = jQuery(window).height() - resultsEl.offset().top -
+        parseInt(resultsEl.css('margin-bottom'), 10) - footerHeight
+      resultsEl.height resultsHeight
+
+      detailsEl = jQuery('.navigator-details')
+      detailsWidth = jQuery(window).width() - detailsEl.offset().left -
+        parseInt(detailsEl.css('margin-right'), 10)
+      detailsHeight = jQuery(window).height() - detailsEl.offset().top -
+        parseInt(detailsEl.css('margin-bottom'), 10) - footerHeight
+      detailsEl.width(detailsWidth).height detailsHeight
 
 
     showSpinner: (region) ->

diff --git a/sonar-server/src/main/coffee/quality-gate/app.coffee b/sonar-server/src/main/coffee/quality-gate/app.coffee
index db18db9871133991cc064f3acdbb731c3a070f36..1e2e4b52c838f8483331b5297650b150b3c445ca 100644 (file)
--- a/sonar-server/src/main/coffee/quality-gate/app.coffee
+++ b/sonar-server/src/main/coffee/quality-gate/app.coffee
@@ -86,7 +86,8 @@ requirejs [
   # Construct layout
   App.addInitializer ->
     @layout = new QualityGateLayout app: @
-    jQuery('body').append @layout.render().el
+    jQuery('#content').append @layout.render().el
+    @layout.onResize()
 
 
   # Construct actions bar

diff --git a/sonar-server/src/main/coffee/quality-gate/layout.coffee b/sonar-server/src/main/coffee/quality-gate/layout.coffee
index ff7f6f54bbdb759bf1e4aecaa37530411e6924fe..0b5941655d54a34b2fe60e3483f823bb74be5de9 100644 (file)
--- a/sonar-server/src/main/coffee/quality-gate/layout.coffee
+++ b/sonar-server/src/main/coffee/quality-gate/layout.coffee
@@ -20,6 +20,7 @@ define [
 
     initialize: (options) ->
       @listenTo options.app.qualityGates, 'all', @updateLayout
+      jQuery(window).on 'resize', => @onResize()
 
 
     updateLayout: ->
@@ -28,8 +29,22 @@ define [
       @$(@detailsRegion.el).toggle !empty
 
 
-    onRender: ->
-      @updateLayout()
+    onResize: ->
+      footerEl = jQuery('#footer')
+      footerHeight = footerEl.outerHeight true
+
+      resultsEl = jQuery('.navigator-results')
+      resultsHeight = jQuery(window).height() - resultsEl.offset().top -
+      parseInt(resultsEl.css('margin-bottom'), 10) - footerHeight
+      resultsEl.height resultsHeight
+
+      detailsEl = jQuery('.navigator-details')
+      detailsWidth = jQuery(window).width() - detailsEl.offset().left -
+      parseInt(detailsEl.css('margin-right'), 10)
+      detailsHeight = jQuery(window).height() - detailsEl.offset().top -
+      parseInt(detailsEl.css('margin-bottom'), 10) - footerHeight
+      detailsEl.width(detailsWidth).height detailsHeight
 
-      # Adjust details region height
-      @$(@detailsRegion.el).css 'bottom', jQuery('#footer').outerHeight()
+
+    onRender: ->
+      @updateLayout()
\ No newline at end of file

diff --git a/sonar-server/src/main/hbs/coding-rules/coding-rules-layout.hbs b/sonar-server/src/main/hbs/coding-rules/coding-rules-layout.hbs
index 9019436610a7b109fd2f5b3c7a620f69c4e6ad7c..4f23b5d282013f6c5da8c23e210cfc733df9ef3b 100644 (file)
--- a/sonar-server/src/main/hbs/coding-rules/coding-rules-layout.hbs
+++ b/sonar-server/src/main/hbs/coding-rules/coding-rules-layout.hbs
@@ -1,6 +1,13 @@
 <div class="navigator-header"></div>
 <div class="navigator-filters"></div>
 <div class="navigator-facets"></div>
-<div class="navigator-results"></div>
-<div class="navigator-actions"></div>
-<div class="navigator-details"></div>
\ No newline at end of file
+
+<div class="navigator-content">
+  <div class="navigator-side">
+    <div class="navigator-actions"></div>
+    <div class="navigator-results"></div>
+  </div>
+  <div class="navigator-main">
+    <div class="navigator-details"></div>
+  </div>
+</div>
\ No newline at end of file

diff --git a/sonar-server/src/main/hbs/quality-gates/quality-gates-layout.hbs b/sonar-server/src/main/hbs/quality-gates/quality-gates-layout.hbs
index 32f6d7e269428f02e25900b407620fdd7b96e3e8..22f6fba05e7b8d6376385ce030d6622eb409d01b 100644 (file)
--- a/sonar-server/src/main/hbs/quality-gates/quality-gates-layout.hbs
+++ b/sonar-server/src/main/hbs/quality-gates/quality-gates-layout.hbs
@@ -1,4 +1,10 @@
-<div class="navigator-header"></div>
-<div class="navigator-results quality-gates-nav"></div>
-<div class="navigator-details"></div>
-<div class="navigator-actions"></div>
\ No newline at end of file
+<div class="navigator-content">
+  <div class="navigator-side">
+    <div class="navigator-actions"></div>
+    <div class="navigator-results quality-gates-nav"></div>
+  </div>
+  <div class="navigator-main">
+    <div class="navigator-header"></div>
+    <div class="navigator-details"></div>
+  </div>
+</div>
\ No newline at end of file

diff --git a/sonar-server/src/main/js/issues/app.js b/sonar-server/src/main/js/issues/app.js
index 57de03ff16ad0966ae3c17e17550600eb1522043..c23c65b698010e35966d46b5c244de207e75ed3f 100644 (file)
--- a/sonar-server/src/main/js/issues/app.js
+++ b/sonar-server/src/main/js/issues/app.js
@@ -61,10 +61,6 @@ requirejs(
       });
 
 
-      // Adjust details region height
-      jQuery('.navigator-details').css('bottom', jQuery('#footer').outerHeight());
-
-
       NavigatorApp.addInitializer(function () {
         jQuery('html').addClass('navigator-page issues-page');
 
@@ -300,6 +296,28 @@ requirejs(
       });
 
 
+      NavigatorApp.addInitializer(function () {
+        var onResize = function() {
+          var footerEl = jQuery('#footer'),
+              footerHeight = footerEl.outerHeight(true);
+
+          var resultsEl = jQuery('.navigator-results'),
+              resultsHeight = jQuery(window).height() - resultsEl.offset().top -
+                  parseInt(resultsEl.css('margin-bottom'), 10) - footerHeight;
+          resultsEl.height(resultsHeight);
+
+          var detailsEl = jQuery('.navigator-details'),
+              detailsWidth = jQuery(window).width() - detailsEl.offset().left -
+                  parseInt(detailsEl.css('margin-right'), 10),
+              detailsHeight = jQuery(window).height() - detailsEl.offset().top -
+                  parseInt(detailsEl.css('margin-bottom'), 10) - footerHeight;
+          detailsEl.width(detailsWidth).height(detailsHeight);
+        };
+        jQuery(window).on('resize', onResize);
+        onResize();
+      });
+
+
       NavigatorApp.getQuery = function (withoutId) {
         var query = this.filterBarView.getQuery();
         if (!withoutId && this.favoriteFilter.id) {

diff --git a/sonar-server/src/main/js/issues/extra.js b/sonar-server/src/main/js/issues/extra.js
index 51dae17c33b91feb5df98617be5cc5d4bc916dbb..0d83417e8c6b3e5b9aff870412b6629d6c6aa06d 100644 (file)
--- a/sonar-server/src/main/js/issues/extra.js
+++ b/sonar-server/src/main/js/issues/extra.js
@@ -941,7 +941,6 @@ define(
 
         onDomRefresh: function () {
           var sourceTitleHeight = this.$('.source_title').outerHeight();
-          jQuery('.navigator-details').css('padding-top', (sourceTitleHeight + 10) + 'px');
         },
 
 

diff --git a/sonar-server/src/main/less/coding-rules.less b/sonar-server/src/main/less/coding-rules.less
index e04a966cf4be3b4a9dbbd955a311a01a350b38e7..359c2737498be65b697a7d6bc02d49f8d89e5774 100644 (file)
--- a/sonar-server/src/main/less/coding-rules.less
+++ b/sonar-server/src/main/less/coding-rules.less
@@ -11,18 +11,7 @@
     margin: @navigatorPadding;
   }
 
-  .navigator-actions {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorFacetsHeight;
-  }
-
-  .navigator-results {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorStatusHeight +
-         @navigatorFacetsHeight;
-  }
 
-  .navigator-details {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorFacetsHeight;
-  }
 
 }
 

diff --git a/sonar-server/src/main/less/navigator/base.less b/sonar-server/src/main/less/navigator/base.less
index 35c2b4212ff4517ff91c11d3bd143b1f91bc061f..1c020231c5f9f7330733ff4977ae77688744a024 100644 (file)
--- a/sonar-server/src/main/less/navigator/base.less
+++ b/sonar-server/src/main/less/navigator/base.less
@@ -14,92 +14,76 @@
 }
 
 .navigator-header {
-  .navigator-element;
-  top: @navigatorTopOffset;
-  left: 0;
-  .size(100%, @navigatorHeaderHeight);
+  height: @navigatorHeaderHeight;
+  margin: @navigatorPadding;
+  border: 1px solid @navigatorBorderLightColor;
+  .box-sizing(border-box);
 }
 
 .navigator-filters {
-  .navigator-element;
-  top: @navigatorTopOffset + @navigatorHeaderHeight;
-  left: 0;
-  .size(100%, @navigatorFiltersHeight);
+  position: relative;
+  margin: @navigatorPadding;
+  border: 1px solid @navigatorBorderLightColor;
+  .box-sizing(border-box);
 }
 
-.navigator-facets {
-  .navigator-element;
-  top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight;
-  left: 0;
-  .size(100%, @navigatorFacetsHeight);
+.navigator-content {
+  display: table;
+  width: 100%;
 }
 
-.navigator-results {
-  .navigator-element;
-  .box-sizing(content-box);
-  top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorStatusHeight;
-  bottom: 0;
-  left: 0;
-  width: @navigatorResultsWidth - 1px;
+.navigator-side {
+  display: table-cell;
+  vertical-align: top;
+  width: @navigatorResultsWidth + 2 * @navigatorPadding;
 }
 
-.navigator-details {
-  .navigator-element;
-  top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight;
-  bottom: @navigatorBottomOffset;
-  left: @navigatorResultsWidth;
-  right: 0;
+.navigator-main {
+  display: table-cell;
+  vertical-align: top;
 }
 
-.navigator-actions {
-  .navigator-element;
-  top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight;
-  left: 0;
-  .size(@navigatorResultsWidth, @navigatorStatusHeight);
+.navigator-facets {
+  height: @navigatorFacetsHeight;
+  margin: @navigatorPadding;
+  border: 1px solid @navigatorBorderLightColor;
+  .box-sizing(border-box);
 }
 
-.navigator-notes {
-  .navigator-element;
-  top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight;
-  left: 0;
-  .size(100%, @navigatorNotesHeight);
-  display: none;
+.navigator-results {
+  width: @navigatorResultsWidth;
+  margin: @navigatorPadding;
+  .box-sizing(border-box);
 }
 
+.navigator-actions {
+  .clearfix;
+  width: @navigatorResultsWidth;
+  margin: 0 @navigatorPadding @navigatorPadding;
+  border: 1px solid @navigatorBorderLightColor;
+  .box-sizing(border-box);
+}
 
-.measures-page {
-  .navigator-results {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight;
-    left: 0;
-    bottom: 36px;
-    width: 100%;
-  }
+.navigator-details {
+  position: relative;
+  margin: 0 @navigatorPadding @navigatorPadding 0;
 }
 
+.navigator-notes {
+  display: none;
+}
 
 .navigator-with-notes {
 
-  .navigator-actions,
-  .navigator-details {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorNotesHeight;
-  }
-
-  .navigator-results {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorNotesHeight + @navigatorStatusHeight;
-  }
-
   .navigator-notes {
     display: block;
   }
+}
 
-  .navigator-details .source_title {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorNotesHeight;
-  }
-
-  .navigator-fetching.navigator-results-list:before {
-    top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight + @navigatorStatusHeight + @navigatorNotesHeight;
-  }
 
+.measures-page {
+  .navigator-details { overflow: visible; }
+  .page { padding: 0 0 0 @navigatorPadding; }
 }
 
 
@@ -141,20 +125,20 @@
 // Header
 .navigator-header {
   padding: 0 @navigatorPadding;
-  border-bottom: 1px solid @navigatorBorderColor;
   background-color: @navigatorBarBackground;
   font-size: 0;
 }
 
 .navigator-header-favorite {
-  padding-left: 46px;
+  padding-left: 58px;
 }
 
 .navigator-header-title {
   display: inline-block;
   vertical-align: middle;
+  color: @navigatorHeaderColor;
   font-size: 20px;
-  line-height: @navigatorHeaderHeight;
+  line-height: @navigatorHeaderLineHeight;
 }
 
 .navigator-header-title-note {
@@ -211,17 +195,14 @@
 
 // Notes
 .navigator-notes {
+  margin: 0 @navigatorPadding @navigatorPadding 0;
   padding: 0 @navigatorPadding;
-  border-bottom: 1px solid @navigatorBorderColor;
+  border: 1px solid @navigatorBorderColor;
   background-color: @navigatorBarBackground;
 
   color: #777;
   font-size: @smallFontSize;
   line-height: @navigatorNotesHeight;
-
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
 }
 
 
@@ -293,7 +274,6 @@
 
 // Results
 .navigator-results {
-  border-right: 1px solid @navigatorBorderLightColor;
   background-color: @white;
   overflow-x: hidden;
   overflow-y: auto;
@@ -302,8 +282,11 @@
 .navigator-results-list {
 
   & > li {
+    position: relative;
+    z-index: 1;
     padding: @navigatorPadding / 2 0;
-    border-top: 1px solid transparent;
+    border: 1px solid;
+    border-color: @navigatorBorderLightColor transparent;
     cursor: pointer;
     .trans;
 
@@ -332,30 +315,13 @@
     }
 
     &.active {
+      z-index: 2;
       background-color: #CAE3F2;
       border-color: #4B9FD5;
     }
-
-    &.with-context {
-      border-right: 6px solid @navigatorBorderLightColor;
-    }
-
-    &:last-child {
-      border-bottom: 1px solid transparent;
-
-      &.active {
-        border-bottom-color: #4B9FD5;
-      }
-    }
   }
 
-  & > li + li {
-    border-top-color: @navigatorBorderLightColor;
-  }
-
-  & > li.active + li {
-    border-top-color: #4B9FD5;
-  }
+  & > li + li { margin-top: -1px; }
 
   &.navigator-fetching {
 
@@ -386,15 +352,9 @@
 
 // Details
 .navigator-details {
-  padding: @navigatorPadding;
   background-color: @white;
   overflow: auto;
 
-  .issues-page & {
-    padding-top: 62px;
-    padding-right: 0;
-  }
-
   &.loading {
     background: @white url("../images/loading.gif") no-repeat 4px 2px;
   }
@@ -408,19 +368,15 @@
   }
 
   .source_title {
-    position: fixed;
     z-index: 3;
     top: @navigatorTopOffset + @navigatorHeaderHeight + @navigatorFiltersHeight;
     left: @navigatorResultsWidth;
     right: 0;
-    padding: @navigatorPadding;
-    border-bottom: 1px solid @navigatorBorderLightColor;
+    padding: 0 0 @navigatorPadding 0;
     background-color: #fff;
   }
 
   .source {
-    padding-right: 10px;
-
     & > table {
       border: 1px solid #DDD;
     }
@@ -492,7 +448,7 @@
 
 .navigator-actions-total {
   float: right;
-  line-height: @navigatorStatusHeight - 4px;
+  line-height: @navigatorStatusHeight;
 }
 
 .navigator-actions-bulk {
@@ -507,18 +463,5 @@
 
 // Footer
 .navigator-page #footer {
-  .navigator-element;
-  bottom: 0;
-  left: @navigatorResultsWidth;
-  right: 0;
-  margin: 0;
   border-top: 1px solid @navigatorBorderLightColor;
-}
-
-.navigator-page #ftlinks {
-  margin-top: 0;
-}
-
-.measures-page #footer {
-  left: 0;
-}
+}
\ No newline at end of file

diff --git a/sonar-server/src/main/less/navigator/config.less b/sonar-server/src/main/less/navigator/config.less
index 2d920ff7e4cdfbdcbdd2e100aae0731000d8445e..4ad5424b817314f7ef5c9f22b2154127d0dcc69c 100644 (file)
--- a/sonar-server/src/main/less/navigator/config.less
+++ b/sonar-server/src/main/less/navigator/config.less
@@ -1,11 +1,13 @@
 @import "../variables";
 
 // Layout
-@navigatorTopOffset: 30px;
+@navigatorTopOffset: 80px;
 @navigatorBottomOffset: 35px;
 
-@navigatorHeaderHeight: 37px;
-@navigatorFiltersHeight: 37px;
+@navigatorHeaderHeight: 40px;
+@navigatorHeaderLineHeight: @navigatorHeaderHeight - 3px;
+@navigatorFiltersHeight: 40px;
+@navigatorFiltersLineHeight: @navigatorFiltersHeight - 3px;
 @navigatorFacetsHeight: 90px;
 @navigatorStatusHeight: 30px;
 @navigatorNotesHeight: 20px;
@@ -16,10 +18,12 @@
 
 
 // Colors
-@navigatorBarBackground: @grey;
-@navigatorBorderColor: @darkGrey;
-@navigatorBorderLightColor: lighten(@darkGrey, 8%);
+@navigatorBarBackground: #f3f3f3;
+@navigatorBorderColor: darken(@navigatorBarBackground, 5%);
+@navigatorBorderLightColor: @navigatorBorderColor;
 
+@navigatorHeaderColor: darken(@blue, 10%);
 
-@navigatorHover: darken(@grey, 5%);
+
+@navigatorHover: darken(@navigatorBarBackground, 5%);
 @navigatorFilterPadding: @navigatorPadding;

diff --git a/sonar-server/src/main/less/navigator/filters.less b/sonar-server/src/main/less/navigator/filters.less
index e953c2487633978be921b2b615ed388955bf9688..6c02ed9d50e99bc1df643b3689e0bee5b1ff7237 100644 (file)
--- a/sonar-server/src/main/less/navigator/filters.less
+++ b/sonar-server/src/main/less/navigator/filters.less
@@ -5,7 +5,7 @@
 
 
 .navigator-filters {
-  border-bottom: 1px solid @darkGrey;
+  padding-right: 85px;
   background-color: @navigatorBarBackground;
   font-size: 0;
 }
@@ -13,8 +13,8 @@
 .navigator-filters-list {
   display: inline-block;
   vertical-align: middle;
-  margin-bottom: -1px;
   font-size: 0;
+  margin-bottom: -1px;
 }
 
 .navigator-filter-submit,
@@ -24,6 +24,25 @@
   font-size: @baseFontSize;
 }
 
+.navigator-filter-submit {
+  position: absolute;
+  top: 0; right: 0;
+  .size(85px, 100%);
+  margin: -1px -1px -1px 0;
+  padding: 0;
+  border: 1px solid darken(@blue, 10%);
+  .box-sizing(content-box);
+  background: @blue;
+  color: #fff;
+  font-weight: normal;
+  .trans;
+
+  &:hover, &:focus {
+    border-color: @blue;
+    background-color: lighten(@blue, 10%);
+  }
+}
+
 .navigator-filter-list-favorite {
   position: relative;
   padding-left: 36px;
@@ -42,15 +61,15 @@
   z-index: 1;
   display: inline-block;
   vertical-align: top;
-  height: @navigatorFiltersHeight - 1px;
-  line-height: @navigatorFiltersHeight - 1px;
-  margin: -1px 0 0;
-  padding: 0 @navigatorFilterPadding;
-  border: 1px solid;
-  border-color: transparent @navigatorBorderLightColor;
+  height: @navigatorFiltersHeight;
+  line-height: @navigatorFiltersLineHeight;
+  margin: -1px 0 0 -1px;
+  padding: 0 1.5 * @navigatorFilterPadding;
+  border: 1px solid @navigatorBorderLightColor;
+  .box-sizing(border-box);
   white-space: nowrap;
   cursor: pointer;
-  transition: background 0.3s ease;
+  .trans;
 
   &:hover {
     z-index: 2;
@@ -63,13 +82,6 @@
     background: #fff;
   }
 
-  &:first-child {
-    border-left: none;
-  }
-}
-
-.navigator-filter + .navigator-filter {
-  margin-left: -1px;
 }
 
 .navigator-filter-disabled {
@@ -101,6 +113,7 @@
 }
 
 .navigator-filter-context {
+  z-index: 3;
   background-color: @contextBackground;
   border-color: @contextBorder;
 }
@@ -286,8 +299,8 @@
 
 .navigator-filter-favorite {
   position: absolute;
-  top: -100%; left: 0;
-  border-top: none;
+  top: -@navigatorPadding - @navigatorFiltersHeight;
+  left: 0;
 }
 
 .navigator-filter-favorite-toggle {

diff --git a/sonar-server/src/main/less/quality-gates.less b/sonar-server/src/main/less/quality-gates.less
index 4d07ee8f9867b6f3b1618bfa8951f077c6faf89b..5901f29c35c23ce4a3c07c6cdc3ef36b0dfe8755 100644 (file)
--- a/sonar-server/src/main/less/quality-gates.less
+++ b/sonar-server/src/main/less/quality-gates.less
@@ -6,22 +6,25 @@
 
 .quality-gates-navigator {
 
-  .navigator-header {
-    left: @qualityGateSidebarWidth;
-    border-color: @navigatorBorderColor;
+  .navigator-side {
+    display: table-cell;
+    vertical-align: top;
+    width: @qualityGateSidebarWidth + 2 * @navigatorPadding;
+  }
 
+  .navigator-header {
+    margin-left: 0;
     .spinner { margin-top: 9px; }
   }
 
   .navigator-actions {
-    top: @navigatorTopOffset;
     height: @navigatorHeaderHeight;
     width: @qualityGateSidebarWidth;
+    margin: @navigatorPadding;
     padding: 0 @navigatorPadding;
-    border-color: @navigatorBorderColor;
-    border-bottom-color: @navigatorBarBackground;
 
     .navigator-header-title {
+      color: @baseFontColor;
       font-size: 13px;
       font-weight: bold;
       text-transform: uppercase;
@@ -29,26 +32,13 @@
   }
 
   .navigator-results {
-    top: @navigatorTopOffset + @navigatorHeaderHeight;
-    width: @qualityGateSidebarWidth - 1px;
-    border-color: @navigatorBorderColor;
-  }
-
-  .navigator-details {
-    top: @navigatorTopOffset + @navigatorHeaderHeight;
-    left: @qualityGateSidebarWidth;
-    padding: @navigatorPadding;
+    width: @qualityGateSidebarWidth;
   }
 
 }
 
-.quality-gates-page #footer {
-  left: @qualityGateSidebarWidth;
-}
-
 
 .quality-gates-nav {
-  background-color: @navigatorBarBackground;
 
   .navigator-results-list {
 
@@ -56,7 +46,7 @@
       border-color: transparent;
 
       &:hover:not(.active):not(.empty) {
-        background-color: @navigatorBorderLightColor;
+        background-color: @navigatorBarBackground;
       }
 
       &.active {

diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search.html.erb
index e3a8629e89ee5d9ff9a5b0f16ff41674a4c5818b..db0fd733ff37759702003a2e44f721e73af33876 100644 (file)
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/search.html.erb
@@ -4,13 +4,18 @@
 
 <div class="navigator">
   <div class="navigator-header"></div>
-  <div class="navigator-notes">
-    <%= message('issue_filter.max_results_reached', :params => 10000) -%>
-  </div>
   <div class="navigator-filters"></div>
-  <div class="navigator-results"></div>
-  <div class="navigator-details"></div>
-  <div class="navigator-actions"></div>
+
+  <div class="navigator-content">
+    <div class="navigator-side">
+      <div class="navigator-actions"></div>
+      <div class="navigator-results"></div>
+    </div>
+    <div class="navigator-main">
+      <div class="navigator-notes"><%= message('issue_filter.max_results_reached', :params => 10000) -%></div>
+      <div class="navigator-details"></div>
+    </div>
+  </div>
 </div>
 
 <%= render :partial => '/navigator/filter_templates' -%>

diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/measures/search.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/measures/search.html.erb
index 00c9287ce9e664a566c1bed8799e61a65db22eda..f2794919597e9bd6839a8d2a1744a08feb04139d 100644 (file)
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/measures/search.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/measures/search.html.erb
@@ -7,9 +7,15 @@
   <div class="navigator-header">
     <%= render :partial => 'search_header' -%>
   </div>
+
   <div class="navigator-filters"></div>
-  <div class="navigator-results">
-    <%= render :partial => 'search_body' -%>
+
+  <div class="navigator-content">
+    <div class="navigator-main">
+      <div class="navigator-details">
+        <%= render :partial => 'search_body' -%>
+      </div>
+    </div>
   </div>
 </div>