brister/jsmr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Updated tags/creators page styling.
All checks were successful
ci / build-test (push) Successful in 2m30s
Details
ci / publish-image (push) Successful in 1m42s
Details

Browse Source
This commit is contained in:
Brian Bicknell
2026-04-21 00:41:31 -04:00
parent da33973229
commit 6bc91b293d
2 changed files with 75 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
JSMR.UI.Blazor/Pages/Creators.razor
View File

@@ -11,11 +11,20 @@
<PageTitle>Creators</PageTitle>
<h1>Creators</h1>
@* <h1>Creators</h1>
<MudTextField T="string" Value="Keywords" ValueChanged="OnKeywordsChanged" Immediate="true" DebounceInterval="500" Label="Filter" Variant="MudBlazor.Variant.Text" Adornment="@Adornment.Start" AdornmentIcon="@Icons.Material.Outlined.Search" />
*@
<AntDesign.Card Title=@("Creators") Class="ant-blurred-card">
<Extra>
<AntDesign.Input TValue="string" Value="Keywords" ValueChanged="OnKeywordsChanged" DebounceMilliseconds="500" Placeholder="Filter">
<Prefix>
<AntDesign.Icon Type="@AntDesign.IconType.Outline.Search" />
</Prefix>
</AntDesign.Input>
</Extra>
<Body>
<AntDesign.Table DataSource="@(searchResults?.Items ?? Enumerable.Empty<CreatorSearchItem>())"
Total="@(searchResults?.TotalItems ?? 0)"
TItem="CreatorSearchItem"
@@ -35,7 +44,7 @@
<AntDesign.Tag Color="AntDesign.TagColor.PurpleInverse">Favorite</AntDesign.Tag>
}
</AntDesign.PropertyColumn>
<AntDesign.PropertyColumn Property="c => c.Blacklisted" Title="Blacklisted" HeaderStyle="width: 8em" Sortable="true" SortDirections="new[] { AntDesign.SortDirection.Descending }" SorterMultiple="4">
<AntDesign.PropertyColumn Property="c => c.Blacklisted" Title="Blacklisted" HeaderStyle="width: 9em" Sortable="true" SortDirections="new[] { AntDesign.SortDirection.Descending }" SorterMultiple="4">
@if (context.Blacklisted)
{
<AntDesign.Tag Color="AntDesign.TagColor.RedInverse">Blacklisted</AntDesign.Tag>
@@ -57,6 +66,8 @@
</AntDesign.ActionColumn> *@
</ColumnDefinitions>
</AntDesign.Table>
</Body>
</AntDesign.Card>
<JPagination PageNumber="PageNumber" PageNumberChanged="OnPageNumberChanged" PageSize="PageSize" PageSizeChanged="OnPageSizeChanged" TotalItems="TotalItems" />
@@ -65,6 +76,25 @@
table-layout: fixed;
}
body {
background-image: url(https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*ETkNSJ-oUGwAAAAAQ_AAAAgAegCCAQ/original);
background-size: cover;
}
.ant-blurred-card {
background-color: color-mix(in srgb, #141414 70%, transparent);
-webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px);
}
.ant-table {
/* background: inherit; */
}
.ant-table table {
table-layout: fixed;
}
.j-pager {
position: fixed;
bottom: 0;

17
JSMR.UI.Blazor/Pages/Tags.razor
View File

@@ -72,6 +72,7 @@
</Body>
</AntDesign.Card>
<Pagination Current="PageNumber" OnChange="OnPaginationChange" PageSize="PageSize" Total="TotalItems" ShowTotal="ShowTotal"></Pagination>
<JPagination PageNumber="PageNumber" PageNumberChanged="OnPageNumberChanged" PageSize="PageSize" PageSizeChanged="OnPageSizeChanged" TotalItems="TotalItems" />
</div>
@@ -80,9 +81,9 @@
table-layout: fixed;
}
.mud-main-content {
body {
background-image: url(https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*ETkNSJ-oUGwAAAAAQ_AAAAgAegCCAQ/original);
background-size: contain;
background-size: cover;
}
.ant-blurred-card {
@@ -120,6 +121,8 @@
public int PageSize { get; set; } = 100;
public int TotalItems => searchResults?.TotalItems ?? 0;
Func<PaginationTotalContext, string> ShowTotal = ctx => $"{ctx.Range.from} - {ctx.Range.to} of {ctx.Total} items";
public bool LoadingData { get; set; }
SearchResult<TagSearchItem>? searchResults;
@@ -135,6 +138,16 @@
await UpdateDataAsync(true);
}
public async Task OnPaginationChange(PaginationEventArgs args)
{
bool resetPageNumber = PageSize != args.PageSize;
PageNumber = args.Page;
PageSize = args.PageSize;
await UpdateDataAsync(resetPageNumber);
}
public async Task OnPageNumberChanged(int newPageNumber)
{
PageNumber = newPageNumber;