Refactor MudPaper component styling across various features for consistency

Updated the MudPaper component styling in multiple files to use a consistent padding class of "pa-3 pa-md-6" instead of "pa-6". This change enhances the visual consistency of the UI across the Calendar, Events, Students, and Teams components, improving the overall user experience.
This commit is contained in:
2026-01-05 14:01:46 -05:00
parent 2aaefb2491
commit 87db67f979
23 changed files with 115 additions and 69 deletions
@@ -22,7 +22,7 @@
<ValidationErrorDisplay Errors="_validationErrors" />
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudText Typo="Typo.h5" Class="mb-4">Student Information</MudText>
<MudGrid Spacing="3">
<MudItem xs="12" sm="6">
@@ -26,7 +26,7 @@
</ActionButtons>
</PageHeader>
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudText Typo="Typo.h5" Class="mb-4">Student Information</MudText>
<MudGrid Spacing="3">
<MudItem xs="12" sm="6" md="4">
@@ -32,7 +32,7 @@
<MudGrid>
<MudItem xs="12" sm="7">
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudTextField T="string" Label="First Name" @bind-Value="Student.FirstName" For="@(() => Student.FirstName)"></MudTextField>
<MudTextField T="string" Label="Last Name" @bind-Value="Student.LastName" For="@(() => Student.LastName)"></MudTextField>
<MudTextField T="string" Label="Email Adress" @bind-Value="Student.Email" For="@(() => Student.Email)"></MudTextField>
@@ -18,7 +18,7 @@
else
{
<MudStack Spacing="4">
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudText Typo="Typo.h5" Class="mb-4">Students by Rank</MudText>
<MudTable Items="_students" Hover="true" Striped="true" Breakpoint="Breakpoint.Sm" LoadingProgressColor="Color.Info">
<HeaderContent>
@@ -64,7 +64,7 @@ else
</MudTable>
</MudPaper>
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudText Typo="Typo.h5" Class="mb-4">Events by Student</MudText>
<MudTable Items="_eventStudentRankings" Hover="true" Striped="true" Breakpoint="Breakpoint.Sm" LoadingProgressColor="Color.Info">
<HeaderContent>
@@ -15,7 +15,7 @@
</ActionButtons>
</PageHeader>
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudDataGrid T="Student"
ServerData="ServerReload"
@ref="_dataGrid"
@@ -30,7 +30,7 @@
<PropertyColumn Property="@(e => e.LastName)" Title="Name" Sortable="true">
<CellTemplate>
<MudStack Row="true" AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween" Spacing="1">
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
<div class="d-flex align-center flex-wrap" style="gap: 0.25rem;">
<MudLink Href="@($"/students/details?id={context.Item.Id}&returnUrl=/students")"
Underline="Underline.Hover"
Color="Color.Primary">
@@ -40,7 +40,7 @@
{
<MudChip T="string" Size="Size.Small" Icon="@(AppIcons.OfficerRoleIcon(context.Item.OfficerRole.Value))">@context.Item.OfficerRole</MudChip>
}
</MudStack>
</div>
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
<IconButtonWithTooltip Icon="@Icons.Material.Filled.Edit"
TooltipText="Edit"
@@ -19,7 +19,7 @@
</ActionButtons>
</PageHeader>
<MudPaper Elevation="2" Class="pa-6">
<MudPaper Elevation="2" Class="pa-3 pa-md-6">
<MudText Typo="Typo.body2" Class="mb-2">
<MudIcon Icon="@AppIcons.Captain" Size="Size.Small" /> = Team Captain
</MudText>
@@ -78,8 +78,9 @@
var teamsToDisplay = _showRegionalOnly
? context.Item.Teams.Where(t => t?.Event is { RegionalEvent: true }).OrderBy(t => t.Event.Name)
: context.Item.Teams.Where(t => t?.Event != null).OrderBy(t => t.Event.Name);
foreach (var team in teamsToDisplay)
}
<div class="d-flex flex-wrap" style="gap: 0.25rem;">
@foreach (var team in teamsToDisplay)
{
var isCaptain = team.Captain != null && team.Captain.Equals(context.Item.Student);
var teamMembers = string.Join(", ", team.Students.Select(s => s.FirstName));
@@ -97,7 +98,7 @@
</MudChip>
</MudTooltip>
}
}
</div>
</CellTemplate>
</TemplateColumn>
</Columns>