Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add CSS style also to field in Sum row #354

Closed
ArneMancofi opened this issue Jun 20, 2022 · 4 comments
Closed

Add CSS style also to field in Sum row #354

ArneMancofi opened this issue Jun 20, 2022 · 4 comments

Comments

@ArneMancofi
Copy link

Is your feature request related to a problem? Please describe.
I have a Sum row, and would like to be able to right align the number fields using CSS.

Describe the solution you'd like
Whenever .Css(css) is used, css is added to the field in the Sum row, just like all the other rows.

It might be useful to also add a class tag (e.g., grid-sum) to the Sum row, to be able to distinguish the Sum row from the regular rows.

Describe alternatives you've considered
I haven't really been able to figure out an alternative for targeting the field in the Sum row.

Additional context
This feature would be useful for all aggregate rows, like Min, Max, Average, etc.

@comichael
Copy link

I suggest you play around with the CSS :nth-child() selector, based on the CSS class .grid-total-rows

.grid-totals-row td:nth-child(1){
    color: red;
}

@ArneMancofi
Copy link
Author

I suggest you play around with the CSS :nth-child() selector, based on the CSS class .grid-total-rows

.grid-totals-row td:nth-child(1){
    color: red;
}

Ah, good idea! Thanks 👍

@tony-asu
Copy link
Contributor

tony-asu commented Oct 16, 2022

Would this include conditional css?

I've got 2 issues..

  • using the nth-child when the columns can be reordered.
  • changing the color of the text when the sum is negative without having a separate row.

For now I'm using javascript to avoid these issues, but it would be nice if I didn't have to

@gustavnavar
Copy link
Owner

Package 4.0.5 allows to configure css classes for the total rows:

Parameter Type Description Example
GridSumCssClass string (optional) Html classes used by the sum row elements (it overrides default parameter) <GridComponent T="Order" Grid="@_grid" GridSumCssClass="grid-sum-cell" />
GridAverageCssClass string (optional) Html classes used by the average row elements (it overrides default parameter) <GridComponent T="Order" Grid="@_grid" GridAverageCssClass="grid-sum-cell" />
GridMaxCssClass string (optional) Html classes used by the max row elements (it overrides default parameter) <GridComponent T="Order" Grid="@_grid" GridMaxCssClass="grid-sum-cell" />
GridMinCssClass string (optional) Html classes used by the min row elements (it overrides default parameter) <GridComponent T="Order" Grid="@_grid" GridMinCssClass="grid-sum-cell" />
GridCalculationCssClass string (optional) Html classes used by the calcultation row elements (it overrides default parameter) <GridComponent T="Order" Grid="@_grid" GridCalculationCssClass="grid-sum-cell" />

dev0926 added a commit to dev0926/gridNET that referenced this issue Feb 21, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants