From de71875e6bbddacb2d9b96ff1adcb5a4d0444382 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Fri, 5 Jul 2019 07:49:45 +0200
Subject: [PATCH] TimePicker: align position between dashboard and explore
 (#17940)

---
 .../components/TimePicker/_TimePicker.scss    |  4 +++-
 public/sass/pages/_explore.scss               | 19 +++++++------------
 2 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/packages/grafana-ui/src/components/TimePicker/_TimePicker.scss b/packages/grafana-ui/src/components/TimePicker/_TimePicker.scss
index 414f9968557..155659ae2d8 100644
--- a/packages/grafana-ui/src/components/TimePicker/_TimePicker.scss
+++ b/packages/grafana-ui/src/components/TimePicker/_TimePicker.scss
@@ -29,7 +29,7 @@
   z-index: $zindex-dropdown;
   flex-direction: column;
   max-width: 600px;
-  top: 50px;
+  top: 41px;
   right: 0px;
 
   .time-picker-popover-body {
@@ -256,6 +256,8 @@ $arrowPadding: $arrowPaddingToBorder * 3;
 .dashboard-timepicker-wrapper {
   position: relative;
   display: flex;
+  // this is to align popover position with explore  ( .explore-toolbar-content-item class)
+  padding: 2px 2px;
 
   .gf-form-select-box__menu {
     right: 0;
diff --git a/public/sass/pages/_explore.scss b/public/sass/pages/_explore.scss
index 0b686ee3632..5eb3f7c89f8 100644
--- a/public/sass/pages/_explore.scss
+++ b/public/sass/pages/_explore.scss
@@ -68,8 +68,8 @@
   flex: 1 1 0;
   flex-flow: row nowrap;
   font-size: 18px;
-  min-height: 55px;
-  line-height: 55px;
+  min-height: $navbarHeight;
+  line-height: $navbarHeight;
   justify-content: space-between;
   align-items: center;
 }
@@ -88,13 +88,12 @@
 
 .explore-toolbar-content-item {
   display: flex;
-  padding: 10px 2px;
-}
+  padding: 2px 2px;
 
-.explore-toolbar-content-item:first-child {
-  padding-left: $dashboard-padding;
-  margin-right: auto;
-  display: flex;
+  &:first-child {
+    padding-left: $dashboard-padding;
+    margin-right: auto;
+  }
 }
 
 @media only screen and (max-width: 1545px) {
@@ -122,10 +121,6 @@
       margin: 0;
     }
   }
-
-  .explore-toolbar-content-item {
-    padding: 2px 2px;
-  }
 }
 
 @media only screen and (max-width: 702px) {