Make Sqllab a one-page app -- body not scrollable (#1551)

* Make Sqllab a one-page app -- body not scrollable

* Add scroll-container and scroll-content in main.css

caravel/assets/javascripts/SqlLab/components/SqlEditor.jsx

@@ -227,7 +227,8 @@ class SqlEditor extends React.PureComponent {
             </Col>
           </Collapse>
           <Col md={this.props.hideLeftBar ? 12 : 9}>
-            <div className="scrollbar">
+            <div className="scrollbar-container">
+              <div className="scrollbar-content">
                 <AceEditorWrapper
                   actions={this.props.actions}
                   onBlur={this.setQueryEditorSql.bind(this)}
@@ -244,6 +245,7 @@ class SqlEditor extends React.PureComponent {
                   actions={this.props.actions}
                 />
               </div>
+            </div>
           </Col>
         </Row>
       </div>

caravel/assets/javascripts/SqlLab/components/SqlEditorLeftBar.jsx

@@ -99,7 +99,8 @@ class SqlEditorLeftBar extends React.PureComponent {
     }
     const shouldShowReset = window.location.search === '?reset=1';
     return (
-      <div className="clearfix sql-toolbar scrollbar">
+      <div className="scrollbar-container">
+        <div className="clearfix sql-toolbar scrollbar-content">
           {networkAlert}
           <div>
             <DatabaseSelect
@@ -156,6 +157,7 @@ class SqlEditorLeftBar extends React.PureComponent {
             </Button>
           }
         </div>
+      </div>
     );
   }
 }

caravel/assets/javascripts/SqlLab/main.css

@@ -1,3 +1,6 @@
+body {
+    overflow: hidden;
+}
 .inlineBlock {
     display: inline-block;
 }
@@ -29,11 +32,22 @@
     padding-bottom: 5px;
 }
 
-.scrollbar {
+.scrollbar-container {
   position: relative;
+  overflow: hidden;
   width: 100%;
-    overflow-y: auto;
-    height: 100%;
+  height: 95%;
+}
+
+.scrollbar-content {
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
+  overflow: scroll;
+  margin-right: 0px;
+  margin-bottom: 100px;
 }
 
 .Workspace .btn-sm {