With the help of you all i got to an acceptable solution. --text-color was overwriting my active green cell with some 3c3c3c.
import dash
from dash.dependencies import Input, Output
import dash_table
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/gapminder2007.csv')
app = dash.Dash(__name__)
app.layout = html.Div([
dash_table.DataTable(
id='datatable-interactivity',
columns=[
{"name": i, "id": i, "deletable": True, "selectable": True} for i in df.columns
],
data=df.to_dict('records'),
editable=True,
filter_action="native",
sort_action="native",
sort_mode="multi",
# column_selectable="single",
# row_selectable="multi",
# row_deletable=True,
selected_columns=[],
selected_rows=[],
page_action='none',
# style_as_list_view=True,
style_cell={
# 'padding': '5px'
'backgroundColor': 'black',
'color': 'white',
'textAlign': 'left',
},
style_header={
'backgroundColor': 'transparent',
'fontWeight': 'bold'
},
css=[
{"selector": ".dash-spreadsheet-container table", "rule": '--text-color: green !important'},
],
style_data_conditional=[
{
"if": {"state": "active"}, # 'active' | 'selected'
"backgroundColor": "black",
"border": "3px solid white",
"color": "green",
},{
"if": {"state": "selected"},
# "backgroundColor": "rgba(255,255,255, 0.1)",
"backgroundColor": "#444444",
},
],
),
html.Div(id='datatable-interactivity-container')
], style={'backgroundColor': '#444444',})
if __name__ == '__main__':
app.run_server(debug=True)
