style tweaks

public/app/features/dashboard/dashgrid/EditorTabBody.tsx

@@ -98,7 +98,7 @@ export class EditorTabBody extends PureComponent<Props, State> {
     const { children, toolbarItems, main, heading } = this.props;
     const { children, toolbarItems, main, heading } = this.props;
     const { openView } = this.state;
     const { openView } = this.state;
     return (
     return (
-      <div className="panel-editor__right">
+      <>
         <div className="toolbar">
         <div className="toolbar">
           <div className="toolbar__heading">{heading}</div>
           <div className="toolbar__heading">{heading}</div>
           {main && this.renderMainSelection(main)}
           {main && this.renderMainSelection(main)}
@@ -115,7 +115,7 @@ export class EditorTabBody extends PureComponent<Props, State> {
             </div>
             </div>
           </CustomScrollbar>
           </CustomScrollbar>
         </div>
         </div>
-      </div>
+      </>
     );
     );
   }
   }
 }
 }

public/app/features/dashboard/dashgrid/PanelEditor.tsx

@@ -96,7 +96,7 @@ export class PanelEditor extends PureComponent<PanelEditorProps> {
             return <TabItem tab={tab} activeTab={activeTab} onClick={this.onChangeTab} key={tab.id} />;
             return <TabItem tab={tab} activeTab={activeTab} onClick={this.onChangeTab} key={tab.id} />;
           })}
           })}
         </div>
         </div>
-        {this.renderCurrentTab(activeTab)}
+        <div className="panel-editor__right">{this.renderCurrentTab(activeTab)}</div>
       </div>
       </div>
     );
     );
   }
   }

public/app/features/dashboard/dashgrid/VisualizationTab.tsx

@@ -126,8 +126,14 @@ export class VisualizationTab extends PureComponent<Props> {
       },
       },
     };
     };
 
 
+    const panelHelp = {
+      title: '',
+      icon: 'fa fa-question',
+      render: () => <h2>Help</h2>,
+    };
+
     return (
     return (
-      <EditorTabBody heading="Visualization" main={panelSelection} toolbarItems={[]}>
+      <EditorTabBody heading="Visualization" main={panelSelection} toolbarItems={[panelHelp]}>
         {this.renderPanelOptions()}
         {this.renderPanelOptions()}
       </EditorTabBody>
       </EditorTabBody>
     );
     );

public/sass/components/_panel_editor.scss

@@ -162,7 +162,7 @@
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
   position: absolute;
   position: absolute;
-  top: 60px;
+  top: 79px;
   left: 5px;
   left: 5px;
   align-items: center;
   align-items: center;
 
 

public/sass/components/_toolbar.scss

@@ -6,7 +6,7 @@
   position: relative;
   position: relative;
   z-index: 1;
   z-index: 1;
   flex: 0 0 auto;
   flex: 0 0 auto;
-  background: $input-label-bg;
+  background: $black;
   border-bottom: 1px solid $black;
   border-bottom: 1px solid $black;
   border-radius: 3px;
   border-radius: 3px;
 }
 }
@@ -44,10 +44,7 @@
 
 
 .toolbar-subview {
 .toolbar-subview {
   position: relative;
   position: relative;
-  padding: 20px 20px;
-  background-color: $empty-list-cta-bg;
-  top: -45px;
-  margin: 0 30px 20px 0px;
+  top: -23px;
 }
 }
 
 
 .toolbar-subview__close {
 .toolbar-subview__close {
@@ -56,7 +53,7 @@
   border: none;
   border: none;
   position: absolute;
   position: absolute;
   right: 15px;
   right: 15px;
-  top: 20px;
+  top: 0px;
   font-size: $font-size-md;
   font-size: $font-size-md;
 
 
   &:hover {
   &:hover {