Bug 349634 - [client] page layout and visual styling for 0.4
diff --git a/bundles/org.eclipse.orion.client.core/web/compare/compare.html b/bundles/org.eclipse.orion.client.core/web/compare/compare.html
index 1025870..28bdac0 100644
--- a/bundles/org.eclipse.orion.client.core/web/compare/compare.html
+++ b/bundles/org.eclipse.orion.client.core/web/compare/compare.html
@@ -45,7 +45,7 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div id = "compareContainer" dojoType="dijit.layout.BorderContainer" design="headline" liveSplitters="false" persist="false" gutters="false" region="center" splitter="false">
 			</div>
diff --git a/bundles/org.eclipse.orion.client.core/web/css/ide.css b/bundles/org.eclipse.orion.client.core/web/css/ide.css
index 726c1cb..3b088f4 100644
--- a/bundles/org.eclipse.orion.client.core/web/css/ide.css
+++ b/bundles/org.eclipse.orion.client.core/web/css/ide.css
@@ -107,16 +107,18 @@
 
 .primaryNav {
 	font-size: 8pt;
-	color: #808080;
+	color: #bfbfbf;
 }
 
 .primaryNav a {
 	font-size: 8pt;
-	color: #808080;
+	color: #bfbfbf;
+	margin-right: 6px;
+	margin-left: 6px;
 }
 
 .primaryNav a:hover {
-	color: #808080;
+	color: #bfbfbf;
 	cursor: hand;
 	text-decoration: underline;
 }
@@ -300,14 +302,19 @@
 }
 
 .paneHeadingContainerFixed {
+	background-color: #f8f8f8;
+	border-bottom: 1px solid #ebebeb;
+	border-top: 1px solid #ebebeb;
 	min-width: 300px;
 }
 
 .paneHeadingContainer {
-	border-bottom: 1px dotted #bfbfbf;
-	margin: 8px;
+	background-color: #f8f8f8;
+	border-bottom: 1px solid #ebebeb;
+	border-top: 1px solid #ebebeb;
 	padding-top: 8px;
 	padding-bottom: 4px;
+	
 }
 
 .paneHeadingCommands {
@@ -359,7 +366,8 @@
 
 .auxpane {
 	border: 0;
-    background: #ededed;
+	border-top: 1px solid #d5d5d5;
+    background: #f8f8f8;
     overflow-x: auto;
     min-width: 200px;
 }
@@ -408,6 +416,7 @@
 }
 
 .mainpane {
+	border-top: 1px solid #d5d5d5;
     background: #FFFFFF;
 	overflow: auto;
 }
@@ -459,13 +468,22 @@
 }
 
 .toolbar {
-	border: 0 !important;
-	padding: 0 !important;
-	margin: 0 !important;
-	overflow: hidden; /* works around a "mystery pixels" problem in IE, see https://bugs.eclipse.org/bugs/show_bug.cgi?id=339302 */
-	cursor: pointer;
-	font-size: 0.9em;
-	min-height: 24px; 
+	vertical-align: middle;
+	min-height: 30px;
+	width: 100%;
+	color: #808080;
+}
+
+.auxToolbar {
+    background: #f8f8f8;
+ 	min-height: 30px;
+	width: 100%;
+	color: #808080;
+}
+
+.mainToolbar {
+ 	min-height: 30px;
+ 	background: #ffffff;
 }
 
 .pageTitle {
@@ -492,32 +510,38 @@
 .topRowBanner {
 	margin: 0;
 	border: 0;
-	border-bottom: 1px solid #d5d5d5;
-	background-color: #fdfdfd;
+	background-color: #2e2e2e;
 	height: 22px;
 }
 
 .titleArea {
 	margin: 0;
 	border: 0;
-	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#eeeeee'); /* IE */
-	background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#eeeeee)); 
-	background: -moz-linear-gradient(top,  #fdfdfd,  #eeeeee); 
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f7f7f7'); /* IE */
+	background: -webkit-gradient(linear, left top, left bottom, from(#fffff), to(#f7f7f7)); 
+	background: -moz-linear-gradient(top,  #fffff,  #f7f7f7); 
 	border-bottom: 1px solid #d5d5d5;
 }
 
 .paneHeading {
-	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dfdfdf'); /* IE */
-	background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#dfdfdf)); 
-	background: -moz-linear-gradient(top,  #eeeeee,  #dfdfdf); 
 	vertical-align: middle;
 	min-height: 24px;
 	width: 100%;
 	font-size: 9pt;
 	font-weight: bold;
-	color: #666666;
-	padding-left: 8px;
-	padding-right: 8px;
+	color: #808080;
+}
+
+.auxpaneHeading {
+	background-color: #fafafa;
+	border-bottom: 1px solid #ebebeb;
+	border-top: 1px solid #ebebeb;
+	vertical-align: middle;
+	min-height: 24px;
+	width: 100%;
+	font-size: 9pt;
+	font-weight: bold;
+	color: #808080;
 }
 
 .pageToolbarLeft {
@@ -535,6 +559,14 @@
 	background: transparent;
 	height: auto;
 	clear: both;
+	float: left;
+	border: 1px solid #ebebeb; 
+	border-radius: 1px;
+	visibility: hidden;
+}
+
+.slideContainerActive {
+	visibility: visible;
 }
 
 .leftSlide {
@@ -543,6 +575,7 @@
 	float: left;
 	opacity: 0;
 	height: 0;
+	display: inline-block;
  	transition: opacity .5s ease-out;
 	-o-transition: opacity .5s ease-out;
 	-moz-transition: opacity .5s ease-out;
@@ -550,7 +583,8 @@
 }
 
 .activeCommand {
-	border: 1px solid #ffd400;
+	background: #d2d2d2;
+	border: 1px solid #818181;
 	padding: 2px;
 }
 
@@ -565,6 +599,7 @@
 	float: right;
 	height: 0;
 	width: auto;
+	display: inline-block;
 	opacity: 0;
  	transition: opacity .5s ease-out;
 	-o-transition: opacity .5s ease-out;
diff --git a/bundles/org.eclipse.orion.client.core/web/edit/edit.html b/bundles/org.eclipse.orion.client.core/web/edit/edit.html
index 81a3d53..0b6ff31 100644
--- a/bundles/org.eclipse.orion.client.core/web/edit/edit.html
+++ b/bundles/org.eclipse.orion.client.core/web/edit/edit.html
@@ -46,14 +46,14 @@
 		<div id="banner" class="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="leftPane" dojoType="dijit.layout.BorderContainer" region="leading" design="headline" style="width: 20%" liveSplitters="false" gutters="false" splitter="true">
-			<div class="paneHeading" dojoType="dijit.layout.ContentPane" id="outlinerToolbar" region="top" splitter="false">
+			<div class="auxToolbar" dojoType="dijit.layout.ContentPane" id="outlinerToolbar" region="top" splitter="false">
 			</div>
 			<div id="outlineContainer" class="auxpane" dojoType="dijit.layout.ContentPane" region="center" splitter="false">
-				<div id="outline" class="auxPadding"></div>
+				<div id="outline"></div>
 			</div>
 		</div>
-		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false" gutters="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" dojoType="dijit.layout.ContentPane" splitter="false"region="center" style="overflow:hidden">
 				<div id="searchFloat" class="searchFloat">
diff --git a/bundles/org.eclipse.orion.client.core/web/images/orion-small-lightondark.gif b/bundles/org.eclipse.orion.client.core/web/images/orion-small-lightondark.gif
new file mode 100644
index 0000000..f2f5fda
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.core/web/images/orion-small-lightondark.gif
Binary files differ
diff --git a/bundles/org.eclipse.orion.client.core/web/index.html b/bundles/org.eclipse.orion.client.core/web/index.html
index 796d7d0..ba3ab64 100644
--- a/bundles/org.eclipse.orion.client.core/web/index.html
+++ b/bundles/org.eclipse.orion.client.core/web/index.html
@@ -40,8 +40,8 @@
 </head>
 	<body style="height: 100%; visibility:hidden" class="nihilo">
 	
-	<div dojoType="dijit.layout.BorderContainer" design="headline" gutters="false" style="background: #c5c5c5; width: 100%; height: 100%;">
-		<div dojoType="dijit.layout.ContentPane" id="toolbar" region="top" class="toolbar">
+	<div dojoType="dijit.layout.BorderContainer" design="headline" gutters="false" class="orionPage">
+		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div dojoType="dijit.layout.BorderContainer" design="headline" persist="false" gutters="false" region="center" splitter="false">
 			<!--<div dojoType="dijit.layout.ContentPane" id="feed" region="top" class="mainpane" style="height: 33%">
diff --git a/bundles/org.eclipse.orion.client.core/web/index.js b/bundles/org.eclipse.orion.client.core/web/index.js
index 6124838..b8b0527 100644
--- a/bundles/org.eclipse.orion.client.core/web/index.js
+++ b/bundles/org.eclipse.orion.client.core/web/index.js
@@ -28,7 +28,7 @@
 			var progressService = new mProgress.ProgressService(serviceRegistry, operationsClient);
 				
 			// global commands
-			mGlobalCommands.generateBanner("toolbar", serviceRegistry, commandService, preferences, searcher);
+			mGlobalCommands.generateBanner("banner", serviceRegistry, commandService, preferences, searcher);
 			
 			// Populate recent projects
 			serviceRegistry.getService("orion.core.preference").getPreferences("/window/recent").then(function(prefs){
diff --git a/bundles/org.eclipse.orion.client.core/web/navigate/table.html b/bundles/org.eclipse.orion.client.core/web/navigate/table.html
index 75b4813..e32b9f0 100644
--- a/bundles/org.eclipse.orion.client.core/web/navigate/table.html
+++ b/bundles/org.eclipse.orion.client.core/web/navigate/table.html
@@ -48,14 +48,14 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="leftPane" dojoType="dijit.layout.BorderContainer" region="leading" design="headline" style="width: 20%;" liveSplitters="false" gutters="false" splitter="true">
-			<div class="paneHeading" dojoType="dijit.layout.ContentPane" id="outlinerToolbar" region="top" splitter="false">
+			<div class="auxToolbar" dojoType="dijit.layout.ContentPane" id="outlinerToolbar" region="top" splitter="false">
 			</div>
 			<div id="favorites" class="auxpane" dojoType="dijit.layout.ContentPane" region="center" splitter="false">
-				<div id="favoriteProgress" class="auxPadding"></div>
+				<div id="favoriteProgress"></div>
 			</div>
 		</div>
-		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false" gutters="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="explorer-tree" dojoType="dijit.layout.ContentPane" splitter="false"region="center">
 				<!-- Breadcrumbs, tree content go here -->
diff --git a/bundles/org.eclipse.orion.client.core/web/operations/list.html b/bundles/org.eclipse.orion.client.core/web/operations/list.html
index 282fb42..978c039 100644
--- a/bundles/org.eclipse.orion.client.core/web/operations/list.html
+++ b/bundles/org.eclipse.orion.client.core/web/operations/list.html
@@ -41,8 +41,8 @@
 	<div id="orion.pluginsList" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">		
 				<div class="mainPadding" id="tasks-lisk">Loading&#8230;</div>	
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/globalCommands.js b/bundles/org.eclipse.orion.client.core/web/orion/globalCommands.js
index 5f77fe0..b3dda44 100644
--- a/bundles/org.eclipse.orion.client.core/web/orion/globalCommands.js
+++ b/bundles/org.eclipse.orion.client.core/web/orion/globalCommands.js
@@ -25,8 +25,10 @@
 	 * @name orion.globalCommands.CommandParameterCollector
 	 */	
 	function CommandParameterCollector (toolbar) {
-		// get  node's parent.  If it is managed by dijit, we will need to layout
-		this.layoutWidgetId = toolbar.parentNode.id;
+		// get node's parent.  If it is managed by dijit, we will need to layout
+		if (toolbar) {
+			this.layoutWidgetId = toolbar.parentNode.id;
+		}
 	}
 	CommandParameterCollector.prototype =  {
 	
@@ -41,6 +43,7 @@
 			}
 			if (this.parameterContainer) {
 				dojo.removeClass(this.parameterContainer, this.activeClass);
+				dojo.removeClass(this.parameterContainer.parentNode, "slideContainerActive");
 			}
 			if (this.dismissArea) {
 				 dojo.empty(this.dismissArea);
@@ -106,6 +109,7 @@
 
 
 				// all parameters have been generated.  Activate the area.
+				dojo.addClass(this.parameterContainer.parentNode, "slideContainerActive");
 				dojo.addClass(this.parameterContainer, this.activeClass);
 				mUtil.forceLayout(this.parameterContainer);
 				if (focusNode) {
@@ -249,10 +253,10 @@
 	var topHTMLFragment =
 	//Top row:  Logo + discovery links + user
 	'<div id="staticBanner" class="layoutBlock topRowBanner">' +
-		'<a id="home" class="layoutLeft primaryNav" href="' + require.toUrl("index.html") + '"><img src="' + require.toUrl("images/orion-small.gif") + '" alt="Orion Logo"/></a>' +
+		'<a id="home" class="layoutLeft primaryNav" href="' + require.toUrl("index.html") + '"><img src="' + require.toUrl("images/orion-small-lightondark.gif") + '" alt="Orion Logo"/></a>' +
 		'<div id="primaryNav" class="layoutLeft primaryNav"></div>' +
 		'<div id="globalActions" class="layoutLeft primaryNav"></div>' +
-		'<div id="help" class="layoutRight help"><a id="help" href="' + require.toUrl("help/index.jsp") + '"><img src="' + require.toUrl("images/help_banner.gif") + '" alt="Help"/></a></div>'+
+		'<div id="help" class="layoutRight help"><a id="help" href="' + require.toUrl("help/index.jsp") + '"><img src="' + require.toUrl("images/help.gif") + '" alt="Help"/></a></div>'+
 		'<div id="userInfo" class="layoutRight primaryNav"></div>' +
 		'<div class="layoutRight primaryNav">|</div>' +
 	'</div>' +
@@ -464,8 +468,7 @@
 		if (toolbar) {
 			dojo.place(toolbarFragment, toolbar, "only");
 		} else {
-			toolbar = dojo.create ("div", {id: "pageToolbar", "class": "paneHeading layoutBlock"}, "titleArea", "after");
-			dojo.place(toolbarFragment, toolbar, "only");
+			window.console.log("No toolbar requested");
 		}
 		
 		// Set up a custom parameter collector that slides out of the toolbar.
@@ -496,7 +499,6 @@
 				}
 				if (info.href && info.name) {
 					var link = dojo.create("a", {href: info.href}, primaryNav, "last");
-					dojo.addClass(link, "commandLink");
 					text = document.createTextNode(info.name);
 					dojo.place(text, link, "only");
 				}
diff --git a/bundles/org.eclipse.orion.client.core/web/plugin/list.html b/bundles/org.eclipse.orion.client.core/web/plugin/list.html
index 2fa20a0..389fb71 100644
--- a/bundles/org.eclipse.orion.client.core/web/plugin/list.html
+++ b/bundles/org.eclipse.orion.client.core/web/plugin/list.html
@@ -40,8 +40,8 @@
 	<div id="orion.pluginsList" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">		
 				<div class="mainPadding" id="registry-tree">Loading&#8230;</div>	
diff --git a/bundles/org.eclipse.orion.client.core/web/search/search.html b/bundles/org.eclipse.orion.client.core/web/search/search.html
index 6241890..df3d5bc 100644
--- a/bundles/org.eclipse.orion.client.core/web/search/search.html
+++ b/bundles/org.eclipse.orion.client.core/web/search/search.html
@@ -46,14 +46,14 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="leftPane" dojoType="dijit.layout.BorderContainer" region="leading" design="headline" style="width: 20%" liveSplitters="false" gutters="false" splitter="true">
-			<div class="paneHeading" dojoType="dijit.layout.ContentPane" id="outlinerToolbar" region="top" splitter="false">
+			<div class="auxToolbar" dojoType="dijit.layout.ContentPane" id="outlinerToolbar" region="top" splitter="false">
 			</div>
 			<div id="favorites" class="auxpane" dojoType="dijit.layout.ContentPane" region="center" splitter="false">
 				<div id="favoriteProgress" class="auxPadding"></div>
 			</div>
 		</div>
-		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false" gutters="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="results" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
 			</div>
diff --git a/bundles/org.eclipse.orion.client.core/web/settings/settings.html b/bundles/org.eclipse.orion.client.core/web/settings/settings.html
index 96a38f8..5e3781c 100644
--- a/bundles/org.eclipse.orion.client.core/web/settings/settings.html
+++ b/bundles/org.eclipse.orion.client.core/web/settings/settings.html
@@ -35,7 +35,7 @@
 			<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">

 			</div>

 			<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" gutters="false" design="headline" liveSplitters="false" splitter="false">

-				<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">

+				<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">

 				</div>

 				<div class="auxpane" id="categories" dojoType="dijit.layout.ContentPane" splitter="false" region="leading" style="width: 150px">

 					<div id="categoryNode">

diff --git a/bundles/org.eclipse.orion.client.core/web/sites/site.html b/bundles/org.eclipse.orion.client.core/web/sites/site.html
index 467c549..74434dc 100644
--- a/bundles/org.eclipse.orion.client.core/web/sites/site.html
+++ b/bundles/org.eclipse.orion.client.core/web/sites/site.html
@@ -41,7 +41,7 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" gutters="false" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="site" dojoType="dijit.layout.ContentPane" splitter="false"region="center">
 			</div>
diff --git a/bundles/org.eclipse.orion.client.core/web/sites/sites.html b/bundles/org.eclipse.orion.client.core/web/sites/sites.html
index 754ec7d..872a994 100644
--- a/bundles/org.eclipse.orion.client.core/web/sites/sites.html
+++ b/bundles/org.eclipse.orion.client.core/web/sites/sites.html
@@ -42,7 +42,7 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="centerPane" dojoType="dijit.layout.BorderContainer" gutters="false" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="site-table" dojoType="dijit.layout.ContentPane" splitter="false"region="center">
 			</div>
diff --git a/bundles/org.eclipse.orion.client.core/web/test/unittest.html b/bundles/org.eclipse.orion.client.core/web/test/unittest.html
index 8f9d9c8..a0a1983 100644
--- a/bundles/org.eclipse.orion.client.core/web/test/unittest.html
+++ b/bundles/org.eclipse.orion.client.core/web/test/unittest.html
@@ -46,8 +46,8 @@
     <div id="eclipse.unittest" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false" liveSplitters="true">
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
-		<div dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false" gutters="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="rightPane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">
 				<div id="test-overview">
diff --git a/bundles/org.eclipse.orion.client.git/web/git/git-clone.html b/bundles/org.eclipse.orion.client.git/web/git/git-clone.html
index 63b1a5f..55bd623 100644
--- a/bundles/org.eclipse.orion.client.git/web/git/git-clone.html
+++ b/bundles/org.eclipse.orion.client.git/web/git/git-clone.html
@@ -45,7 +45,7 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="trailing" design="headline" style="width: 20%" liveSplitters="false" gutters="false" splitter="true">
-			<div class="paneHeading" dojoType="dijit.layout.ContentPane" id="commitDetailsToolbar" region="top" splitter="false">
+			<div class="auxToolbar" dojoType="dijit.layout.ContentPane" id="commitDetailsToolbar" region="top" splitter="false">
 			</div>
 			<div id="detailsPane" class="auxpane" dojoType="dijit.layout.ContentPane" region="center" splitter="false">
 				<div id="cloneDetails" class="auxPadding">
@@ -53,8 +53,8 @@
 				</div>
 			</div>
 		</div>
-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false" gutters="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainPane" id="explorer-tree" dojoType="dijit.layout.ContentPane" splitter="false" region="center">
 				<div id="clonesList" style="min-width: 500px">
diff --git a/bundles/org.eclipse.orion.client.git/web/git/git-commit.html b/bundles/org.eclipse.orion.client.git/web/git/git-commit.html
index d6403a3..5fb80e5 100644
--- a/bundles/org.eclipse.orion.client.git/web/git/git-commit.html
+++ b/bundles/org.eclipse.orion.client.git/web/git/git-commit.html
@@ -43,8 +43,8 @@
 	<div id="orion.git-commit" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">

 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">

 		</div>

-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">

-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">

+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">

+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">

 			</div>

 			<div class="mainpane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">		

 				<div id="mainNode" class="settings mainPadding">

diff --git a/bundles/org.eclipse.orion.client.git/web/git/git-log.html b/bundles/org.eclipse.orion.client.git/web/git/git-log.html
index 7aa20d5..38b1ad5 100644
--- a/bundles/org.eclipse.orion.client.git/web/git/git-log.html
+++ b/bundles/org.eclipse.orion.client.git/web/git/git-log.html
@@ -44,8 +44,8 @@
  	<div id="orion.gitlog" class="orionPage" dojoType="orion.widgets.eWebBorderContainerReverse" design="headline" liveSplitters="true" persist="true" gutters="false">
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="explorer-tree" dojoType="dijit.layout.ContentPane" splitter="false"region="center">
 				<!-- commit navigator goes here -->
diff --git a/bundles/org.eclipse.orion.client.git/web/git/git-repository.html b/bundles/org.eclipse.orion.client.git/web/git/git-repository.html
index 529c342..390c6c3 100644
--- a/bundles/org.eclipse.orion.client.git/web/git/git-repository.html
+++ b/bundles/org.eclipse.orion.client.git/web/git/git-repository.html
@@ -47,8 +47,8 @@
 	<div id="orion.repository" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">

 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">

 		</div>

-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">

-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">

+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">

+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">

 			</div>

 			<div class="mainpane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">		

 				<div id="mainNode" class="settings mainPadding">

diff --git a/bundles/org.eclipse.orion.client.git/web/git/git-status.html b/bundles/org.eclipse.orion.client.git/web/git/git-status.html
index 1787ffd..1b427af 100644
--- a/bundles/org.eclipse.orion.client.git/web/git/git-status.html
+++ b/bundles/org.eclipse.orion.client.git/web/git/git-status.html
@@ -44,15 +44,15 @@
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
 		<div id="leftPane" dojoType="dijit.layout.BorderContainer" region="leading" design="headline" style="width: 40%" liveSplitters="false" gutters="false" splitter="true">
-			<div id="pageToolbar" class="paneHeading" dojoType="dijit.layout.ContentPane" region="top" splitter="false">
+			<div id="pageToolbar" class="auxToolbar" dojoType="dijit.layout.ContentPane" region="top" splitter="false">
 			</div>
 			<div id="gitStatusPane" class="auxpane" dojoType="dijit.layout.ContentPane" region="center" splitter="false">				
 				<div id = "statusZone" class="auxPadding"></div>
 				<div id = "logZone" class="auxPadding" style="display:none;"></div>
 			</div>
 		</div>
-		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="compareToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="rightPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false" gutters="false">
+			<div class="toolbar" id="compareToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div id="viewerZone" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" persist="false" gutters="false" region="center"  splitter="false">
 			</div>
diff --git a/bundles/org.eclipse.orion.client.users.ui/web/profile/user-list.html b/bundles/org.eclipse.orion.client.users.ui/web/profile/user-list.html
index 3da4eb0..0c39c74 100644
--- a/bundles/org.eclipse.orion.client.users.ui/web/profile/user-list.html
+++ b/bundles/org.eclipse.orion.client.users.ui/web/profile/user-list.html
@@ -44,8 +44,8 @@
 	<div id="orion.profile" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" gutters="false" splitter="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" id="usersPane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">	
 				<div>
diff --git a/bundles/org.eclipse.orion.client.users.ui/web/profile/user-profile.html b/bundles/org.eclipse.orion.client.users.ui/web/profile/user-profile.html
index f82872e..dd99ce0 100644
--- a/bundles/org.eclipse.orion.client.users.ui/web/profile/user-profile.html
+++ b/bundles/org.eclipse.orion.client.users.ui/web/profile/user-profile.html
@@ -43,8 +43,8 @@
 	<div id="orion.profile" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">
 		<div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
 		</div>
-		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" liveSplitters="false" splitter="false">
-			<div class="paneHeading" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
+		<div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" design="headline" gutters="false" liveSplitters="false" splitter="false">
+			<div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
 			</div>
 			<div class="mainpane" dojoType="dijit.layout.ContentPane" splitter="false"region="center">	
 				<table><tr>