Bug on RadzenDataGrid cellrender setting background-color cell with lighter colors

[plaguebreath]

Hi everyone, I am here for post a strange issue I found recently while I was trying to use conditional color on some cells in a frozen column.
I noticed that during the render event call

void CellRender(DataGridCellRenderEventArgs args)

if based on column property value I write this style color

args.Attributes.Add("style", $"background-color: var(--rz-info-lighter);");

and if I scroll the table on the right or left I can see all the backvalues on the row
if I set it like --rz-info-light the back content of the row is not rendered as expected while scrolling horizontally.

Best regards.

[yordanov]

Hi @plaguebreath,

You can see the back cell values of the row because the --rz-info-lighter variable contains a semi-transparent color value depending on the theme in use. For example in the default theme the color value is rgba(44, 200, 200, 0.2) - that is 0.2 on the alpha channel.

That said, you can apply this semi-transparent color using background-image instead of overriding the background-color:

args.Attributes.Add("style", $"background-image: linear-gradient(0deg, var(--rz-info-lighter), var(--rz-info-lighter))
;");

This way you can keep the alternating rows appearance, because you don't actually change the cell's background color:

If you insist on keeping the background color consistent without the alternating look, just apply a white background-color in addition to the background-image:

args.Attributes.Add("style", $"background-color: white; background-image: linear-gradient(0deg, var(--rz-info-lighter), var(--rz-info-lighter))
;");

or

args.Attributes.Add("style", $"background-color: var(--rz-grid-stripe-odd-background-color); background-image: linear-gradient(0deg, var(--rz-info-lighter), var(--rz-info-lighter))
;");

Another option is to override the --rz-info-lighter color value, but I wouldn't recommend doing it globally as the semi-transparent color plays really well with other components in use e.g. RadzenBadge or RadzenAlert with a semi-transparent background.

[plaguebreath]

Thank you so much for the helpfull insight, I was thinking it's not intended the transparency so I just reported it. Thank you for all the indept explanation I never think before about the white image, great solution !