getredash / redash

Make Your Company Data Driven. Connect to any data source, easily visualize, dashboard and share your data.
http://redash.io/
BSD 2-Clause "Simplified" License
26.21k stars 4.36k forks source link

[Feature Request] Custom CSS #1319

Open ekimia opened 8 years ago

ekimia commented 8 years ago

Of course would be at your own risk, prone to breakage etc. In the future it would be even better to have an editor akin to JIRA for customizing colors and the like.

arikfr commented 8 years ago

So setting up custom CSS involves a few steps (in a way that won't be overrun when you upgrade):

Add additional folder for assets:

Assuming you're using the .env file, add there:

export REDASH_STATIC_ASSETS_PATH="/opt/redash/ui_overrides/,../rd_ui/dist/"

(of course paths might be different, this is just an example)

This instructs Redash to look for static assets first in /opt/redash/ui_overrides/ and then in the regular folder.

Create _includes/tail.html:

At the end of app_layout.html and signed_out_layout.html, we include this include, which is actually a placeholder and it is empty by default. In it you can add any other HTML you need, including stylesheets and whatever.

This is suboptimal, as usually styles should be in the , but... I'm cool with adding another include at the head for similar purposes if you feel it's necessary.

deecay commented 7 years ago

I don't see _includes in places other than signed_out_layout.html now. Can some kind of CSS override be re-enabled?

For cohesive look and feel in dashboards, I wanted to customize pivot table design to match the other visualizations, but couldn't figure out how I could do that.

// match body
table.pvtTable { font-size: 13px;}

// match table visualization header
table.pvtTable thead tr th, table.pvtTable tbody tr th { background-color: #FAFAFA; font-size: 13px; }

// match table visualization value
table.pvtTable tbody tr td { color: #767676; }
arikfr commented 7 years ago

@deecay since making the frontend code a separate bundle that we build during "build time", broke the support for including overrides :\

But if you have changes for the pivot table that make it more consistent with the general look and feel, feel free to make a pull request with them. I know I've been slow to merge recently, but everything will be merged eventually and definitely appreciated!

deecay commented 7 years ago

Thank you for the answer. I will create a PR for pivottable CSS in a couple of days.

bobbui commented 6 years ago

would be awesome if there is an option in the dashboard configuration to put in customized CSS snippet

avishalom commented 4 years ago

did this happen? @deecay

HansBambel commented 2 years ago

would be awesome if there is an option in the dashboard configuration to put in customized CSS snippet

This is still not possible, right?

susodapop commented 2 years ago

Correct @HansBambel . This is not supported.