Merge pull request #2 from spenceralger/TimefilterAutoRefresh

[timepicker] slight modification to navbar css
spalger · Dec 16, 2014 · 2c8c48b · 2c8c48b
2 parents 11aa394 + 776a1b8
commit 2c8c48b
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 13 deletions.
diff --git a/src/kibana/plugins/kibana/kibana.html b/src/kibana/plugins/kibana/kibana.html
@@ -23,20 +23,21 @@
           </li>
         </ul>
 
-        <ul class="nav navbar-nav navbar-right">
+        <ul class="nav navbar-nav navbar-right navbar-timepicker">
           <li ng-show="httpActive.length" class="navbar-text">
-            <div class="spinner">
-            </div>
+            <div class="spinner"></div>
           </li>
-          <li ng-if="setupComplete" ng-show="timefilter.enabled" class="navbar-timepicker-display">
+
+          <li ng-if="setupComplete" ng-show="timefilter.enabled" class="navbar-timepicker-container">
             <a ng-click="toggleTimepicker()">
-              {{timefilter.refreshInterval.display}}
-              &nbsp;
-              <i class="fa fa-rotate-right"></i>
-              &nbsp; &nbsp;
-              <pretty-duration from="timefilter.time.from" to="timefilter.time.to"></pretty-duration>
-              &nbsp;
-              <i class="fa fa-clock-o"></i>
+              <span ng-show="timefilter.refreshInterval.value > 0" class="navbar-timepicker-auto-refresh-desc">
+                {{timefilter.refreshInterval.display}}
+                <i class="fa fa-rotate-right"></i>
+              </span>
+              <span class="navbar-timepicker-timefilter-desc">
+                <pretty-duration from="timefilter.time.from" to="timefilter.time.to"></pretty-duration>
+                <i class="fa fa-clock-o"></i>
+              </span>
             </a>
           </li>
         </ul>

diff --git a/src/kibana/styles/main.less b/src/kibana/styles/main.less
@@ -232,12 +232,23 @@ notifications {
     color: @navbar-inverse-brand-hover-color;
     vertical-align: middle;
   }
+}
+
+.navbar-timepicker {
+  &-auto-refresh-desc {
+    margin-right: 20px;
+  }
+
+  &-timefilter-desc {
+
+  }
 
   .fa {
-    font-size: @font-size-large;
-    vertical-align: text-top;
+    font-size: 16px;
+    vertical-align: middle;
   }
 }
+
 .kbn-timepicker .btn-default {
   background: transparent;
   color: @text-color;