feat: enhance ReleaseNotesDialog with improved UI elements and animations; update button labels and alert messages
Build and Deploy / build (push) Successful in 1m26s

This commit is contained in:
masoodafar-web
2025-12-27 05:06:03 +03:30
parent 9cd275a777
commit 43cdf7c897
@@ -4,41 +4,54 @@
<MudDialog>
<TitleContent>
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="2">
<MudIcon Icon="@Icons.Material.Filled.SystemUpdateAlt" Color="Color.Primary" Size="Size.Large"/>
<MudText Typo="Typo.h6">
@if (IsForceUpdate)
{
<span>بروزرسانی اجباری</span>
}
else
{
<span>نسخه جدید موجود است</span>
}
</MudText>
@if (IsForceUpdate)
{
<MudIcon Icon="@Icons.Material.Filled.Warning" Color="Color.Warning" Size="Size.Large"/>
<MudText Typo="Typo.h6" Color="Color.Warning">بروزرسانی اجباری</MudText>
}
else
{
<MudIcon Icon="@Icons.Material.Filled.NewReleases" Color="Color.Success" Size="Size.Large"/>
<MudText Typo="Typo.h6">نسخه جدید موجود است 🎉</MudText>
}
</MudStack>
</TitleContent>
<DialogContent>
<MudStack Spacing="3">
@* اطلاعات نسخه *@
<MudPaper Class="pa-3" Elevation="0" Style="background-color: var(--mud-palette-background-grey);">
<MudStack Row="true" Justify="Justify.SpaceBetween">
<MudText>نسخه فعلی:</MudText>
<MudText Color="Color.Secondary">@(OldVersion ?? "---")</MudText>
</MudStack>
<MudDivider Class="my-2"/>
<MudStack Row="true" Justify="Justify.SpaceBetween">
<MudText>نسخه جدید:</MudText>
<MudText Color="Color.Primary"><b>@NewVersion</b></MudText>
</MudStack>
@* اطلاعات نسخه با انیمیشن *@
<MudPaper Class="pa-4 rounded-lg" Elevation="0"
Style="background: linear-gradient(135deg, var(--mud-palette-primary-lighten) 0%, var(--mud-palette-background) 100%);">
<MudGrid Spacing="2">
<MudItem xs="6">
<MudStack AlignItems="AlignItems.Center" Spacing="1">
<MudIcon Icon="@Icons.Material.Outlined.History" Size="Size.Medium" Color="Color.Secondary"/>
<MudText Typo="Typo.caption" Color="Color.Secondary">نسخه فعلی</MudText>
<MudChip T="string" Size="Size.Small" Variant="Variant.Outlined" Color="Color.Secondary">
@(OldVersion ?? "---")
</MudChip>
</MudStack>
</MudItem>
<MudItem xs="6">
<MudStack AlignItems="AlignItems.Center" Spacing="1">
<MudIcon Icon="@Icons.Material.Filled.Verified" Size="Size.Medium" Color="Color.Success"/>
<MudText Typo="Typo.caption" Color="Color.Success">نسخه جدید</MudText>
<MudChip T="string" Size="Size.Small" Variant="Variant.Filled" Color="Color.Success">
@NewVersion
</MudChip>
</MudStack>
</MudItem>
</MudGrid>
</MudPaper>
@* پیام آپدیت *@
@if (!string.IsNullOrWhiteSpace(UpdateMessage))
{
<MudAlert Severity="@(IsForceUpdate ? Severity.Warning : Severity.Info)"
Variant="Variant.Outlined"
Dense="true">
Variant="Variant.Text"
Dense="true"
Icon="@Icons.Material.Filled.Info"
Class="rounded-lg">
@UpdateMessage
</MudAlert>
}
@@ -46,18 +59,27 @@
@* یادداشت‌های انتشار *@
@if (!string.IsNullOrWhiteSpace(ReleaseNotes))
{
<MudText Typo="Typo.subtitle2" Color="Color.Primary">تغییرات این نسخه:</MudText>
<MudPaper Class="pa-3" Elevation="1" Style="max-height: 250px; overflow-y: auto;">
@((MarkupString)ReleaseNotes)
</MudPaper>
<MudStack Spacing="1">
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
<MudIcon Icon="@Icons.Material.Filled.Article" Size="Size.Small" Color="Color.Primary"/>
<MudText Typo="Typo.subtitle2" Color="Color.Primary">تغییرات این نسخه:</MudText>
</MudStack>
<MudPaper Class="pa-3 rounded-lg release-notes-content" Elevation="0"
Style="max-height: 220px; overflow-y: auto; background-color: var(--mud-palette-background-grey); border: 1px solid var(--mud-palette-lines-default);">
@((MarkupString)ReleaseNotes)
</MudPaper>
</MudStack>
}
@if (IsForceUpdate)
{
<MudAlert Severity="Severity.Error" Variant="Variant.Filled" Dense="true">
<MudText Typo="Typo.body2">
این بروزرسانی اجباری است و باید انجام شود.
</MudText>
<MudAlert Severity="Severity.Error" Variant="Variant.Filled" Dense="true" Class="rounded-lg">
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
<MudIcon Icon="@Icons.Material.Filled.Error" Size="Size.Small"/>
<MudText Typo="Typo.body2">
این بروزرسانی اجباری است و باید انجام شود.
</MudText>
</MudStack>
</MudAlert>
}
</MudStack>
@@ -68,14 +90,17 @@
{
<MudButton OnClick="OnSkipClicked"
Color="Color.Default"
Variant="Variant.Text">
بعداً
Variant="Variant.Text"
Size="Size.Medium">
بعداً یادآوری کن
</MudButton>
}
<MudButton OnClick="OnUpdateClicked"
Color="Color.Primary"
Color="@(IsForceUpdate ? Color.Warning : Color.Success)"
Variant="Variant.Filled"
StartIcon="@Icons.Material.Filled.Update">
Size="Size.Medium"
StartIcon="@(_isUpdating ? null : Icons.Material.Filled.SystemUpdateAlt)"
Class="px-6">
@if (_isUpdating)
{
<MudProgressCircular Size="Size.Small" Indeterminate="true" Color="Color.Surface"/>
@@ -83,12 +108,29 @@
}
else
{
<span>بروزرسانی</span>
<span>بروزرسانی کن!</span>
}
</MudButton>
</DialogActions>
</MudDialog>
<style>
.release-notes-content {
font-size: 0.9rem;
line-height: 1.8;
}
.release-notes-content ul, .release-notes-content ol {
padding-right: 1.5rem;
margin: 0.5rem 0;
}
.release-notes-content li {
margin-bottom: 0.3rem;
}
.release-notes-content p {
margin: 0.5rem 0;
}
</style>
@code {
[CascadingParameter]
private IMudDialogInstance MudDialog { get; set; } = default!;