Styling Headers

import dash_ag_grid as dag
from dash import Dash, html
import pandas as pd

app = Dash()

df = pd.read_csv(
    "https://raw.githubusercontent.com/plotly/datasets/master/ag-grid/olympic-winners.csv"
)

columnDefs = [
    {
        "headerName": "Group 1",
        "children": [
            {"field": "athlete", "resizable": True},
            {"field": "age", "resizable": True},
        ],
    },
    {
        "headerName": "Group 2",
        "children": [
            {"field": "country"},
            {"field": "date"},
            {"field": "sport"},
            {"field": "total"},
        ],
    },
]

app.layout = html.Div(
    dag.AgGrid(
        id="styling-headers",
        rowData=df.to_dict("records"),
        columnDefs=columnDefs,
        defaultColDef={"editable": True},
        columnSize="sizeToFit",
        dashGridOptions={
            "theme": {
                "function": """themeQuartz.withParams({
                    headerHeight: 30,
                    headerTextColor: 'white',
                    headerBackgroundColor: 'black',
                    headerCellHoverBackgroundColor: 'rgba(80, 40, 140, 0.66)',
                    headerFontFamily: 'cursive',
                    headerFontSize: 18,
                })"""
            }
        },
    )
)

if __name__ == "__main__":
    app.run(debug=True)