From 18727dce234e4b162ffa8089df8f388d2d2a23cf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20H=C3=A4ggmark?= <hugo.haggmark@gmail.com>
Date: Thu, 24 Jan 2019 09:26:48 +0100
Subject: [PATCH] Fixed close split look and feel

---
 .../app/features/explore/ExploreToolbar.tsx   | 40 +++++++++----------
 public/sass/pages/_explore.scss               |  6 +--
 2 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/public/app/features/explore/ExploreToolbar.tsx b/public/app/features/explore/ExploreToolbar.tsx
index 968b722ecfe..ee36d622bab 100644
--- a/public/app/features/explore/ExploreToolbar.tsx
+++ b/public/app/features/explore/ExploreToolbar.tsx
@@ -3,23 +3,6 @@ import { ExploreId } from 'app/types/explore';
 import { DataSourceSelectItem, RawTimeRange, TimeRange } from '@grafana/ui';
 import { DataSourcePicker } from 'app/core/components/Select/DataSourcePicker';
 
-interface Props {
-  datasourceMissing: boolean;
-  exploreDatasources: DataSourceSelectItem[];
-  exploreId: ExploreId;
-  loading: boolean;
-  range: RawTimeRange;
-  selectedDatasource: DataSourceSelectItem;
-  splitted: boolean;
-  timepicker: JSX.Element;
-  onChangeDatasource: (option) => void;
-  onClearAll: () => void;
-  onCloseSplit: () => void;
-  onChangeTime: (range: TimeRange, changedByScanner?: boolean) => void;
-  onRunQuery: () => void;
-  onSplit: () => void;
-}
-
 const createDatasourcePicker = (props: Props) => {
   const { exploreDatasources, selectedDatasource } = props;
 
@@ -55,6 +38,23 @@ const createSplittedClassName = (options: { splitted: boolean; className: string
   return splitted ? `${className}-splitted` : className;
 };
 
+interface Props {
+  datasourceMissing: boolean;
+  exploreDatasources: DataSourceSelectItem[];
+  exploreId: ExploreId;
+  loading: boolean;
+  range: RawTimeRange;
+  selectedDatasource: DataSourceSelectItem;
+  splitted: boolean;
+  timepicker: JSX.Element;
+  onChangeDatasource: (option) => void;
+  onClearAll: () => void;
+  onCloseSplit: () => void;
+  onChangeTime: (range: TimeRange, changedByScanner?: boolean) => void;
+  onRunQuery: () => void;
+  onSplit: () => void;
+}
+
 export class ExploreToolbar extends PureComponent<Props, {}> {
   constructor(props) {
     super(props);
@@ -86,9 +86,9 @@ export class ExploreToolbar extends PureComponent<Props, {}> {
             </div>
             <div className="toolbar-header-close">
               {exploreId === 'right' && (
-                <button className="btn navbar-button" onClick={this.props.onCloseSplit}>
-                  Close Split
-                </button>
+                <a onClick={this.props.onCloseSplit}>
+                  <i className="fa fa-window-close fa-fw" />
+                </a>
               )}
             </div>
           </div>
diff --git a/public/sass/pages/_explore.scss b/public/sass/pages/_explore.scss
index a2f36908a85..bb0a2ae719e 100644
--- a/public/sass/pages/_explore.scss
+++ b/public/sass/pages/_explore.scss
@@ -154,10 +154,8 @@
     padding: 5px 2px;
   }
 
-  .btn.navbar-button {
-    .btn-title {
-      display: none;
-    }
+  .btn-title {
+    display: none;
   }
 }