From 05753077864dc221e5cdc8a082789b45649834f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Tue, 20 Nov 2018 11:06:36 +0100
Subject: [PATCH 1/3] added header section to legacy tabs

---
 .../dashboard/dashgrid/VisualizationTab.tsx       |  9 ++++++++-
 public/app/plugins/panel/graph/module.ts          |  6 +++---
 public/sass/components/_panel_editor.scss         | 15 +++++++++++++++
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/public/app/features/dashboard/dashgrid/VisualizationTab.tsx b/public/app/features/dashboard/dashgrid/VisualizationTab.tsx
index 065a99ee60c..d6573fe9eec 100644
--- a/public/app/features/dashboard/dashgrid/VisualizationTab.tsx
+++ b/public/app/features/dashboard/dashgrid/VisualizationTab.tsx
@@ -81,7 +81,14 @@ export class VisualizationTab extends PureComponent<Props> {
 
     let template = '';
     for (let i = 0; i < panelCtrl.editorTabs.length; i++) {
-      template += '<panel-editor-tab editor-tab="ctrl.editorTabs[' + i + ']" ctrl="ctrl"></panel-editor-tab>';
+      template += `
+      <div class="form-section" ng-cloak>
+        <div class="form-section__header">{{ctrl.editorTabs[${i}].title}}</div>
+        <div class="form-section__body">
+          <panel-editor-tab editor-tab="ctrl.editorTabs[${i}]" ctrl="ctrl"></panel-editor-tab>
+        </div>
+      </div>
+      `;
     }
 
     const loader = getAngularLoader();
diff --git a/public/app/plugins/panel/graph/module.ts b/public/app/plugins/panel/graph/module.ts
index 8bf35d19e33..37b805f2f40 100644
--- a/public/app/plugins/panel/graph/module.ts
+++ b/public/app/plugins/panel/graph/module.ts
@@ -135,9 +135,9 @@ class GraphCtrl extends MetricsPanelCtrl {
   }
 
   onInitEditMode() {
-    this.addEditorTab('Axes', axesEditorComponent, 2);
-    this.addEditorTab('Legend', 'public/app/plugins/panel/graph/tab_legend.html', 3);
-    this.addEditorTab('Display', 'public/app/plugins/panel/graph/tab_display.html', 4);
+    this.addEditorTab('Display options', 'public/app/plugins/panel/graph/tab_display.html');
+    this.addEditorTab('Axes', axesEditorComponent);
+    this.addEditorTab('Legend', 'public/app/plugins/panel/graph/tab_legend.html');
 
     // if (config.alertingEnabled) {
     //   this.addEditorTab('Alert', alertTab, 5);
diff --git a/public/sass/components/_panel_editor.scss b/public/sass/components/_panel_editor.scss
index a3732cd78f9..50b095671f9 100644
--- a/public/sass/components/_panel_editor.scss
+++ b/public/sass/components/_panel_editor.scss
@@ -206,3 +206,18 @@
   font-size: $font-size-md;
   margin-bottom: 20px;
 }
+
+.form-section {
+  margin-bottom: 10px;
+}
+
+.form-section__header {
+  border-bottom: 2px solid $dark-4;
+  padding: 5px 0px;
+  font-size: $font-size-h5;
+  margin-bottom: 20px;
+}
+
+.form-section__body {
+  background: $dark-1;
+}

From 3b76d9ee17153202dce42b2778edb956d5a5c36e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Tue, 20 Nov 2018 11:26:01 +0100
Subject: [PATCH 2/3] minor style update

---
 public/sass/components/_panel_editor.scss | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/public/sass/components/_panel_editor.scss b/public/sass/components/_panel_editor.scss
index 50b095671f9..05608fd38ec 100644
--- a/public/sass/components/_panel_editor.scss
+++ b/public/sass/components/_panel_editor.scss
@@ -20,11 +20,10 @@
   flex-grow: 1;
   min-width: 0;
   display: flex;
-  padding: 0 5px;
 }
 
 .panel-editor__content {
-  padding: 40px 15px;
+  padding: 40px 20px;
 }
 
 .panel-in-fullscreen {
@@ -212,12 +211,13 @@
 }
 
 .form-section__header {
-  border-bottom: 2px solid $dark-4;
-  padding: 5px 0px;
+  padding: 5px 10px;
   font-size: $font-size-h5;
   margin-bottom: 20px;
+  background: $input-label-bg;
+  border-radius: 3px;
 }
 
 .form-section__body {
-  background: $dark-1;
+  padding: 0 10px;
 }

From 5402a0e00d109bd4c7e36306a8ac1352dcf9a544 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Tue, 20 Nov 2018 13:18:48 +0100
Subject: [PATCH 3/3] fixed menu to go to panel view mode

---
 public/app/features/dashboard/utils/getPanelMenu.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/public/app/features/dashboard/utils/getPanelMenu.ts b/public/app/features/dashboard/utils/getPanelMenu.ts
index c1b0a578b68..07ce54108f3 100644
--- a/public/app/features/dashboard/utils/getPanelMenu.ts
+++ b/public/app/features/dashboard/utils/getPanelMenu.ts
@@ -12,7 +12,7 @@ export const getPanelMenu = (dashboard: DashboardModel, panel: PanelModel) => {
       updateLocation({
         query: {
           panelId: panel.id,
-          edit: false,
+          edit: null,
           fullscreen: true,
         },
         partial: true,