vaadin-flowvaadin-gridvaadin10

How to style/theme grid's header checkbox in Vaadin flow?

I was trying to style Vaadin grids header, more specifically, I would like to change the background of the 'checkbox' to 'white'.

This changes all checkboxes to white, not just the one in the header.

:host [part="checkbox"] {
    background: white;
}

/*or*/
[part="checkbox"] {
    background: white;
}

Any suggestions on how I could accomplish that? See the screenshot below: 1) should have white background, 2) should stay with the default background, not white.

Tx.

enter image description here

Solution

  • Did you try the ID CSS selector?

    #selectAllCheckbox {
    background: white;
}

    As I can see on the grid components demo page, the check box is not part of the shadow DOM, i.e. you can style it using global CSS.