ag-gridag-grid-react

How to change the style of the Ag-grid header on sorting (React)?


It is clear from the official doc that I can change the header class using the "headerClass" prop.

However, I want to give the header a different style (specifically color) when its column is sorted.

Any advice about how to approach it?


Solution

  • For others who faced the same problem, you may change the following classes:

    .ag-header-cell-sorted-asc {
            color: blue;
            font-weight: bold;
        }
    
        .ag-header-cell-sorted-desc {
            color: red;
            font-weight: bold;
        }