From b3055fa5ce5677b958a4ef250a7c577a0d5243d6 Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <madsr@hey.com>
Date: Tue, 25 Mar 2025 20:24:16 +0100
Subject: [PATCH] use property-layout for appearance

---
 .../property-workspace-view-settings.element.ts   | 15 ++++-----------
 1 file changed, 4 insertions(+), 11 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/property-type/workspace/views/settings/property-workspace-view-settings.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/property-type/workspace/views/settings/property-workspace-view-settings.element.ts
index 51517df877..8c069f12d1 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/property-type/workspace/views/settings/property-workspace-view-settings.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/property-type/workspace/views/settings/property-workspace-view-settings.element.ts
@@ -270,14 +270,11 @@ export class UmbPropertyTypeWorkspaceViewSettingsElement extends UmbLitElement i
 					</p>
 					${this.#renderCustomValidation()}
 				</div>
-				<hr />
 				${this.#renderVariationControls()}
-				<div class="container">
-					<b style="margin-bottom: var(--uui-size-space-3)">
-						<umb-localize key="contentTypeEditor_displaySettingsHeadline">Appearance</umb-localize>
-					</b>
-					<div id="appearances">${this.#renderAlignLeftIcon()} ${this.#renderAlignTopIcon()}</div>
-				</div>
+				<umb-property-layout label="#contentTypeEditor_displaySettingsHeadline" orientation="vertical">
+					<div id="appearances" slot="editor">${this.#renderAlignLeftIcon()} ${this.#renderAlignTopIcon()}</div>
+				</umb-property-layout>
+
 				${this.#renderMemberTypeOptions()}
 			</uui-box>
 		`;
@@ -553,10 +550,6 @@ export class UmbPropertyTypeWorkspaceViewSettingsElement extends UmbLitElement i
 				display: block;
 				height: 100%;
 			}
-
-			umb-property-layout {
-				padding-top: 0;
-			}
 		`,
 	];
 }