From 7f7ea67c052dbb828b723c5eae86230cd8917627 Mon Sep 17 00:00:00 2001
From: Rashid Khan <rashidkpc@gmail.com>
Date: Mon, 29 Sep 2014 16:04:34 -0700
Subject: [PATCH] float the apple/discard buttons at the bottom. Closes #420

---
 src/kibana/apps/visualize/editor/editor.less  | 20 ++++++++++++++++++-
 src/kibana/apps/visualize/editor/sidebar.html |  4 +++-
 src/kibana/apps/visualize/styles/main.less    |  2 +-
 src/kibana/styles/_variables.less             |  7 +------
 4 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/src/kibana/apps/visualize/editor/editor.less b/src/kibana/apps/visualize/editor/editor.less
index 04fbaa09d24f1..b11b55cae555a 100644
--- a/src/kibana/apps/visualize/editor/editor.less
+++ b/src/kibana/apps/visualize/editor/editor.less
@@ -1,6 +1,11 @@
 .vis-editor {
   .flex-parent();
 
+  @vis-editor-sidebar-basis: (100/12) * 2%; // two of twelve columns
+  @vis-editor-sidebar-min-width: 350px;
+  @vis-editor-nesting-width: 8px;
+  @vis-editor-agg-editor-spacing: 5px;
+
   navbar {
     .bitty-modal-container {
       position: relative;
@@ -39,6 +44,20 @@
     @media (min-width: @screen-md-min) {
       .flex-basis(@vis-editor-sidebar-basis);
       min-width: @vis-editor-sidebar-min-width;
+      margin-bottom: (@input-height-base * 2) - 3;
+    }
+
+    &-buttons {
+      // overrides for tablet and desktop
+      @media (min-width: @screen-md-min) {
+        position: absolute;
+        bottom: 0;
+        min-width: @vis-editor-sidebar-min-width;
+      }
+    }
+
+    .sidebar-item {
+      border-top: 0 !important;
     }
 
     .sidebar-container {
@@ -79,7 +98,6 @@
     &-group {
       .flex-parent();
       color: @text-color;
-      margin-bottom: 10px;
     }
 
     &-header {
diff --git a/src/kibana/apps/visualize/editor/sidebar.html b/src/kibana/apps/visualize/editor/sidebar.html
index 962272c9afacd..10855e58d51eb 100644
--- a/src/kibana/apps/visualize/editor/sidebar.html
+++ b/src/kibana/apps/visualize/editor/sidebar.html
@@ -29,13 +29,15 @@
         </vis-editor-agg-group>
 
         <!-- apply/discard -->
-        <li class="sidebar-item" ng-if="vis.dirty">
+        <li class="vis-editor-sidebar-buttons sidebar-item">
           <button
+            ng-disabled="!vis.dirty"
             type="submit"
             class="sidebar-item-button success">
             Apply
           </button>
           <button
+            ng-disabled="!vis.dirty"
             type="button"
             ng-click="reset()"
             class="sidebar-item-button warn">
diff --git a/src/kibana/apps/visualize/styles/main.less b/src/kibana/apps/visualize/styles/main.less
index 622bca1f2a6d2..67207d1583dd2 100644
--- a/src/kibana/apps/visualize/styles/main.less
+++ b/src/kibana/apps/visualize/styles/main.less
@@ -19,4 +19,4 @@
   font-size: 1.2em;
 }
 
-@import "../editor/editor.less";
\ No newline at end of file
+@import "../editor/editor.less";
diff --git a/src/kibana/styles/_variables.less b/src/kibana/styles/_variables.less
index 9c3ef5a570b03..22fa14b1a5cb3 100644
--- a/src/kibana/styles/_variables.less
+++ b/src/kibana/styles/_variables.less
@@ -16,9 +16,4 @@
 @sidebar-active-color: @component-active-color;
 @sidebar-active-bg: @component-active-bg;
 @sidebar-active-hover-bg: @component-active-bg;
-@sidebar-active-hover-color: @component-active-color;
-
-@vis-editor-sidebar-basis: (100/12) * 2%; // two of twelve columns
-@vis-editor-sidebar-min-width: 350px;
-@vis-editor-nesting-width: 8px;
-@vis-editor-agg-editor-spacing: 5px;
\ No newline at end of file
+@sidebar-active-hover-color: @component-active-color;
\ No newline at end of file