updates to dashboard edit mode

public/app/features/dashboard/model.ts

@@ -187,11 +187,11 @@ export class DashboardModel {
       return;
     }
 
-    var visableTemplates = _.filter(this.templating.list, function(template) {
-      return template.hideVariable === undefined || template.hideVariable === false;
+    var visibleVars = _.filter(this.templating.list, function(template) {
+      return template.hide !== 2;
     });
 
-    this.meta.submenuEnabled = visableTemplates.length > 0 || this.annotations.list.length > 0 || this.links.length > 0;
+    this.meta.submenuEnabled = visibleVars.length > 0 || this.annotations.list.length > 0 || this.links.length > 0;
   }
 
   getPanelInfoById(panelId) {

public/app/features/dashboard/row/row.html

-<div class="dash-row-header" ng-if="ctrl.dashboard.editMode || ctrl.row.showTitle">
+<div class="dash-row-header">
   <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>
@@ -11,12 +11,19 @@
   </div>
 
   <div class="dash-row-header-actions">
-    <a class="pointer" ng-click="ctrl.showAddPanel()">Add Panel <i class="fa fa-plus"></i></a>
-    <a class="pointer" ng-click="ctrl.showRowOptions()">Row Options <i class="fa fa-cog"></i></a>
+    <a class="pointer dash-row-header-action-add-panel" ng-click="ctrl.showAddPanel()">
+      Add Panel
+      <i class="fa fa-plus" ng-hide="ctrl.dropView===1"></i>
+      <i class="fa fa-remove" ng-show="ctrl.dropView===1"></i>
+    </a>
+    <a class="pointer dash-row-header-action-show-options" ng-click="ctrl.showRowOptions()">
+      Row Options
+      <i class="fa fa-cog" ng-hide="ctrl.dropView===2"></i>
+      <i class="fa fa-remove" ng-show="ctrl.dropView===2"></i>
+    </a>
   </div>
 </div>
 
-
 <div ng-if="ctrl.dropView === 1">
   <dash-row-add-panel row-ctrl="ctrl"></dash-row-add-panel>
 </div>

public/app/features/dashboard/row/row.ts

@@ -104,8 +104,11 @@ export function rowDirective($rootScope) {
       row: "=",
     },
     link: function(scope, element) {
-      scope.$watchGroup(['ctrl.row.collapse', 'ctrl.row.height'], function() {
+      scope.$watchGroup(['ctrl.row.collapse', 'ctrl.row.height', 'ctrl.row.showTitle', 'ctrl.dropView'], function() {
         element.css({minHeight: scope.ctrl.row.collapse ? '5px' : scope.ctrl.row.height});
+        element.toggleClass('dash-row-show-title', scope.ctrl.row.showTitle === true);
+        element.toggleClass('dash-row-show-options', scope.ctrl.dropView === 2);
+        element.toggleClass('dash-row-show-add-panel', scope.ctrl.dropView === 1);
       });
 
       $rootScope.onAppEvent('panel-fullscreen-enter', function(evt, info) {
@@ -184,21 +187,3 @@ coreModule.directive('panelDropZone', function($timeout) {
   };
 });
 
-coreModule.directive('rowHeight', function() {
-  return function(scope, element) {
-    scope.$watchGroup(['row.collapse', 'row.height'], function() {
-      element.css({ minHeight: scope.row.collapse ? '5px' : scope.row.height });
-    });
-
-    scope.onAppEvent('panel-fullscreen-enter', function(evt, info) {
-      var hasPanel = _.find(scope.row.panels, {id: info.panelId});
-      if (!hasPanel) {
-        element.hide();
-      }
-    });
-
-    scope.onAppEvent('panel-fullscreen-exit', function() {
-      element.show();
-    });
-  };
-});

public/app/features/templating/editor_ctrl.ts

@@ -146,7 +146,7 @@ export class VariableEditorCtrl {
     $scope.removeVariable = function(variable) {
       var index = _.indexOf($scope.variables, variable);
       $scope.variables.splice(index, 1);
-      $scope.updateSubmenuVisibility();
+      $scope.dashboard.updateSubmenuVisibility();
     };
   }
 }

public/app/partials/dashboard.html

@@ -10,11 +10,11 @@
 
 		<div class="clearfix"></div>
 
-    <dash-row class="dash-row" ng-repeat="row in dashboard.rows" row="row" dashboard="dashboard" row-height>
+    <dash-row class="dash-row" ng-repeat="row in dashboard.rows" row="row" dashboard="dashboard">
     </dash-row>
 	</div>
 
-	<div ng-show='dashboardMeta.canEdit' class="row-fluid add-row-panel-hint" ng-hide="dashboard.meta.fullscreen">
+	<div ng-show='dashboardMeta.canEdit' class="row-fluid add-row-panel-hint">
 		<div class="span12" style="text-align:right;">
 			<span style="margin-right: 10px;" ng-click="addRowDefault()" class="pointer btn btn-secondary btn-small">
 				<span><i class="fa fa-plus"></i> ADD ROW</span>

public/sass/pages/_dashboard.scss

@@ -57,6 +57,10 @@ div.flot-text {
   }
 }
 
+.add-row-panel-hint {
+  display: none;
+}
+
 .panel-content {
   padding: 0px 10px 5px 10px;
 }
@@ -212,6 +216,7 @@ div.flot-text {
 .dash-row-header {
   position: relative;
   display: flex;
+  display: none;
   flex-direction: row;
   margin-right: $panel-margin;
   margin-left: 0;
@@ -222,9 +227,9 @@ div.flot-text {
     }
   }
 
-  .h1 { font-size: 3rem; font-style: normal; }
-  .h2 { font-size: 2.5rem; }
-  .h3 { font-size: 2rem; }
+  .h1 { font-size: 2.7rem; font-style: normal; line-height: 4rem }
+  .h2 { font-size: 2.4rem; line-height: 3.5rem; }
+  .h3 { font-size: 2.0rem; line-height: 3rem;}
   .h4 { font-size: 1.7rem; }
   .h5 { font-size: 1.4rem; }
   .h6 { font-size: 1rem }
@@ -265,6 +270,30 @@ div.flot-text {
   }
 }
 
+.dash-row-show-options {
+  .dash-row-header-actions {
+    display: block;
+  }
+  .dash-row-header-action-show-options {
+    color: $link-color;
+  }
+}
+
+.dash-row-show-add-panel {
+  .dash-row-header-actions {
+    display: block;
+  }
+  .dash-row-header-action--add-panel {
+    color: $link-color;
+  }
+}
+
+.dash-row-show-title {
+  .dash-row-header {
+    display: block;
+  }
+}
+
 .dash-row-header-add-panel {
   padding: 0.7rem;
   i {
@@ -281,6 +310,9 @@ div.flot-text {
 }
 
 .dash-edit-mode {
+  .dash-row-header {
+    display: block;
+  }
   .dash-row {
     border-left: 1px solid $dark-4;
   }
@@ -290,6 +322,9 @@ div.flot-text {
   .panels-wrapper {
     margin-left: $panel-margin;
   }
+  .add-row-panel-hint {
+    display: block;
+  }
 }
 
 .dash-row-options-close-btn {
@@ -323,13 +358,6 @@ div.flot-text {
   position: relative;
 }
 
-.dash-row-add-panel-form {
-  position: absolute;
-  width: 200px;
-  top: -34px;
-  left: 5px;
-}
-
 .add-panel-panels-scroll {
   width: 100%;
   overflow: hidden;