refactor: improve test site examples

Author: jcdcdev

src/Umbraco.Community.SimpleTrees.TestSite/ViewComponents/ExampleItemViewComponent.cs

@@ -8,6 +8,11 @@ public class ExampleItemViewComponent : SimpleTreeViewComponent
 {
     public override IViewComponentResult Invoke(SimpleTreeViewModel model)
     {
-        return Content($"Hello {model.Unique} {model.EntityType} {DateTime.UtcNow:HH:mm:ss}");
+        return Content($"""
+                        <uui-box>
+                        Hello {model.Unique} {model.EntityType} {DateTime.UtcNow:HH:mm:ss}
+                        </uui-box>
+                        """
+        );
     }
 }

src/Umbraco.Community.SimpleTrees.TestSite/ViewComponents/ExampleRootViewComponent.cs

@@ -8,6 +8,11 @@ public class ExampleRootViewComponent : SimpleTreeViewComponent
 {
     public override IViewComponentResult Invoke(SimpleTreeViewModel model)
     {
-        return Content($"Hello {model.Unique} {model.EntityType} {DateTime.UtcNow:HH:mm:ss}");
+        return Content($"""
+                        <uui-box headline="This is my custom tree item">
+                        Hello {model.Unique} {model.EntityType} {DateTime.UtcNow:HH:mm:ss}
+                        </uui-box>
+                        """
+        );
     }
 }

src/Umbraco.Community.SimpleTrees.TestSite/Views/Trees/MyItem.cshtml

@@ -1,7 +1,19 @@
 @inherits Umbraco.Community.SimpleTrees.Web.SimpleTreeViewPage
 
-<uui-box headline="This is my custom tree item">
+<uui-box headline="This is a custom tree item">
 	<div>
-		@Model.Unique - @Model.EntityType
+		<table>
+			<thead>
+			<tr>
+				<th>Entity Type</th>
+				<th>Unique</th>
+			</tr>
+			</thead>
+			<tbody>
+			<tr>
+				<td>@Model.EntityType</td>
+				<td>@Model.Unique</td>
+			</tr>
+		</table>
 	</div>
-</uui-box>
+</uui-box>

src/Umbraco.Community.SimpleTrees.TestSite/Views/Trees/MyRoot.cshtml

@@ -1,7 +1,19 @@
 @inherits Umbraco.Community.SimpleTrees.Web.SimpleTreeViewPage
 
-<uui-box headline="This is my custom tree">
+<uui-box headline="This is a custom tree item">
 	<div>
-		@Model.Unique - @Model.EntityType
+		<table>
+			<thead>
+			<tr>
+				<th>Entity Type</th>
+				<th>Unique</th>
+			</tr>
+			</thead>
+			<tbody>
+			<tr>
+				<td>@Model.EntityType</td>
+				<td>@Model.Unique</td>
+			</tr>
+		</table>
 	</div>
 </uui-box>