Grid PartNameGenerator sample has unnecessary classname

[jflamy]

Description of the bug

On page https://vaadin.com/docs/latest/components/grid#part-name-generator
The css example given uses as selector
vaadin-grid.styling::part(high-rating)

I followed the directions to put this in my theme styles.css file, I had to remove the .styling part for this to work in version 24.3.12,

Expected behavior

The example should work.

Minimal reproducible example

See description

Versions

• Vaadin / Flow version: 24.3.12
• Browser: Chrome

[rolfsmeds]

The styling example is actually correct. You missed that the Grid in the sample has the classname styling applied to it, and also used in the css selectors.

However, this is an unnecessary complication of the sample, and should be addressed (by removing the .styling classname from the selectors).

There is also a workaround in the sample for an issue in the way part names are applied, which should be fixed in the Grid component itself: vaadin/web-components#7447

[jflamy]

Using "styling" as a class name for a grid was not exactly intuitive :-)

[rolfsmeds]

Keeping this open so we remember to remove the classname selector from the sample (and remove the classname entirely when vaadin/web-components#7447 has been fixed).