Use PageHeader throughout the system

WebApp/Components/Features/Events/Details.razor

@@ -1,22 +1,28 @@
 @page "/events/details"
 @attribute [Authorize]
 @using Microsoft.EntityFrameworkCore
+@using WebApp.Components.Shared.Components
 @inject AppDbContext context
 @inject NavigationManager NavigationManager
 
-<PageTitle>Event Details - TSA Chapter Organizer</PageTitle>
-
-<MudText Typo="Typo.h3">Details</MudText>
-<MudText Typo="Typo.h4">Event Definition</MudText>
-<MudDivider />
-
 @if (eventdefinition is null)
 {
     <MudText><em>Loading...</em></MudText>
+    return;
 }
-else
-{
-    <MudPaper Class="pa-4 mt-4">
+
+<PageHeader
+    Title="Details"
+    Subtitle="Event Definition"
+    ShowBackButton="true"
+    BackButtonUrl="/events">
+    <ActionButtons>
+        <MudButton StartIcon="@Icons.Material.Filled.Edit" Href="@($"/events/edit?id={eventdefinition.Id}")" Variant="Variant.Outlined">Edit</MudButton>
+        <MudButton Href="/events" Variant="Variant.Text">Back to List</MudButton>
+    </ActionButtons>
+</PageHeader>
+
+<MudPaper Class="pa-4 mt-4">
         <MudGrid>
             <MudItem xs="12" sm="6" md="4">
                 <MudText Typo="Typo.subtitle2">Name</MudText>
@@ -79,13 +85,7 @@ else
                 <MudText>@eventdefinition.Description</MudText>
             </MudItem>
         </MudGrid>
-    </MudPaper>
-
-    <div class="mt-4">
-        <MudButton StartIcon="@Icons.Material.Filled.Edit" Href="@($"/events/edit?id={eventdefinition.Id}")" Variant="Variant.Filled" Color="Color.Primary">Edit</MudButton>
-        <MudButton StartIcon="@Icons.Material.Filled.ArrowBack" Href="/events" Variant="Variant.Text">Back to List</MudButton>
-    </div>
-}
+</MudPaper>
 
 @code {
     private EventDefinition? eventdefinition;