Working with a Material UI react data grid for the first time and I need to apply a custom background color to only the first 3 rows, each being a different color. The custom coloring of these rows is static, nothing that's supposed to happen after an event takes place. Is there any way to point to only one row and apply a background color to it from my scss file?
On a slightly related note, how do I extend column separators so they fill the data grid?
Thank you in advance!
use nth-child(1){}
for style the number 1 child.
Related
I'm using databale from PrineNG in my angular+typescript project.
I have datatable with some editable cells.
I want to change cell background color in some cases.
I know I can use 'bodyStyleClass'. But I need to take some css class based on whole row (I need to compare two values).
It means background color should be dynamically changed by my method.
How I can do this?
I have four photos in one row. When the row is complete, I pass to another row and when it is full I pass to a third row, but this is incomplete. How can I tell to angular it is time to change line or the row is imcompelete and to close the row? I am using the grid of bootstrap3.
Does it need to be done programmatically? I would just put them all in one row, and handle the items per row issue in CSS with width percentages (25%) with float left
I have modified the styles to change the color of the grid rows as well as text. This works fine when the grid is used by itself, but when using expandable rows, the expanded rows do not inherit the properties defined on the main grid. Instead, it is trying to use the original styles that come out of the box. Does anyone know how to make the expanded rows use the same css as the main grid?
I have datagrid in which some cells (not entire columns) are editable and others are not(all is predefined).what we want to achieve is that to differentiate editable and uneditable cells applying differnet colors.
How to achive this?
Thanks in advance.
Use an itemRenderer and set style colors inside the itemRenderer. Depending on your complexity you may consider conditionally setting the style of the itemRenderer based on the data.
I need to have custom rendering of each row in my datagrid. It is column based by default. Is there some way to achieve this?
If any one has tried this before or has any idea in this regard, then please share.
Thanks in advance.
Ashine.
If all you want is different colors, there is an alternatingItemColors style in DataGrid's base class ListBase. You can set an array of colors.
The colors to use for the backgrounds of the items in the list. The value is an array of two or more colors. The backgrounds of the list items alternate among the colors in the array.
For DataGrid controls, all items in a row have the same background color, and each row's background color is determined from the array of colors.
What kind of customization are you looking for?