diff --git a/src/Umbraco.Web.UI.Client/public/mockServiceWorker.js b/src/Umbraco.Web.UI.Client/public/mockServiceWorker.js
index 4ed73191bd..70f0a2b994 100644
--- a/src/Umbraco.Web.UI.Client/public/mockServiceWorker.js
+++ b/src/Umbraco.Web.UI.Client/public/mockServiceWorker.js
@@ -2,7 +2,7 @@
 /* tslint:disable */
 
 /**
- * Mock Service Worker (0.49.1).
+ * Mock Service Worker (0.49.2).
  * @see https://github.com/mswjs/msw
  * - Please do NOT modify this file.
  * - Please do NOT serve this file on production.
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/components/body-layout/body-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/components/body-layout/body-layout.element.ts
index 32d31aee54..b15ac3fa35 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/components/body-layout/body-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/components/body-layout/body-layout.element.ts
@@ -1,6 +1,6 @@
-import { css, html, LitElement } from 'lit';
+import { css, html, LitElement, nothing } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
-import { customElement } from 'lit/decorators.js';
+import { customElement, property } from 'lit/decorators.js';
 
 @customElement('umb-body-layout')
 export class UmbBodyLayout extends LitElement {
@@ -16,15 +16,27 @@ export class UmbBodyLayout extends LitElement {
 			}
 
 			#header {
-				background-color: var(--uui-color-surface);
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
 				width: 100%;
+				min-height: 60px;
+
+				background-color: var(--uui-color-surface);
 				border-bottom: 1px solid var(--uui-color-border);
 				box-sizing: border-box;
-				/* padding: 0 var(--uui-size-6); */
+			}
+
+			#headline {
+				display: block;
+				margin: 0 var(--uui-size-layout-1);
+			}
+
+			#tabs {
+				margin-left: auto;
 			}
 
 			#main {
-				/* padding: 0 var(--uui-size-6); */
 				display: flex;
 				flex: 1;
 				flex-direction: column;
@@ -33,27 +45,63 @@ export class UmbBodyLayout extends LitElement {
 			#footer {
 				display: flex;
 				align-items: center;
-				height: 70px;
+				justify-content: space-between;
 				width: 100%;
-				/*padding: 0 var(--uui-size-6);*/
+				height: 54px; /* TODO: missing var(--uui-size-18);*/
 				border-top: 1px solid var(--uui-color-border);
 				background-color: var(--uui-color-surface);
 				box-sizing: border-box;
 			}
+
+			#actions {
+				display: flex;
+				gap: 6px;
+				margin: 0 var(--uui-size-layout-1);
+				margin-left: auto;
+			}
 		`,
 	];
 
+	connectedCallback() {
+		super.connectedCallback();
+		this.shadowRoot?.removeEventListener('slotchange', this._slotChanged);
+		this.shadowRoot?.addEventListener('slotchange', this._slotChanged);
+	}
+
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.shadowRoot?.removeEventListener('slotchange', this._slotChanged);
+	}
+
+	private _slotChanged = (e: Event) => {
+		(e.target as any).style.display =
+			(e.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0 ? '' : 'none';
+	};
+
+	/**
+	 * Renders a headline in the header.
+	 * @public
+	 * @type {string}
+	 * @attr
+	 * @default ''
+	 */
+	@property()
+	public headline = '';
+
 	render() {
 		return html`
 			<div id="header">
+				${this.headline ? html`<h3 id="headline">${this.headline}</h3>` : nothing}
+
 				<slot name="header"></slot>
+				<slot id="tabs" name="tabs"></slot>
 			</div>
 			<uui-scroll-container id="main">
 				<slot></slot>
 			</uui-scroll-container>
 			<div id="footer">
-				<!-- only show footer if slot has elements -->
 				<slot name="footer"></slot>
+				<slot id="actions" name="actions"></slot>
 			</div>
 		`;
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-content/editor-content.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-content/editor-content.element.ts
index 34c3ca3fa1..0041e9046a 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-content/editor-content.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-content/editor-content.element.ts
@@ -61,7 +61,6 @@ export class UmbEditorContentElement extends UmbContextProviderMixin(
 
 			#footer {
 				margin: 0 var(--uui-size-layout-1);
-				flex:1 1 auto;
 			}
 		`,
 	];
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts
index 6b4f567f1b..7ff23cf616 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts
@@ -37,36 +37,6 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(UmbObserverMi
 				height: 100%;
 			}
 
-			#header {
-				display: flex;
-				align-items: center;
-				min-height: 60px;
-			}
-
-			#headline {
-				display: block;
-				flex: 1 1 auto;
-				margin: 0 var(--uui-size-layout-1);
-			}
-
-			#tabs {
-				margin-left: auto;
-			}
-
-			#footer {
-				display: flex;
-				height: 100%;
-				align-items: center;
-				flex: 1 1 auto;
-			}
-
-			#actions {
-				display: flex;
-				margin-left: auto;
-				gap: 6px;
-				margin: 0 var(--uui-size-layout-1);
-			}
-
 			uui-input {
 				width: 100%;
 			}
@@ -162,7 +132,7 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(UmbObserverMi
 		return html`
 			${this._editorViews?.length > 0
 				? html`
-						<uui-tab-group id="tabs">
+						<uui-tab-group slot="tabs">
 							${this._editorViews.map(
 								(view: ManifestEditorView) => html`
 									<uui-tab
@@ -182,26 +152,18 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(UmbObserverMi
 
 	render() {
 		return html`
-			<umb-body-layout>
-				<div id="header" slot="header">
+			<umb-body-layout .headline=${this.headline}>
 
-					${this.headline ? html`<h3 id="headline">${this.headline}</h3>` : nothing}
-
-					<slot name="header"></slot>
-
-					${this._renderTabs()}
-				</div>
+				<slot name="header" slot="header"></slot>
+				${this._renderTabs()}
 
 				<router-slot .routes="${this._routes}"></router-slot>
 				<slot></slot>
 
-				<div id="footer" slot="footer">
-					<slot name="footer"></slot>
-					<div id="actions">
-						<umb-extension-slot type="editorAction" .filter=${(extension: any) => extension.meta.editors.includes(this.alias)}></umb-extension-slot>
-						<slot name="actions"></slot>
-					</div>
-				</div>
+				<slot name="footer" slot="footer"></slot>
+				<umb-extension-slot slot="actions" type="editorAction" .filter=${(extension: any) => extension.meta.editors.includes(this.alias)}></umb-extension-slot>
+				<slot name="actions" slot="actions"></slot>
+				
 			</umb-body-layout>
 		`;
 	}