diff --git a/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor b/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor index d723e69..aff65cb 100644 --- a/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor +++ b/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor @@ -3,6 +3,9 @@ @rendermode RenderMode.InteractiveServer +

Base

+
+
@@ -13,7 +16,38 @@
+
+

Paging

+
+ +
+ Items per page: + +
+ +
+ + + + + + + + +
+ +
+

Filtering

+
+ + @code { + PaginationState pagination = new PaginationState { ItemsPerPage = 10 }; IQueryable? itemsQueryable; protected override async Task OnInitializedAsync() diff --git a/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor.css b/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor.css index 4bec499..8a06907 100644 --- a/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor.css +++ b/HelloBlazorServer/HelloBlazorServer/Components/Pages/QCInMemory.razor.css @@ -4,6 +4,12 @@ overflow-y: auto; } + +.grid-25 { + height: 25rem; + overflow-y: auto; +} + /* Sticky header while scrolling */ ::deep thead { position: sticky; @@ -15,3 +21,24 @@ ::deep tr:nth-child(even) { background: rgba(255,255,255,0.4); } + + +::deep th.country-name { + width: 14rem; +} + +/* Don't collapse rows even if they are empty */ +::deep tbody tr { + height: 1.8rem; +} + +.page-size-chooser { + display: flex; + align-items: center; + margin-bottom: 1rem; +} + +.page-size-chooser select { + margin: 0 1rem; + padding: 0.25rem 0.5rem; +} \ No newline at end of file