From 059a16b95803ad202c4ea0e2828f6101e5afa575 Mon Sep 17 00:00:00 2001
From: James Kolpack <james.kolpack@gmail.com>
Date: Thu, 25 Dec 2025 23:42:18 -0500
Subject: [PATCH] Move action buttons after the forms.

---
 WebApp/Components/Features/Events/Create.razor       | 11 +++++------
 WebApp/Components/Features/Events/Edit.razor         | 12 ++++++------
 WebApp/Components/Features/Students/Create.razor     | 12 ++++++------
 WebApp/Components/Features/Students/Edit.razor       | 12 ++++++------
 WebApp/Components/Features/Teams/Create.razor        | 12 ++++++------
 WebApp/Components/Features/Teams/Edit.razor          | 12 ++++++------
 .../Components/Shared/Components/FormActions.razor   | 10 ++++++++++
 WebApp/wwwroot/app.css                               |  8 ++++++++
 8 files changed, 53 insertions(+), 36 deletions(-)
 create mode 100644 WebApp/Components/Shared/Components/FormActions.razor

diff --git a/WebApp/Components/Features/Events/Create.razor b/WebApp/Components/Features/Events/Create.razor
index 9f8fece..88c4e23 100644
--- a/WebApp/Components/Features/Events/Create.razor
+++ b/WebApp/Components/Features/Events/Create.razor
@@ -8,12 +8,7 @@
     Title="Create"
     Subtitle="Event"
     ShowBackButton="true"
-    BackButtonUrl="/events">
-    <ActionButtons>
-        <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="create-event-form">Create</MudButton>
-        <MudButton Href="/events" Variant="Variant.Text">Cancel</MudButton>
-    </ActionButtons>
-</PageHeader>
+    BackButtonUrl="/events" />
 
 <EditForm id="create-event-form" Model="EventDefinition" OnValidSubmit="OnValidSubmit" Enhance>
     <AntiforgeryToken />
@@ -51,6 +46,10 @@
     </MudGrid>
 </EditForm>
 
+<FormActions>
+    <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="create-event-form">Create</MudButton>
+    <MudButton Href="/events" Variant="Variant.Text">Cancel</MudButton>
+</FormActions>
 
 @code {
     [SupplyParameterFromForm]
diff --git a/WebApp/Components/Features/Events/Edit.razor b/WebApp/Components/Features/Events/Edit.razor
index a3770c5..a7e218f 100644
--- a/WebApp/Components/Features/Events/Edit.razor
+++ b/WebApp/Components/Features/Events/Edit.razor
@@ -15,12 +15,7 @@
     Title="Edit"
     Subtitle="Event"
     ShowBackButton="true"
-    BackButtonUrl="/events">
-    <ActionButtons>
-        <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="edit-event-form">Save</MudButton>
-        <MudButton Href="/events" Variant="Variant.Text">Cancel</MudButton>
-    </ActionButtons>
-</PageHeader>
+    BackButtonUrl="/events" />
 
 <EditForm id="edit-event-form" Model="EventDefinition" OnValidSubmit="OnValidSubmit" Enhance>
     <AntiforgeryToken />
@@ -58,6 +53,11 @@
     </MudGrid>
 </EditForm>
 
+<FormActions>
+    <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="edit-event-form">Save</MudButton>
+    <MudButton Href="/events" Variant="Variant.Text">Cancel</MudButton>
+</FormActions>
+
 @code {
     [SupplyParameterFromQuery]
     private int Id { get; set; }
diff --git a/WebApp/Components/Features/Students/Create.razor b/WebApp/Components/Features/Students/Create.razor
index bade1ee..eee8bd3 100644
--- a/WebApp/Components/Features/Students/Create.razor
+++ b/WebApp/Components/Features/Students/Create.razor
@@ -8,12 +8,7 @@
     Title="Create"
     Subtitle="Student"
     ShowBackButton="true"
-    BackButtonUrl="/students">
-    <ActionButtons>
-        <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="create-student-form">Create</MudButton>
-        <MudButton Href="/students" Variant="Variant.Text">Cancel</MudButton>
-    </ActionButtons>
-</PageHeader>
+    BackButtonUrl="/students" />
 
 <EditForm id="create-student-form" Model="Student" OnValidSubmit="OnValidSubmit" Enhance>
     <AntiforgeryToken />
@@ -32,6 +27,11 @@
     </MudGrid>
 </EditForm>
 
+<FormActions>
+    <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="create-student-form">Create</MudButton>
+    <MudButton Href="/students" Variant="Variant.Text">Cancel</MudButton>
+</FormActions>
+
 @code {
     [SupplyParameterFromForm]
     private Student Student { get; set; } = new() { TsaYear = 1 };
diff --git a/WebApp/Components/Features/Students/Edit.razor b/WebApp/Components/Features/Students/Edit.razor
index 0116d6c..42152e4 100644
--- a/WebApp/Components/Features/Students/Edit.razor
+++ b/WebApp/Components/Features/Students/Edit.razor
@@ -15,12 +15,7 @@
     Title="Edit Student"
     Subtitle="@($"{Student.FirstNameLastName}")"
     ShowBackButton="true"
-    BackButtonUrl="@(ReturnUrl ?? "/students")">
-    <ActionButtons>
-        <MudButton OnClick="UpdateStudent" Variant="Variant.Filled" Color="Color.Primary">Save</MudButton>
-        <MudButton Href="@(ReturnUrl ?? "/students")" Variant="Variant.Text">Cancel</MudButton>
-    </ActionButtons>
-</PageHeader>
+    BackButtonUrl="@(ReturnUrl ?? "/students")" />
 
 @* https://www.mudblazor.com/components/form *@
 @* https://medium.com/@husainalbar/applying-mudblazor-for-crud-operations-in-our-blazor-project-a343037a52ef *@
@@ -52,6 +47,11 @@
         </MudGrid>
 </EditForm>
 
+<FormActions>
+    <MudButton OnClick="UpdateStudent" Variant="Variant.Filled" Color="Color.Primary">Save</MudButton>
+    <MudButton Href="@(ReturnUrl ?? "/students")" Variant="Variant.Text">Cancel</MudButton>
+</FormActions>
+
 @code {
     [SupplyParameterFromQuery]
     private int Id { get; set; }
diff --git a/WebApp/Components/Features/Teams/Create.razor b/WebApp/Components/Features/Teams/Create.razor
index 688dd6a..e9bd952 100644
--- a/WebApp/Components/Features/Teams/Create.razor
+++ b/WebApp/Components/Features/Teams/Create.razor
@@ -15,12 +15,7 @@
     Title="Create"
     Subtitle="Team"
     ShowBackButton="true"
-    BackButtonUrl="/teams">
-    <ActionButtons>
-        <MudButton OnClick="AddTeam" Variant="Variant.Filled" Color="Color.Primary">Add</MudButton>
-        <MudButton Href="/teams" Variant="Variant.Text">Cancel</MudButton>
-    </ActionButtons>
-</PageHeader>
+    BackButtonUrl="/teams" />
 
 <EditForm method="post" Model="Team" OnValidSubmit="AddTeam" FormName="create" Enhance>
     <AntiforgeryToken />
@@ -70,6 +65,11 @@
     }
 </EditForm>
 
+<FormActions>
+    <MudButton OnClick="AddTeam" Variant="Variant.Filled" Color="Color.Primary">Add</MudButton>
+    <MudButton Href="/teams" Variant="Variant.Text">Cancel</MudButton>
+</FormActions>
+
 @code {
     [SupplyParameterFromForm]
     private Team Team { get; set; } = new();
diff --git a/WebApp/Components/Features/Teams/Edit.razor b/WebApp/Components/Features/Teams/Edit.razor
index 3719c07..ceafc2f 100644
--- a/WebApp/Components/Features/Teams/Edit.razor
+++ b/WebApp/Components/Features/Teams/Edit.razor
@@ -14,12 +14,7 @@
 <PageHeader Title="Edit Team"
     Subtitle=@Team.ToString()
     ShowBackButton="true"
-    BackButtonUrl="/teams">
-    <ActionButtons>
-        <MudButton OnClick="UpdateTeam" Variant="Variant.Filled" Color="Color.Primary">Save</MudButton>
-        <MudButton Href="/teams" Variant="Variant.Text">Cancel</MudButton>
-    </ActionButtons>
-</PageHeader>
+    BackButtonUrl="/teams" />
 
 <EditForm method="post" Model="Team" OnValidSubmit="UpdateTeam" FormName="edit" Enhance>
         <AntiforgeryToken />
@@ -41,6 +36,11 @@
         </MudGrid>
 </EditForm>
 
+<FormActions>
+    <MudButton OnClick="UpdateTeam" Variant="Variant.Filled" Color="Color.Primary">Save</MudButton>
+    <MudButton Href="/teams" Variant="Variant.Text">Cancel</MudButton>
+</FormActions>
+
 @code {
     [SupplyParameterFromQuery]
     private int Id { get; set; }
diff --git a/WebApp/Components/Shared/Components/FormActions.razor b/WebApp/Components/Shared/Components/FormActions.razor
new file mode 100644
index 0000000..81a4e87
--- /dev/null
+++ b/WebApp/Components/Shared/Components/FormActions.razor
@@ -0,0 +1,10 @@
+@namespace WebApp.Components.Shared.Components
+@using MudBlazor
+
+<div class="form-actions">
+    @ChildContent
+</div>
+
+@code {
+    [Parameter] public RenderFragment? ChildContent { get; set; }
+}
diff --git a/WebApp/wwwroot/app.css b/WebApp/wwwroot/app.css
index 4d2bebd..14662b3 100644
--- a/WebApp/wwwroot/app.css
+++ b/WebApp/wwwroot/app.css
@@ -118,4 +118,12 @@ h1:focus {
     display: flex;
     gap: 0.5rem;
     align-items: center;
+}
+
+.form-actions {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+    margin-top: 1.5rem;
+    margin-bottom: 1rem;
 }
\ No newline at end of file