Initial try at adding tabs to project dashboard.

IPython/frontend/html/notebook/static/css/projectdashboard.css

@@ -7,7 +7,7 @@
 
 #main_app {
     width: 920px;
-    margin: auto;
+    margin: 30px auto 0px auto;
 }
 
 #notebooks_toolbar {
@@ -51,3 +51,7 @@
 .highlight_text {
     color: blue;
 }
+
+.ui-tabs .ui-tabs-nav li a {
+    padding: .3em .5em;
+}

IPython/frontend/html/notebook/static/js/projectdashboardmain.js

@@ -14,6 +14,7 @@ $(document).ready(function () {
 
     IPython.page = new IPython.Page();
 
+    $('div#tabs').tabs();
     $('div#main_app').addClass('border-box-sizing ui-widget');
     $('div#notebooks_toolbar').addClass('ui-widget ui-helper-clearfix');    
     $('#new_notebook').button().click(function (e) {

IPython/frontend/html/notebook/templates/projectdashboard.html

@@ -21,22 +21,31 @@ data-read-only={{read_only}}
 
 <div id="main_app">
 
-    {% if logged_in or not read_only %}
-
-    <div id="notebooks_toolbar">
-        <span id="drag_info">Drag files onto the list to import
-        notebooks.</span>
-
-        <span id="notebooks_buttons">
-          <button id="new_notebook">New Notebook</button>
-        </span>
+<div id="tabs">
+    <ul>
+        <li><a href="#tab1">Notebooks</a></li>
+        <li><a href="#tab2">Clusters</a></li>
+    </ul>
+
+    <div id="tab1">
+        {% if logged_in or not read_only %}
+        <div id="notebooks_toolbar">
+            <span id="drag_info">Drag files onto the list to import
+            notebooks.</span>
+
+            <span id="notebooks_buttons">
+              <button id="new_notebook">New Notebook</button>
+            </span>
+        </div>
+        {% end %}
+
+        <div id="notebook_list">
+            <div id="project_name"><h2>{{project}}</h2></div>
+        </div>
     </div>
-
-    {% end %}
-
-    <div id="notebook_list">
-        <div id="project_name"><h2>{{project}}</h2></div>
+    <div id="tab2">
     </div>
+</div>
 
 </div>