Refactor UI components to utilize MudBlazor's layout system
This commit updates several components to replace traditional HTML layout elements with MudBlazor's MudStack component for improved styling and responsiveness. Changes include the CareerMapping.razor, Index.razor, Registration.razor, TeamStudents.razor, and TeamToggleSelector.razor files. These modifications enhance the visual consistency and maintainability of the UI by adhering to the project's design standards.
This commit is contained in:
@@ -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">
|
||||
<div class="d-flex align-center flex-wrap" style="gap: 0.25rem;">
|
||||
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1" Wrap="Wrap.Wrap">
|
||||
<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>
|
||||
}
|
||||
</div>
|
||||
</MudStack>
|
||||
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
|
||||
<IconButtonWithTooltip Icon="@Icons.Material.Filled.Edit"
|
||||
TooltipText="Edit"
|
||||
|
||||
@@ -79,7 +79,7 @@
|
||||
? 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);
|
||||
}
|
||||
<div class="d-flex flex-wrap" style="gap: 0.25rem;">
|
||||
<MudStack Row="true" Spacing="1" Wrap="Wrap.Wrap">
|
||||
@foreach (var team in teamsToDisplay)
|
||||
{
|
||||
var isCaptain = team.Captain != null && team.Captain.Equals(context.Item.Student);
|
||||
@@ -98,7 +98,7 @@
|
||||
</MudChip>
|
||||
</MudTooltip>
|
||||
}
|
||||
</div>
|
||||
</MudStack>
|
||||
</CellTemplate>
|
||||
</TemplateColumn>
|
||||
</Columns>
|
||||
|
||||
Reference in New Issue
Block a user