Merge commit 'dda45b771f9ab279b991d9e502b0c0359980b7a2'
diff --git a/bundles/org.eclipse.orion.client.core/web/css/commands.css b/bundles/org.eclipse.orion.client.core/web/css/commands.css
index 6eccde8..174e812 100644
--- a/bundles/org.eclipse.orion.client.core/web/css/commands.css
+++ b/bundles/org.eclipse.orion.client.core/web/css/commands.css
@@ -230,16 +230,6 @@
 	vertical-align: middle; 
 }
 
-.claro .textless .dijitArrowButtonInner {
-	background-position: 0 -1551px;	
-	width: 16px; height: 16px; 
-	background-image: url(../images/core_sprites.png);
-	display: inline-block; 
-	vertical-align: middle; 
-	margin-left: 2px;
-	margin-right: 2px;
-}
-
 /* menus and menu items */
 
 .claro .dijitMenu {
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 d9cfb9b..9460c15 100644
--- a/bundles/org.eclipse.orion.client.core/web/css/ide.css
+++ b/bundles/org.eclipse.orion.client.core/web/css/ide.css
@@ -343,16 +343,6 @@
     min-width: 300px;
 }
 
-.paneHeadingToolbar {
-	text-align: right;
-	vertical-align: middle;
-	margin-left: 16px;
-}
-
-.paneHeadingCommands {
-	text-align: right;
-}
-
 .userEditBoxPrompt {
 	background: white;
 	color: black;
@@ -567,44 +557,6 @@
     border-bottom: 1px solid #EEE;
 }
 
-.paneTitle {
-	margin-top: 2px;
-	padding-top: 4px;
-	padding-left: 4px;
-	vertical-align: baseline;
-	display: inline-block;
-}
-
-.paneHeading {
-	background-color: #f8f8f8;
-	vertical-align: middle;
-	border-bottom: 1px solid #ebebeb;
-	border-top: 1px solid #ebebeb;
-	min-height: 26px;
-	width: 100%;
-	font-size: 10pt;
-	font-weight: bold;
-	color: #808080;
-}
-
-.paneHeadingFixed {
-	min-width: 300px;
-}
-
-/* deprecated.  Will be removed in favor of sectionWrapper styles in sections.css */
-.auxpaneHeading {
-	margin-top: 8px;
-	margin-right: 8px;
-	min-height: 26px;
-	vertical-align: middle;
-	font-weight: bold;
-	color: #808080;
-	background-color: #fafafa;
-	padding:1px;
-	border-radius:4px;
-	border: 1px solid #ebebeb;
-}
-
 .slideContainer {
 	height: auto;
 	width: 97%;
diff --git a/bundles/org.eclipse.orion.client.core/web/edit/edit.css b/bundles/org.eclipse.orion.client.core/web/edit/edit.css
index 7423c9e..e9d1fd5 100644
--- a/bundles/org.eclipse.orion.client.core/web/edit/edit.css
+++ b/bundles/org.eclipse.orion.client.core/web/edit/edit.css
@@ -16,4 +16,6 @@
 
 @import "../css/commands.css";
 
+@import "../css/sections.css";
+
 @import "../orion/editor/editor.css";
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/outliner.js b/bundles/org.eclipse.orion.client.core/web/orion/outliner.js
index 8ce5bac..4b27b8c 100644
--- a/bundles/org.eclipse.orion.client.core/web/orion/outliner.js
+++ b/bundles/org.eclipse.orion.client.core/web/orion/outliner.js
@@ -10,7 +10,7 @@
  ******************************************************************************/
  /*global define document window*/
 
-define(['dojo', 'orion/util', 'orion/commands', 'orion/URITemplate'], function(dojo, mUtil, mCommands, URITemplate) {
+define(['dojo', 'orion/util', 'orion/section', 'orion/commands', 'orion/URITemplate'], function(dojo, mUtil, mSection, mCommands, URITemplate) {
 
 	/**
 	 * Constructs a new Outliner with the given options.
@@ -78,6 +78,10 @@
 			this._renderHeadingAndMenu(this.outlineProviders);
 		},
 		_renderOutline: function(outlineModel, title) {
+			var contentParent = dojo.byId("outlineSectionContent");
+			if (!contentParent) {
+				this._renderHeadingAndMenu();
+			}
 			outlineModel = outlineModel instanceof Array ? outlineModel : [outlineModel];
 			if (outlineModel) {
 				if (this.outlineNode) {
@@ -88,7 +92,7 @@
 				for (var i=0; i < outlineModel.length; i++) {
 					this._renderElement(this.outlineNode, outlineModel[i], title);
 				}
-				dojo.place(this.outlineNode, this._parent, "last");
+				dojo.place(this.outlineNode, "outlineSectionContent", "last");
 			}
 		},
 		_menuCallback: function() {
@@ -104,13 +108,19 @@
 			return choices;
 		},
 		_renderHeadingAndMenu: function(/**ServiceReference*/ outlineProviders) {
-			if (dojo.byId("outlinerHeading")) {
-				dojo.destroy("outlinerHeading");
+			if (!this.outlineSection) {
+				this.outlineSection = new mSection.Section(this._parent, {
+					id: "outlinerHeading",
+					title: "Outliner",
+					content: '<div id="outlineSectionContent"></div>',
+					useAuxStyle: true
+				});
+				this._commandService.registerCommandContribution(this.outlineSection.selectionNode.id, "eclipse.edit.outline.switch", 1);
 			}
+			dojo.empty(this.outlineSection.selectionNode.id);
 			if (outlineProviders.length > 1) {
-				this._commandService.registerCommandContribution("outlineCommands", "eclipse.edit.outline.switch", 1);
+				this._commandService.renderCommands(this.outlineSection.selectionNode.id, this.outlineSection.selectionNode.id, {}, this, "button");
 			}
-			mUtil.createPaneHeading(this._parent, "outlinerHeading", "Outliner", true, null, "outlineCommands", this._commandService, this);
 		},
 		_renderElement: function(/**DOMNode*/ parentNode, /**Object*/ element, title) {
 			if (!element) {
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/util.js b/bundles/org.eclipse.orion.client.core/web/orion/util.js
index f9eba53..713ee36 100644
--- a/bundles/org.eclipse.orion.client.core/web/orion/util.js
+++ b/bundles/org.eclipse.orion.client.core/web/orion/util.js
@@ -305,46 +305,6 @@
 	}
 	
 	/**
-	 * Create a stylized pane heading.
-	 * @param {DomNode} parent the parent node of the title element
-	 * @param {String} the string to use as the heading id. It will also be used to prefix any generated id's.
-	 * @param {String} headingLabel the pane heading text
-	 * @param {Boolean} isAuxStyle specifies whether heading is in an auxiliary pane or main pane
-	 * @param {String} headingId the id for the heading label.  Optional
-	 * @param {String} commandId the id for command tools.  Optional
-	 * @param {Object} command service for rendering commands.  Optional, no commands are rendered if not specified.
-	 * @param {Object} the handler for commands.  Optional.  
-	 * @param {Object} the item for command rendering.  Optional.
-	 */
-	function createPaneHeading(parent, id, headingLabel, isAuxStyle, headingId, commandId, commandService, handler, item) {
-		headingId = headingId || id+"heading";
-		commandId = commandId || id+"commands";
-		var paneHeadingFragment = 
-			'<div class="toolComposite" id="' + id + '">' +
-				'<div class="layoutLeft" id="' + id + '"><span class="paneTitle" id="' + headingId + '">' + headingLabel + '</span></div>' +
-				'<ul class="layoutRight commandList sectionActions" id="' + commandId + '"></ul>' +
-				'<div id="' + parent.id + 'slideContainer" class="layoutBlock slideParameters slideContainer">' +
-					'<span id="' + parent.id + 'slideOut" class="slide">' +
-						'<span id="' + parent.id + 'pageCommandParameters" class="parameters"></span>' +
-						'<span id="' + parent.id + 'pageCommandDismiss" class="parametersDismiss"></span>' +
-					'</span>' +
-				'</div>'+
-			'</div>';
-			
-		dojo.place(paneHeadingFragment, parent, "last");
-		if (isAuxStyle) {
-			dojo.addClass(id, "auxpaneHeading");
-		} else {
-			dojo.addClass(id, "paneHeading");
-		}
-		
-		if (commandService) {
-			commandService.renderCommands(commandId, dojo.byId(commandId), item || handler, handler, "button");
-		}
-		return dojo.byId(id);
-	}
-	
-	/**
 	 * Force a layout in the parent tree of the specified node, if there are layout managers assigned.
 	 *
 	 * @param {DomNode} node the node triggering new layout.
@@ -456,7 +416,6 @@
 		getText: getText,
 		safeText: safeText,
 		setText: setText,
-		createPaneHeading: createPaneHeading,
 		forceLayout: forceLayout,
 		saveFileContents: saveFileContents,
 		splitFile: splitFile
diff --git a/bundles/org.eclipse.orion.client.git/web/git/git-status.css b/bundles/org.eclipse.orion.client.git/web/git/git-status.css
index 275fad2..43a2029 100644
--- a/bundles/org.eclipse.orion.client.git/web/git/git-status.css
+++ b/bundles/org.eclipse.orion.client.git/web/git/git-status.css
@@ -18,4 +18,48 @@
 
 @import "css/status.css";
 
-@import "../orion/compare/compare-container.css";
\ No newline at end of file
+@import "../orion/compare/compare-container.css";
+
+/* deprecated.  */
+.auxpaneHeading {
+	margin-top: 8px;
+	margin-right: 8px;
+	min-height: 26px;
+	vertical-align: middle;
+	font-weight: bold;
+	color: #808080;
+	background-color: #fafafa;
+	padding:1px;
+	border-radius:4px;
+	border: 1px solid #ebebeb;
+}
+
+.paneHeadingCommands {
+	text-align: right;
+}
+
+.paneHeading {
+	background-color: #f8f8f8;
+	vertical-align: middle;
+	border-bottom: 1px solid #ebebeb;
+	border-top: 1px solid #ebebeb;
+	min-height: 26px;
+	width: 100%;
+	font-size: 10pt;
+	font-weight: bold;
+	color: #808080;
+}
+
+.paneHeadingFixed {
+	min-width: 300px;
+}
+
+.paneTitle {
+	margin-top: 2px;
+	padding-top: 4px;
+	padding-left: 4px;
+	vertical-align: baseline;
+	display: inline-block;
+}
+
+
diff --git a/bundles/org.eclipse.orion.client.git/web/orion/git/git-status-table.js b/bundles/org.eclipse.orion.client.git/web/orion/git/git-status-table.js
index 1beccbf..8aaccd8 100644
--- a/bundles/org.eclipse.orion.client.git/web/orion/git/git-status-table.js
+++ b/bundles/org.eclipse.orion.client.git/web/orion/git/git-status-table.js
@@ -11,10 +11,51 @@
 
 /*global define dojo dijit document console */
 
-define(['require', 'dojo',  'orion/compare/compare-container', 'orion/commands', 'orion/globalCommands', 'orion/git/git-commit-navigator', 'orion/git/gitCommands', 'orion/util', 'orion/breadcrumbs', 'dijit/layout/ContentPane'], function(
-		require, dojo,  mCompareContainer, mCommands, mGlobalCommands, mGitCommitNavigator, mGitCommands, mUtil, mBreadcrumbs) {
+define(['require', 'dojo',  'orion/compare/compare-container', 'orion/commands', 'orion/globalCommands', 'orion/git/git-commit-navigator', 'orion/git/gitCommands', 'orion/breadcrumbs', 'orion/util', 'dijit/layout/ContentPane'], function(
+		require, dojo,  mCompareContainer, mCommands, mGlobalCommands, mGitCommitNavigator, mGitCommands, mBreadcrumbs, mUtil) {
 
 	var orion = orion || {};
+	
+		
+/**
+ * Create a stylized pane heading.
+ * @param {DomNode} parent the parent node of the title element
+ * @param {String} the string to use as the heading id. It will also be used to prefix any generated id's.
+ * @param {String} headingLabel the pane heading text
+ * @param {Boolean} isAuxStyle specifies whether heading is in an auxiliary pane or main pane
+ * @param {String} headingId the id for the heading label.  Optional
+ * @param {String} commandId the id for command tools.  Optional
+ * @param {Object} command service for rendering commands.  Optional, no commands are rendered if not specified.
+ * @param {Object} the handler for commands.  Optional.  
+ * @param {Object} the item for command rendering.  Optional.
+ */
+function createPaneHeading(parent, id, headingLabel, isAuxStyle, headingId, commandId, commandService, handler, item) {
+	headingId = headingId || id+"heading";
+	commandId = commandId || id+"commands";
+	var paneHeadingFragment = 
+		'<div class="toolComposite" id="' + id + '">' +
+			'<div class="layoutLeft" id="' + id + '"><span class="paneTitle" id="' + headingId + '">' + headingLabel + '</span></div>' +
+			'<ul class="layoutRight commandList sectionActions" id="' + commandId + '"></ul>' +
+			'<div id="' + parent.id + 'slideContainer" class="layoutBlock slideParameters slideContainer">' +
+				'<span id="' + parent.id + 'slideOut" class="slide">' +
+					'<span id="' + parent.id + 'pageCommandParameters" class="parameters"></span>' +
+					'<span id="' + parent.id + 'pageCommandDismiss" class="parametersDismiss"></span>' +
+				'</span>' +
+			'</div>'+
+		'</div>';
+		
+	dojo.place(paneHeadingFragment, parent, "last");
+	if (isAuxStyle) {
+		dojo.addClass(id, "auxpaneHeading");
+	} else {
+		dojo.addClass(id, "paneHeading");
+	}
+	
+	if (commandService) {
+		commandService.renderCommands(commandId, dojo.byId(commandId), item || handler, handler, "button");
+	}
+	return dojo.byId(id);
+}
 
 orion.GitStatusModel = (function() {
 	function GitStatusModel() {
@@ -125,7 +166,7 @@
 	}
 	GitStatusContentRenderer.prototype = {
 		initTable: function () {
-			tableId = this._tableParentDivId + "_table";
+			var tableId = this._tableParentDivId + "_table";
 		  	var tableParentDomNode = dojo.byId( this._tableParentDivId);
 			dojo.place(document.createTextNode(""), tableParentDomNode, "only");
 			var table = dojo.create("table", {id: tableId});
@@ -266,7 +307,7 @@
 	}
 	GitStatusTableRenderer.prototype = {
 		render: function (renderSeparator) {
-			var headingSection = mUtil.createPaneHeading(this._parentId, this._type + "heading", this._header, true, this._type + "_header", this._type + "commands");
+			var headingSection = createPaneHeading(this._parentId, this._type + "heading", this._header, true, this._type + "_header", this._type + "commands");
 			dojo.addClass(headingSection, "paneHeadingFixed");
 			var check = dojo.create("input", {type: "checkbox"}, this._type+"_header", "after");
 			dojo.addClass(check, "statusCheckBoxOverall");
@@ -510,7 +551,7 @@
 	GitLogTableRenderer.prototype = {
 		render: function (renderSeparator) {
 			var section = dojo.create("section", {id: this._sectionId, role: "region", "aria-labelledby": this._type + "_header"}, this._parentId);
-			var headingSection = mUtil.createPaneHeading(section, this._type + "heading", this._header, true, this._type + "_header", this._type + "commands");
+			var headingSection = createPaneHeading(section, this._type + "heading", this._header, true, this._type + "_header", this._type + "commands");
 			dojo.addClass(headingSection, "paneHeadingFixed");
 			var idAdditional = this._type+"commandSpanAdditional";
 			this._cmdSpanAdditional = dojo.create("span", {"id": idAdditional}, this._type + "commands", "last");
@@ -585,7 +626,7 @@
 			parent.addChild(titleDiv);
 			parent.addChild(viewerDiv);
 			if (createCommandSpan) {
-				td = document.createElement('td');
+				var td = document.createElement('td');
 				td.id = "inlineCompareCommands"; // this id should not be known here.  It is decided in compare-container.js
 				row.appendChild(td);
 				td.noWrap = true;
diff --git a/bundles/org.eclipse.orion.client.users/web/orion/profile/profile.js b/bundles/org.eclipse.orion.client.users/web/orion/profile/profile.js
index a32637c..2cd4e61 100644
--- a/bundles/org.eclipse.orion.client.users/web/orion/profile/profile.js
+++ b/bundles/org.eclipse.orion.client.users/web/orion/profile/profile.js
@@ -271,7 +271,7 @@
 				if(dijit.byId(content.sections[i].id))
 					dijit.byId(content.sections[i].id).destroy();
 
-				var titleWrapper = dojo.create( "div", {"class":"auxpaneHeading sectionWrapper toolComposite", "id": content.sections[i].id + "_SectionHeader"}, placeholder );
+				var titleWrapper = dojo.create( "div", {"class":"sectionWrapper toolComposite", "id": content.sections[i].id + "_SectionHeader"}, placeholder );
 				
 				dojo.create( "div", { id: content.sections[i].id + "_SectionTitle", "class":"layoutLeft", innerHTML: content.sections[i].name }, titleWrapper );