From 2aa0313fbbfb483df9d5ae64dfa85fcd56557b52 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Fri, 12 Jul 2024 21:26:17 +0530 Subject: [PATCH] #798: Grid default loading placeholder updates + row selection related updates --- blazorbootstrap/Components/Grid/Grid.razor | 4 +++- blazorbootstrap/Components/Grid/Grid.razor.cs | 2 +- blazorbootstrap/wwwroot/blazor.bootstrap.css | 12 ++++++------ 3 files changed, 10 insertions(+), 8 deletions(-) diff --git a/blazorbootstrap/Components/Grid/Grid.razor b/blazorbootstrap/Components/Grid/Grid.razor index 99da15b99..94fa60e44 100644 --- a/blazorbootstrap/Components/Grid/Grid.razor +++ b/blazorbootstrap/Components/Grid/Grid.razor @@ -85,8 +85,10 @@ { @if (loadingTemplate is null) { + var placeholderRowCount = AllowPaging ? pageSize : (totalCount < 10 ? totalCount : 10); + // show placeholders - @for (var i = 0; i < 5; i++) + @for (var i = 0; i < placeholderRowCount; i++) { @for (var j = 0; j < columnCount; j++) diff --git a/blazorbootstrap/Components/Grid/Grid.razor.cs b/blazorbootstrap/Components/Grid/Grid.razor.cs index 377f2cfa1..29872744b 100644 --- a/blazorbootstrap/Components/Grid/Grid.razor.cs +++ b/blazorbootstrap/Components/Grid/Grid.razor.cs @@ -258,7 +258,7 @@ private RenderFragment ChildSelectionTemplate(int rowIndex, TItem rowData) => builder.AddAttribute(103, "class", $"form-check bb-grid-form-check-{headerCheckboxId}"); builder.OpenElement(104, "input"); - builder.AddAttribute(105, "class", "form-check-input"); + builder.AddAttribute(105, "class", "form-check-input bb-grid-form-check-input"); builder.AddAttribute(106, "type", "checkbox"); builder.AddAttribute(107, "role", "button"); diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.css b/blazorbootstrap/wwwroot/blazor.bootstrap.css index a7036a2f0..b14822514 100644 --- a/blazorbootstrap/wwwroot/blazor.bootstrap.css +++ b/blazorbootstrap/wwwroot/blazor.bootstrap.css @@ -141,16 +141,16 @@ table button.dropdown-toggle.bb-grid-filter::after { --bs-table-bg: inherit !important; } - .bb-table tr:has(input[type=checkbox]:checked) { + .bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked) { color: var(--bb-table-selected-row-color); background-color: var(--bb-table-selected-row-background-color); } - .bb-table tr:has(input[type=checkbox]:checked):hover, - .bb-table tr:has(input[type=checkbox]:checked):hover > * { - color: var(--bb-table-selected-row-hover-color); - background-color: var(--bb-table-selected-row-hover-background-color); - } + .bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked):hover, + .bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked):hover > * { + color: var(--bb-table-selected-row-hover-color); + background-color: var(--bb-table-selected-row-hover-background-color); + } .bb-table-sticky { border-collapse: collapse;