How can style ui.output_dataframe

[dimplast]

With the following code I'm trying to change the color in the dataframe's thead. While changing the text color it doesn't do the same as the background-color.
Can someone help?

app_ui = ui.page_fixed(
ui.include_css('my.css'),
ui.h2('Sales'),
ui.output_data_frame("filtered_table"),
)
and my.css file
body th {
color: white;
background-color: black;
}

[pieterjanvc]

Hi,

It's always tricky to start messing with the CSS indeed because there are so many classes and variables that can get in the way and override what you write in a file is it's not specific enough.

If you are looking to focus on the header, this should work:

from shiny import App, ui, reactive, render, Inputs, Outputs, Session
import pandas as pd

app_ui = ui.page_fixed(
    ui.include_css('my.css'),
    ui.h2('Sales'),
    ui.output_data_frame("filtered_table"),
)

def server(input: Inputs, output: Outputs, session: Session):
    # create a dummy sales data frame
    sales = pd.DataFrame({
        'Product': ['A', 'B', 'C', 'D'],
        'Sales': [100, 200, 300, 400]
    })

    @render.data_frame
    def filtered_table():
        return sales
app = App(app_ui, server)

.shiny-data-grid thead {
  --shiny-datagrid-grid-header-bgcolor: black;
  color: white;
}

The background color is actually defined by a variable, which we override here for the data-grid class

Hope this helps,
PJ

[dimplast]

Hi PJ
Thank you very much for the reply.
I am rookie on shiny.

Until now my work was based on streamlit. It's an awesome framework with a great community. The problem is that you can't customize the UI the way you want. So I decided to try shiny for python. It worries me that the community is not that big and the problems presented will be more difficult to deal with.

Thanks again.
dimplast