I want to change the row background colour and font colour of specific rows in a MudDataGrid, I cant get it to work though.
heres my MudDataGrid definition
<MudPaper Class="pa-4 ma-2" Elevation="0"><MudDataGrid ServerData="LoadGridData" T="BookingDetailDto" @ref="_dataGridBookings" ReadOnly="true" Hover="true" Striped="true" RowStyleFunc="@_rowStyleFunc" SortMode="SortMode.None" HeaderClass="mud-table-header"><ToolBarContent><MudText Typo="Typo.h6">Bookings</MudText><MudSpacer /><MudTextField @bind-Value="_searchString" Placeholder="Search By Artist Name" Immediate="true" Class="mt-0"></MudTextField><MudIconButton Size="@MudBlazor.Size.Small" Icon="@MudBlazor.Icons.Material.Rounded.Search" @onclick="() => Search()" Title="Search" /><MudIconButton Size="@MudBlazor.Size.Small" Icon="@MudBlazor.Icons.Material.Rounded.Restore" @onclick="() => Reset()" Title="Reset Grid View" /></ToolBarContent><Columns><MudBlazor.PropertyColumn Property="x => x.BookingId" Title="Booking Number" /><MudBlazor.PropertyColumn Property="x => x.AgencyIdentifier" Hidden /><MudBlazor.PropertyColumn Property="x => x.DateOfPerformance" Format="d" Title="Performance Date" /><MudBlazor.PropertyColumn Property="x => x.TimeOfPerformance" Title="Performance Time" /><MudBlazor.PropertyColumn Property="x => x.ArtistName" Title="Artist" /><MudBlazor.PropertyColumn Property="x => x.VenueName" Title="Venue" /><MudBlazor.TemplateColumn CellClass="d-flex justify-end"><CellTemplate><div @onclick:stopPropagation="true" @onclick:preventDefault="true"><MudIconButton Size="@MudBlazor.Size.Small" Icon="@MudBlazor.Icons.Material.Rounded.Edit" @onclick="() => EditItem(context.Item!)" Title="Edit" /></div></CellTemplate></MudBlazor.TemplateColumn></Columns><PagerContent><MudDataGridPager T="BookingDetailDto" Disabled="false" /></PagerContent></MudDataGrid></MudPaper>I have a function that takes care of the row colouring
private Func<BookingDetailDto, int, string> _rowStyleFunc => (x, i) =>{ string style = string.Empty; if(x.Cancelled) { style += "background-color: #FF0000; color: white !important;"; } return style;};the row is coloured correctly but the font colour doesn't change, this is what I get, can anyone see why ?
