fix end_space size

closes #7409

Mostly a symptome of too many nested div that do different things.

don't try to both have an end space inside and outside the 'document'
area. And don't try to also get the things to be 100viewport height by
hacking around and make them smaller;

IPython/html/static/base/less/variables.less

@@ -47,7 +47,7 @@ label {
 /* Make the page background atleast 100% the height of the view port */
 @page-backdrop-height: 100vh;
 /* Make the page itself atleast 70% the height of the view port */
-@page-min-height: 70vh;
+@page-min-height: 0;
 @page-backdrop-color: #EEE;
 @page-color: @body-bg;
 @page-padding: 15px;

IPython/html/static/notebook/js/notebook.js

@@ -195,7 +195,7 @@ define([
             that.insert_cell_below('code',ncells-1);
         });
         this.element.append(this.container);
-        this.container.append(end_space);
+        this.container.after(end_space);
     };
 
     /**
@@ -955,7 +955,7 @@ define([
 
         if (ncells === 0) {
             // special case append if empty
-            this.element.find('div.end_space').before(element);
+            this.container.append(element);
         } else if ( ncells === index ) {
             // special case append it the end, but not empty
             this.get_cell_element(index-1).after(element);

IPython/html/static/notebook/js/pager.js

@@ -21,7 +21,7 @@ define([
         this.events = options.events;
         this.pager_element = $(pager_selector);
         this.pager_button_area = $('#pager-button-area');
-        this._default_end_space = 200;
+        this._default_end_space = 100;
         this.pager_element.resizable({handles: 'n', resize: $.proxy(this._resize, this)});
         this.expanded = false;
         this.create_button_area();

IPython/html/static/notebook/less/notebook.less

@@ -1,6 +1,6 @@
 @media (max-width: 767px) {
     // remove bootstrap-responsive's body padding on small screens
-    body.notebook_app {
+    .notebook_app {
         padding-left: 0px;
         padding-right: 0px;
     }
@@ -14,12 +14,9 @@ div#notebook_panel {
     margin: 0px;
     padding: 0px;
     .border-box-sizing();
-    @media not print {
-        background-color: @page-backdrop-color;
-        min-height: @page-backdrop-height;
-    }
 }
-div#notebook {
+
+#notebook {
     font-size: @notebook_font_size;
     line-height: @notebook_line_height;
     overflow-y: hidden;
@@ -27,7 +24,6 @@ div#notebook {
     width: 100%;
     /* This spaces the page away from the edge of the notebook area */
     padding-top: @page-header-padding;
-    padding-bottom: @page-header-padding;
     margin: 0px;
     outline: none;
     .border-box-sizing();
@@ -73,9 +69,15 @@ p {
 }
 
 .end_space {
-    height: 200px;
+    min-height: 100px;
 }
 
 .notebook_app #header {
     .box-shadow(@global-shadow);
 }
+
+.notebook_app{
+    @media not print {
+        background-color: @page-backdrop-color;
+    }
+}

IPython/html/static/style/style.min.css

@@ -8720,7 +8720,7 @@ ul#new-menu {
   #texteditor-backdrop #texteditor-container {
     padding: 0px;
     background-color: #ffffff;
-    min-height: 70vh;
+    min-height: 0;
     -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
     box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
   }
@@ -10026,7 +10026,7 @@ h6:hover .anchor-link {
 *
 */
 @media (max-width: 767px) {
-  body.notebook_app {
+  .notebook_app {
     padding-left: 0px;
     padding-right: 0px;
   }
@@ -10043,13 +10043,7 @@ div#notebook_panel {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
 }
-@media not print {
-  div#notebook_panel {
-    background-color: #eeeeee;
-    min-height: 100vh;
-  }
-}
-div#notebook {
+#notebook {
   font-size: 14px;
   line-height: 20px;
   overflow-y: hidden;
@@ -10057,7 +10051,6 @@ div#notebook {
   width: 100%;
   /* This spaces the page away from the edge of the notebook area */
   padding-top: 20px;
-  padding-bottom: 20px;
   margin: 0px;
   outline: none;
   box-sizing: border-box;
@@ -10068,7 +10061,7 @@ div#notebook {
   #notebook-container {
     padding: 15px;
     background-color: #ffffff;
-    min-height: 70vh;
+    min-height: 0;
     -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
     box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
   }
@@ -10103,12 +10096,17 @@ p {
   margin-bottom: 0;
 }
 .end_space {
-  height: 200px;
+  min-height: 100px;
 }
 .notebook_app #header {
   -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
   box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
 }
+@media not print {
+  .notebook_app {
+    background-color: #eeeeee;
+  }
+}
 /* CSS for the cell toolbar */
 .celltoolbar {
   border: thin solid #CFCFCF;