Wrap pages in consistent container styling
Remove Back to List
This commit is contained in:
@@ -3,39 +3,44 @@
|
||||
@using Microsoft.EntityFrameworkCore
|
||||
@using BlazorSortableList
|
||||
@using WebApp.Models
|
||||
@using WebApp.Components.Shared.Components
|
||||
@inject AppDbContext Context
|
||||
@inject NavigationManager NavigationManager
|
||||
@inject ISnackbar Snackbar
|
||||
@inject ILogger<EventRankingEdit> Logger
|
||||
|
||||
<PageTitle>Student Event Ranks - TSA Chapter Organizer</PageTitle>
|
||||
@if (_student == null)
|
||||
{
|
||||
<p><em>Loading...</em></p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<PageHeader
|
||||
Title="Student Event Ranks"
|
||||
Subtitle="@_student.Name"
|
||||
Icon="@AppIcons.EventRank"
|
||||
ShowBackButton="true"
|
||||
BackButtonUrl="/students/event-ranking">
|
||||
<ActionButtons>
|
||||
<MudButton StartIcon="@Icons.Material.Filled.Save"
|
||||
OnClick="Save"
|
||||
Color="Color.Primary"
|
||||
Variant="Variant.Filled">
|
||||
Save Rankings
|
||||
</MudButton>
|
||||
</ActionButtons>
|
||||
</PageHeader>
|
||||
|
||||
<MudText Typo="Typo.h3"><MudIcon Icon="@AppIcons.EventRank"></MudIcon> Student Event Ranks</MudText>
|
||||
|
||||
<div>
|
||||
@if (_student == null)
|
||||
{
|
||||
<p><em>Loading...</em></p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<MudText Typo="Typo.h4" Class="mb-2">@_student.Name</MudText>
|
||||
|
||||
<div class="mb-4">
|
||||
<MudButton StartIcon="@Icons.Material.Filled.ArrowBack" Href="students/event-ranking" Variant="Variant.Outlined" Class="mr-2">Back</MudButton>
|
||||
<MudButton StartIcon="@Icons.Material.Filled.Save" OnClick="Save" Color="Color.Primary" Variant="Variant.Filled">Save Rankings</MudButton>
|
||||
</div>
|
||||
|
||||
@* https://github.com/AlexNek/BlazorSortableList *@
|
||||
<MudGrid Class="mt-2">
|
||||
<MudItem xs="12" md="6" xl="4">
|
||||
<MudPaper Class="pa-3 mb-3" Elevation="0">
|
||||
<div class="d-flex align-center mb-1">
|
||||
<MudIcon Icon="@Icons.Material.Filled.FormatListNumbered" Class="mr-2" Color="Color.Primary" />
|
||||
<MudText Typo="Typo.h6" Color="Color.Primary">Ranked Events</MudText>
|
||||
</div>
|
||||
<MudText Typo="Typo.caption" Color="Color.Secondary">Drag events here in order of preference</MudText>
|
||||
</MudPaper>
|
||||
@* https://github.com/AlexNek/BlazorSortableList *@
|
||||
<MudGrid Class="mt-2">
|
||||
<MudItem xs="12" md="6" xl="4">
|
||||
<MudPaper Class="pa-3 mb-3" Elevation="2">
|
||||
<div class="d-flex align-center mb-1">
|
||||
<MudIcon Icon="@Icons.Material.Filled.FormatListNumbered" Class="mr-2" Color="Color.Primary" />
|
||||
<MudText Typo="Typo.h6" Color="Color.Primary">Ranked Events</MudText>
|
||||
</div>
|
||||
<MudText Typo="Typo.caption" Color="Color.Secondary">Drag events here in order of preference</MudText>
|
||||
</MudPaper>
|
||||
<SortableList
|
||||
Group="GroupId" Id="ListId1" Context="item"
|
||||
Items="_rankedEvents" OnRemove="RankedEventsRemove" OnUpdate="Update">
|
||||
@@ -56,16 +61,16 @@
|
||||
</MudCardContent>
|
||||
</MudCard>
|
||||
</SortableItemTemplate>
|
||||
</SortableList>
|
||||
</MudItem>
|
||||
<MudItem xs="12" md="6" xl="4">
|
||||
<MudPaper Class="pa-3 mb-3" Elevation="0">
|
||||
<div class="d-flex align-center mb-1">
|
||||
<MudIcon Icon="@AppIcons.Events" Class="mr-2" />
|
||||
<MudText Typo="Typo.h6">Available Events</MudText>
|
||||
</div>
|
||||
<MudText Typo="Typo.caption" Color="Color.Secondary">Drag events to rank them</MudText>
|
||||
</MudPaper>
|
||||
</SortableList>
|
||||
</MudItem>
|
||||
<MudItem xs="12" md="6" xl="4">
|
||||
<MudPaper Class="pa-3 mb-3" Elevation="2">
|
||||
<div class="d-flex align-center mb-1">
|
||||
<MudIcon Icon="@AppIcons.Events" Class="mr-2" />
|
||||
<MudText Typo="Typo.h6">Available Events</MudText>
|
||||
</div>
|
||||
<MudText Typo="Typo.caption" Color="Color.Secondary">Drag events to rank them</MudText>
|
||||
</MudPaper>
|
||||
<SortableList
|
||||
Group="GroupId" Id="ListId2" Context="item"
|
||||
Items="_availableEvents" OnRemove="AvailableEventsRemove" Sort="false">
|
||||
@@ -79,11 +84,10 @@
|
||||
</MudCardContent>
|
||||
</MudCard>
|
||||
</SortableItemTemplate>
|
||||
</SortableList>
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
}
|
||||
</div>
|
||||
</SortableList>
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
}
|
||||
|
||||
@code {
|
||||
|
||||
|
||||
Reference in New Issue
Block a user