KEMBAR78
feat: grid row backgrounds by jouni · Pull Request #10203 · vaadin/web-components · GitHub
Skip to content

Conversation

@jouni
Copy link
Member

@jouni jouni commented Sep 22, 2025

Split from #10190

This change adds a few different custom properties to grid base styles, to easily style various row states:

  • --vaadin-grid-row-odd-background-color: set this globally to have alternating row colors on all grids. Needs to be a solid/opaque color.
  • --vaadin-grid-row-selected-background-color: background color for selected rows. Can be semi-transparent.
  • --vaadin-grid-row-highlight-background-color: optional highlight color for rows, intended to be used together with cellPartNameGenerator. Can be semi-transparent.
  • --vaadin-grid-row-hover-background-color: background color for hovered rows. Can be semi-transparent.

Grid Pro base styles are updated as well, fixing the broken highlight-read-only-cells variant at the same time.

@jouni jouni force-pushed the feat/grid-row-backgrounds branch from f4776eb to 97a163f Compare September 22, 2025 09:23
@jouni jouni requested a review from web-padawan September 22, 2025 09:30
Copy link
Member

@web-padawan web-padawan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The row-stripes variant in dev pages doesn't seem to work anymore in neither grid nor grid-pro, at least I'm not getting different backgrounds.

@sonarqubecloud
Copy link

@web-padawan web-padawan merged commit 747f82c into main Sep 22, 2025
9 checks passed
@web-padawan web-padawan deleted the feat/grid-row-backgrounds branch September 22, 2025 11:26
@vaadin-bot
Copy link
Collaborator

This ticket/PR has been released with Vaadin 25.0.0-alpha12.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants