Post discussion with @ellisonbg

IPython/html/static/base/less/page.less

@@ -21,6 +21,11 @@ div#header {
     /* Initially hidden to prevent FLOUC */
     display: none;
     margin-bottom: 0px;
+    padding-left: 30px;
+    padding-bottom: 5px;
+    border-bottom: 1px solid @navbar-default-border;
+
+    .box-shadow(0 1px 10px rgba(0,0,0,.05));
 }
 
 #ipython_notebook {
@@ -70,11 +75,6 @@ span#login_widget {
     text-transform: none;
 }
 
-.navbar-nobg {
-    background-color: transparent;
-    background-image: none;
-}
-
 #header > span {
   margin-top: 10px;
 }

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

@@ -1,33 +1,33 @@
 #menubar {
-  margin-bottom: 15px;
-  margin-top: 2px;
-  margin-left: -32px;
-  margin-right: -32px;
-}
+  margin-top: 0px;
+  margin-bottom: -19px;
+  position: relative;
+  z-index: 1000; /* Make the menubar higher than the header so the header's 
+                    shadow doesn't affect the menubar. */
 
-#menubar .navbar-inner {
-  min-height: 28px;
-  border-top: 1px;
-  border-radius: 0px 0px @border-radius-base @border-radius-base;
-}
+  .navbar {
+    border-top: 1px;
+    border-radius: 0px 0px @border-radius-base @border-radius-base;
+  }
 
-#menubar .navbar {
-  margin-bottom: 8px;
-}
 
-.nav-wrapper {
-  border-bottom: 1px solid @navbar-default-border;
-}
+  li.dropdown {
+    line-height: 12px;
 
-#menubar li.dropdown {
-  line-height: 12px;
-}
+    a {
+      padding-top: 6px;
+      padding-bottom: 5px;
+    }
+  }
 
-#menubar .navbar-right {
-  // Add some padding to the right aligned items.
-  padding-top: 5px;
+  ul.navbar-right {
+    padding-top: 2px;
+  }
 }
 
+.nav-wrapper {
+  border-bottom: 1px solid @navbar-default-border;
+}
 
 i.menu-icon {
   // add padding to account for float-right
@@ -42,8 +42,8 @@ ul#help_menu li a{
     }
 }
 
-ul#menus {
-  float: left;
+#menus {
+  min-height: 30px;
 }
 
 // Make sub menus work in BS3.

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

@@ -26,7 +26,7 @@ span#notebook_name {
 div#notebook_panel {
     margin: 0px 0px 0px 0px;
     padding: 0px;
-    .box-shadow(inset 1px 4px 13px -6px rgba(0,0,0,0.2));
+    .box-shadow(0 -1px 10px rgba(0,0,0,.05));
 }
 div#notebook {
     font-size: @notebook_font_size;

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

@@ -25,25 +25,27 @@
   margin-left: 5px;
 }
 
-.toolbar-inner {
-  border: none !important;
-  .box-shadow(none) !important;
-}
-
 #maintoolbar {
-  margin-bottom: 0px;
-  margin-top: -2px;
+  margin-bottom: -3px;
+  margin-top: -8px;
   border: 0px;
   min-height: 27px;
-}
+  margin-left: 32px;
+  padding-top: 6px;
+  padding-bottom: 8px;
 
-#maintoolbar .navbar-text {
-  float: none;
-  vertical-align: middle;
-  text-align: right;
-  margin-left: 5px;
-  margin-right: 0px;
-  margin-top: 0px
+  .navbar-text {
+    float: none;
+    vertical-align: middle;
+    text-align: right;
+    margin-left: 5px;
+    margin-right: 0px;
+    margin-top: 0px
+  }
+
+  .toolbar {
+    margin-top: 0px;
+  }
 }
 
 .select-xs {

IPython/html/templates/page.html

@@ -50,25 +50,23 @@
 </noscript>
 
 <div id="header" class="navbar navbar-static-top">
-  <div class="navbar-inner navbar-nobg">
-    <div class="container">
-    <div id="ipython_notebook" class="nav navbar-brand pull-left"><a href="{{base_url}}tree/{{notebook_path}}" alt='dashboard'><img src='{{static_url("base/images/ipynblogo.png") }}' alt='IPython Notebook'/></a></div>
+  <div class="container">
+  <div id="ipython_notebook" class="nav navbar-brand pull-left"><a href="{{base_url}}tree/{{notebook_path}}" alt='dashboard'><img src='{{static_url("base/images/ipynblogo.png") }}' alt='IPython Notebook'/></a></div>
 
-    {% block login_widget %}
+  {% block login_widget %}
 
-      <span id="login_widget">
-        {% if logged_in %}
-          <button id="logout">Logout</button>
-        {% elif login_available and not logged_in %}
-          <button id="login">Login</button>
-        {% endif %}
-      </span>
+    <span id="login_widget">
+      {% if logged_in %}
+        <button id="logout">Logout</button>
+      {% elif login_available and not logged_in %}
+        <button id="login">Login</button>
+      {% endif %}
+    </span>
 
-    {% endblock %}
+  {% endblock %}
 
-    {% block header %}
-    {% endblock %}
-    </div>
+  {% block header %}
+  {% endblock %}
   </div>
 </div>