How to make a table with the same style as the Stylesheet?

Dash Python
1

Captura de tela de 2022-10-24 17-11-57
Captura de tela de 2022-10-24 17-11-571552×913 119 KB

I have this dash app, and I would like my table to be linked with the Dash Bootstrap Theme Explorer stylesheet

My Code:

 dbc.Col([
                                        dbc.Label('Click a cell in the table:'),
                                        dash_table.DataTable(df.to_dict('records'),[{"name": i, "id": i} for i in col_table.columns], page_size=10 , id='tbl',
                                        style_cell_conditional=[
                                                        {'if': {'column_id': 'Player'},
                                                        'width': '10%'}
                                        ],
                                        style_data={
                                                'color': 'black',
                                                'backgroundColor': 'white'
                                        },
                                        style_data_conditional=[
                                                {
                                                'if': {'row_index': 'odd'},
                                                'backgroundColor': 'rgb(220, 220, 220)',
                                                }
                                        ],
                                        style_header={
                                                'backgroundColor': 'rgb(210, 210, 210)',
                                                'color': 'black',
                                                'fontWeight': 'bold'
                                        }
      
                                                                )
                                        
                                        
                                        ],style={'padding': '30px'}, width={"size": 4}, sm=4, md=4)
2

Hi @Luisanches

Did you see the instructions and example in the DataTable section?

2 Likes
3

Sorry for the delay! Thanks for introducing me to these instructions I hadn’t seen before!

1 Like