How to set cell color in Vaadin 8 Grid only if row is not selected

Question

I have:

grid.addColumn(...).setStyleGenerator(item -> "myCssDefinition");

were myCssDefinition is:

.v-grid-cell.myCssDefinition 
{
    color: red;
}

This works great except it makes the text almost impossible to read when the row is selected.

Therefore my question is how can I only change the style, or maybe it's how do I edit the style itself, so that the font color is ONLY red when the row is NOT selected, and when it's selected I just want to use the default Vaadin theme style.

Answer 1

You can use the following CSS to apply your styling to only not selected rows.

:not(.v-grid-row-selected) > .v-grid-cell.myCssDefinition {
    color: red;
}