Cleaning up the dashboard CSS and fixing small visual problems.

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

@@ -34,20 +34,20 @@ ul#tabs a{padding-top:4px;padding-bottom:4px}
 .list_toolbar{padding:4px 0 4px 0}
 .list_toolbar [class*="span"]{min-height:26px}
 .list_header{font-weight:bold}
-.list_container{margin-top:4px;margin-bottom:16px;border:1px solid #ababab;border-radius:4px}
+.list_container{margin-top:4px;margin-bottom:20px;border:1px solid #ababab;border-radius:4px}
 .list_container>div{border-bottom:1px solid #ababab}.list_container>div:hover .list-item{background-color:#f00}
 .list_container>div:last-child{border:none}
 .list_item:hover .list_item{background-color:#ddd}
 .list_item a{text-decoration:none}
-.list_header>div,.list_item>div{padding-top:4px;padding-bottom:4px;padding-left:7px;padding-right:7px}
-.item_name{line-height:22px}
+.list_header>div,.list_item>div{padding-top:4px;padding-bottom:4px;padding-left:7px;padding-right:7px;height:22px;line-height:22px}
+.item_name{line-height:22px;height:26px}
 .item_icon{font-size:14px;color:#5e5e5e;margin-right:7px}
 .item_buttons{line-height:1em}
 .toolbar_info{height:26px;line-height:26px}
-input.nbname_input{padding-top:3px;padding-bottom:3px;height:14px;line-height:14px;margin:0}
+input.nbname_input,input.engine_num_input{padding-top:3px;padding-bottom:3px;height:14px;line-height:14px;margin:0}
+input.engine_num_input{width:60px}
 .highlight_text{color:#00f}
 #project_name>.breadcrumb{padding:0;margin-bottom:0;background-color:transparent;font-weight:bold}
-input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px}
 .ansibold{font-weight:bold}
 .ansiblack{color:#000}
 .ansired{color:#8b0000}

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

@@ -1311,20 +1311,20 @@ ul#tabs a{padding-top:4px;padding-bottom:4px}
 .list_toolbar{padding:4px 0 4px 0}
 .list_toolbar [class*="span"]{min-height:26px}
 .list_header{font-weight:bold}
-.list_container{margin-top:4px;margin-bottom:16px;border:1px solid #ababab;border-radius:4px}
+.list_container{margin-top:4px;margin-bottom:20px;border:1px solid #ababab;border-radius:4px}
 .list_container>div{border-bottom:1px solid #ababab}.list_container>div:hover .list-item{background-color:#f00}
 .list_container>div:last-child{border:none}
 .list_item:hover .list_item{background-color:#ddd}
 .list_item a{text-decoration:none}
-.list_header>div,.list_item>div{padding-top:4px;padding-bottom:4px;padding-left:7px;padding-right:7px}
-.item_name{line-height:22px}
+.list_header>div,.list_item>div{padding-top:4px;padding-bottom:4px;padding-left:7px;padding-right:7px;height:22px;line-height:22px}
+.item_name{line-height:22px;height:26px}
 .item_icon{font-size:14px;color:#5e5e5e;margin-right:7px}
 .item_buttons{line-height:1em}
 .toolbar_info{height:26px;line-height:26px}
-input.nbname_input{padding-top:3px;padding-bottom:3px;height:14px;line-height:14px;margin:0}
+input.nbname_input,input.engine_num_input{padding-top:3px;padding-bottom:3px;height:14px;line-height:14px;margin:0}
+input.engine_num_input{width:60px}
 .highlight_text{color:#00f}
 #project_name>.breadcrumb{padding:0;margin-bottom:0;background-color:transparent;font-weight:bold}
-input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px}
 .ansibold{font-weight:bold}
 .ansiblack{color:#000}
 .ansired{color:#8b0000}

IPython/html/static/tree/js/notebooklist.js

@@ -167,31 +167,31 @@ var IPython = (function (IPython) {
         if (param !== undefined && param.msg) {
             message = param.msg;
         }
+        var item = null;
         var len = data.length;
         this.clear_list();
         if (len === 0) {
-            $(this.new_notebook_item(0))
-                .append(
-                    $('<div style="margin:auto;text-align:center;color:grey"/>')
-                    .text(message)
-                );
+            var item = this.new_notebook_item(0);
+            var span12 = item.children().first();
+            span12.empty();
+            span12.append($('<div style="margin:auto;text-align:center;color:grey"/>').text(message))
         }
         var path = this.notebookPath();
         var offset = 0;
         if (path !== '') {
-            var item = this.new_notebook_item(0);
+            item = this.new_notebook_item(0);
             this.add_dir(path, '..', item);
             offset = 1;
         }
         for (var i=0; i<len; i++) {
             if (data[i].type === 'directory') {
                 var name = data[i].name;
-                var item = this.new_notebook_item(i+offset);
+                item = this.new_notebook_item(i+offset);
                 this.add_dir(path, name, item);
             } else {
                 var name = data[i].name;
                 var nbname = utils.splitext(name)[0];
-                var item = this.new_notebook_item(i+offset);
+                item = this.new_notebook_item(i+offset);
                 this.add_link(path, nbname, item);
                 name = utils.url_path_join(path, name);
                 if(this.sessions[name] === undefined){

IPython/html/static/tree/less/tree.less

@@ -7,7 +7,10 @@
 
 @dashboard_tb_pad: 4px;
 @dashboard_lr_pad: 7px;
-
+// These are the total heights of the Bootstrap small and mini buttons. These values
+// are not less variables so we have to track them statically.
+@btn_small_height: 26px;
+@btn_mini_height: 22px;
 
 ul#tabs {
     margin-bottom: @dashboard_tb_pad;
@@ -23,7 +26,7 @@ ul#tabs a {
 }
 
 .list_toolbar [class*="span"] {
-    min-height: 26px;
+    min-height: @btn_small_height;
 }
 
 .list_header {
@@ -32,7 +35,7 @@ ul#tabs a {
 
 .list_container {
   margin-top: @dashboard_tb_pad;
-  margin-bottom: 16px;
+  margin-bottom: 5*@dashboard_tb_pad;
   border: 1px solid @border_color;
   border-radius: 4px;
 }
@@ -60,10 +63,13 @@ ul#tabs a {
     padding-bottom: @dashboard_tb_pad;
     padding-left: @dashboard_lr_pad;
     padding-right: @dashboard_lr_pad;
+    height: @btn_mini_height;
+    line-height: @btn_mini_height;
 }
 
 .item_name {
-    line-height: 22px;
+    line-height: @btn_mini_height;
+    height: @btn_small_height;
 }
 
 .item_icon {
@@ -77,11 +83,12 @@ ul#tabs a {
 }
 
 .toolbar_info {
-    height: 26px;
-    line-height: 26px;
+    height: @btn_small_height;
+    line-height: @btn_small_height;
 }
 
-input.nbname_input {
+input.nbname_input, input.engine_num_input {
+    // These settings give these inputs a height that matches @btn_mini_height = 22
     padding-top: 3px;
     padding-bottom: 3px;
     height: 14px;
@@ -89,11 +96,14 @@ input.nbname_input {
     margin: 0px;
 }
 
+input.engine_num_input {
+    width: 60px;
+}
+
 .highlight_text {
     color: blue;
 }
 
-
 #project_name > .breadcrumb {
     padding: 0px;
     margin-bottom: 0px;
@@ -102,10 +112,4 @@ input.nbname_input {
    
 }
 
-input.engine_num_input {
-    height: 20px;
-    margin-bottom:2px;
-    padding-top:0;
-    padding-bottom:0;
-    width: 60px;
-}
+