Fixed close split look and feel

public/app/features/explore/ExploreToolbar.tsx

@@ -3,23 +3,6 @@ import { ExploreId } from 'app/types/explore';
 import { DataSourceSelectItem, RawTimeRange, TimeRange } from '@grafana/ui';
 import { DataSourceSelectItem, RawTimeRange, TimeRange } from '@grafana/ui';
 import { DataSourcePicker } from 'app/core/components/Select/DataSourcePicker';
 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 createDatasourcePicker = (props: Props) => {
   const { exploreDatasources, selectedDatasource } = props;
   const { exploreDatasources, selectedDatasource } = props;
 
 
@@ -55,6 +38,23 @@ const createSplittedClassName = (options: { splitted: boolean; className: string
   return splitted ? `${className}-splitted` : className;
   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, {}> {
 export class ExploreToolbar extends PureComponent<Props, {}> {
   constructor(props) {
   constructor(props) {
     super(props);
     super(props);
@@ -86,9 +86,9 @@ export class ExploreToolbar extends PureComponent<Props, {}> {
             </div>
             </div>
             <div className="toolbar-header-close">
             <div className="toolbar-header-close">
               {exploreId === 'right' && (
               {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>
           </div>
           </div>

public/sass/pages/_explore.scss

@@ -154,10 +154,8 @@
     padding: 5px 2px;
     padding: 5px 2px;
   }
   }
 
 
-  .btn.navbar-button {
-    .btn-title {
-      display: none;
-    }
+  .btn-title {
+    display: none;
   }
   }
 }
 }