angularjs ng-grid: how to change header style

Question

How can I restyle the header of ng-grid? In particular how can I change the background-color and the text color of the header row?

Answer 1

You can override the background-color property on the .ngHeaderCell class declared in the ng-grid.css to use the background color you want on the header cells.

If you don't want to modify the original ng-grid css, you can create your own css and load it after ng-grid's css in which you can later overide the same .ngHeaderCell class with:

.ngHeaderCell {
    background-color: [your background color] !important;
    bottom: 0;
    color: [your foreground color] !important;
    position: absolute;
    top: 0;
}