From 155cce959f8c32788933048a61da577232046ca3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Fri, 28 Oct 2016 14:38:48 +0200
Subject: [PATCH] more polish on edit mode

---
 .../app/features/dashboard/dashboard_ctrl.ts  |  1 -
 .../features/dashboard/dashnav/dashnav.html   |  2 +-
 public/app/features/dashboard/model.ts        |  4 +++
 .../app/features/dashboard/row/add_panel.ts   |  6 ++---
 public/app/features/dashboard/row/row.html    |  2 +-
 .../features/dashboard/submenu/submenu.html   |  2 +-
 public/sass/pages/_dashboard.scss             | 25 +++++++++++--------
 7 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/public/app/features/dashboard/dashboard_ctrl.ts b/public/app/features/dashboard/dashboard_ctrl.ts
index 8845717659d..e273a8a3b69 100644
--- a/public/app/features/dashboard/dashboard_ctrl.ts
+++ b/public/app/features/dashboard/dashboard_ctrl.ts
@@ -40,7 +40,6 @@ export class DashboardCtrl {
       $scope.setupDashboardInternal = function(data) {
         var dashboard = dashboardSrv.create(data.dashboard, data.meta);
         dashboardSrv.setCurrent(dashboard);
-        dashboard.editMode = true;
 
         // init services
         timeSrv.init(dashboard);
diff --git a/public/app/features/dashboard/dashnav/dashnav.html b/public/app/features/dashboard/dashnav/dashnav.html
index 47d12d05206..024f5365d2a 100644
--- a/public/app/features/dashboard/dashnav/dashnav.html
+++ b/public/app/features/dashboard/dashnav/dashnav.html
@@ -52,7 +52,7 @@
 	<li ng-if="::showSettingsMenu" class="dropdown">
 		<a class="pointer" ng-click="hideTooltip($event)" bs-tooltip="'Manage dashboard'" data-placement="bottom" data-toggle="dropdown"><i class="fa fa-cog"></i></a>
 		<ul class="dropdown-menu">
-			<li ng-if="dashboardMeta.canEdit"><a class="pointer" ng-click="dashboard.editMode = true;">Enter Build Mode</a></li>
+			<li ng-if="dashboardMeta.canEdit"><a class="pointer" ng-click="dashboard.toggleEditMode();">Enter Build Mode</a></li>
 			<li ng-if="dashboardMeta.canEdit"><a class="pointer" ng-click="openEditView('settings');">Settings</a></li>
 			<li ng-if="dashboardMeta.canEdit"><a class="pointer" ng-click="openEditView('annotations');">Annotations</a></li>
 			<li ng-if="dashboardMeta.canEdit"><a class="pointer" ng-click="openEditView('templating');">Templating</a></li>
diff --git a/public/app/features/dashboard/model.ts b/public/app/features/dashboard/model.ts
index 12abddc16ef..9ef31d7a5e9 100644
--- a/public/app/features/dashboard/model.ts
+++ b/public/app/features/dashboard/model.ts
@@ -65,6 +65,10 @@ export class DashboardModel {
     this.links = data.links || [];
     this.gnetId = data.gnetId || null;
 
+    if (this.id === null) {
+      this.editMode = true;
+    }
+
     this.updateSchema(data);
     this.initMeta(meta);
   }
diff --git a/public/app/features/dashboard/row/add_panel.ts b/public/app/features/dashboard/row/add_panel.ts
index 8493c00725a..7e1ba18ac5d 100644
--- a/public/app/features/dashboard/row/add_panel.ts
+++ b/public/app/features/dashboard/row/add_panel.ts
@@ -48,9 +48,9 @@ export class AddPanelCtrl {
   }
 
   panelSearchBlur() {
-    this.$timeout(() => {
-      this.rowCtrl.dropView = 0;
-    }, 400);
+    // this.$timeout(() => {
+    //   this.rowCtrl.dropView = 0;
+    // }, 400);
   }
 
   moveSelection(direction) {
diff --git a/public/app/features/dashboard/row/row.html b/public/app/features/dashboard/row/row.html
index 07519334589..9cca206a25e 100644
--- a/public/app/features/dashboard/row/row.html
+++ b/public/app/features/dashboard/row/row.html
@@ -1,4 +1,4 @@
-<div class="dash-row-header">
+<div class="dash-row-header" ng-if="ctrl.dashboard.editMode || ctrl.row.showTitle">
   <a class="dash-row-header-title" ng-click="ctrl.toggleCollapse()">
     <span class="dash-row-collapse-toggle pointer">
       <i class="fa fa-chevron-down" ng-show="!ctrl.row.collapse"></i>
diff --git a/public/app/features/dashboard/submenu/submenu.html b/public/app/features/dashboard/submenu/submenu.html
index 3e972caeb18..429772bb7ea 100644
--- a/public/app/features/dashboard/submenu/submenu.html
+++ b/public/app/features/dashboard/submenu/submenu.html
@@ -36,7 +36,7 @@
   </div>
 
   <div class="gf-form" ng-if="ctrl.dashboard.editMode" ng-click="ctrl.exitBuildMode();">
-    <button class="btn btn-primary gf-form-btn">
+    <button class="btn btn-secondary gf-form-btn">
       Exit Build Mode
     </button>
   </div>
diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss
index 6b75f360db6..edf614f5227 100644
--- a/public/sass/pages/_dashboard.scss
+++ b/public/sass/pages/_dashboard.scss
@@ -206,7 +206,6 @@ div.flot-text {
 //
 
 .dash-row {
-  border-left: 1px solid $dark-4;
   display: block;
 }
 
@@ -216,7 +215,6 @@ div.flot-text {
   flex-direction: row;
   margin-right: $panel-margin;
   margin-left: 0;
-  // border-bottom: 1px solid $dark-4;
 
   &:hover {
     .dash-row-header-actions {
@@ -224,16 +222,15 @@ div.flot-text {
     }
   }
 
-  .h1 { font-size: $font-size-h1; }
-  .h2 { font-size: $font-size-h2; }
-  .h3 { font-size: $font-size-h3; }
-  .h4 { font-size: $font-size-h4; }
-  .h5 { font-size: $font-size-h5; }
-  .h6 { font-size: $font-size-h6; }
+  .h1 { font-size: 3rem; font-style: normal; }
+  .h2 { font-size: 2.5rem; }
+  .h3 { font-size: 2rem; }
+  .h4 { font-size: 1.7rem; }
+  .h5 { font-size: 1.4rem; }
+  .h6 { font-size: 1rem }
 }
 
 .dash-row-header-title {
-  border-top: 1px solid $dark-4;
   padding: 0.6rem;
 
   .dash-row-collapse-toggle {
@@ -285,8 +282,13 @@ div.flot-text {
 
 .dash-edit-mode {
   .dash-row {
+    border-left: 1px solid $dark-4;
+  }
+  .dash-row-header-title {
+    border-top: 1px solid $dark-4;
   }
   .panels-wrapper {
+    margin-left: $panel-margin;
   }
 }
 
@@ -309,13 +311,13 @@ div.flot-text {
 .dash-row-options {
   background: $panel-bg;
   border: $panel-border;
-  margin: 0 0 $panel-margin*2 $panel-margin;
+  margin: 0 0 $panel-margin*2 $panel-margin*2;
   padding: $spacer*1.5;
 }
 
 .dash-row-add-panel {
   margin: 0;
-  padding: $panel-margin;
+  padding: $panel-margin*2;
   display: flex;
   align-items: flex-start;
   position: relative;
@@ -325,6 +327,7 @@ div.flot-text {
   position: absolute;
   width: 200px;
   top: -34px;
+  left: 5px;
 }
 
 .add-panel-panels-scroll {