feat: Update GridTable's cardStyle #983
Conversation
Adds 'GridStyle.nonHeaderRowCss' to directly apply styles to non-header row elements. Adds 'GridStyle.rowHoverCss' to apply hover styles to non-header row elements Updates cardStyle to take advantage of the new styles to provide a box-shadow and border color change when hovering over a row. Updates cardStyle to apply more styles directly on the row element rather than on the individual cells
|
If "rowHoverCss" means "non-header", which is cool, do we need the "nonHeader" prefix for nonHeaderRowCss? Could we align those to the same prefix-or-no-prefix? |
| @@ -437,7 +437,7 @@ function renderDiv<R extends Kinded>( | |||
| <div | |||
| css={{ | |||
| ...(style.betweenRowsCss ? Css.addIn(`& > div > *`, style.betweenRowsCss).$ : {}), | |||
| ...(style.firstNonHeaderRowCss ? Css.addIn(`& > div:first-of-type > *`, style.firstNonHeaderRowCss).$ : {}), | |||
There was a problem hiding this comment.
Just curious, it looks like we used to apply this to the cells, and now we're applying it directly to the row? That seems better, just following along.
There was a problem hiding this comment.
Yup, thats true. This is a relic of the display: contents days when we couldn't apply styles directly to rows.
| @@ -39,7 +41,9 @@ export interface GridStyle { | |||
| /** Applied if there is a fallback/overflow message showing. */ | |||
| firstRowMessageCss?: Properties; | |||
| /** Applied on hover if a row has a rowLink/onClick set. */ | |||
| rowHoverColor?: Palette; | |||
| rowHoverColor?: Palette | "none"; | |||
There was a problem hiding this comment.
Wonder if we should rename this old to "rowLinkHoverColor", at least that's what the jsdoc insinuates it is?
(Sorry, reviewing this piecemeal on mobile)
There was a problem hiding this comment.
This was only for link/onClick behavior before, though now it is used all the time. I'll update the docs in an follow up PR.
## [2.330.0](v2.329.0...v2.330.0) (2023-12-14) ### Features * Update GridTable's cardStyle ([#983](#983)) ([ee42c57](ee42c57))
|
🎉 This PR is included in version 2.330.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
Adds 'GridStyle.nonHeaderRowCss' to directly apply styles to non-header row elements. Adds 'GridStyle.rowHoverCss' to apply hover styles to non-header row elements Updates cardStyle to take advantage of the new styles to provide a box-shadow and border color change when hovering over a row. Updates cardStyle to apply more styles directly on the row element rather than on the individual cells