🚀 Gen 5 of the leading AI app deployment platform launches October 6. Click for the livestream.

Assets folder not found in docker?

Chris,
That is where I found the reference to the undo-queue. Take a look at the grab to see what I am trying to do. The undo button is white on my ‘dark’ theme. I turned both the i-frame and the plot transparent so I could composite transparent dash graphs onto the dark theme.
The only thing sticking out is the undo button.

How can I remove it? (The /assets/my.css approach crashes my code).

Cheers

This is the recomended approach to remove the undo/redo icons. Can you explain more about how this crashes your code?

The app is called ‘elections’ and it is working but when I add the static css statement, the program will not run. (I know this because my ‘elections’ docker container restarts constantly. Not easy to debug.)

my.css

modebar {

display: none !important;
}

._dash-undo-redo {
display: none;
}

In the app:

css to disappear the hover bar and undo button

my_css_url = “/static/my.css”

elections.css.append_css({“external_url”: my_css_url})

chris’s css

elections.css.append_css({“external_url”: “https://codepen.io/chriddyp/pen/bWLwgP.css”})

Should this work? Should I call in my.css after yours?

I’d recommend putting all of your CSS into your assets folder and removing the calls to append_css. It’s unlikely that append_css is causing the issue but we’re trying to standardize on this “assets” approach for now. See https://dash.plot.ly/external-resources for the full set of docs on local CSS

I could always pull your css classes down to a local (docker/volume) file that gets bundled off with everything.

Then I can refrain from using external css altogether.
My tests of /assets seems not to work at the moment.
I cannot get even your simple class for the pink H1,2, etc to show up.

Next is to comment out the external css import and see if that does it.

thanks

Also, for local assets, make sure that you have app = dash.Dash(__name__) rather than app = dash.Dash(). We use __name__ to find the assets directory (sometimes we can guess, but it doesn’t always turn out right)

I did get your example to run correctly as written.
Yes, I did have dash.Dash(name) as you recommend.

Will try to work back from your example to get this working on my app.

1 Like

Chris,
This is looking like a mixup between what Flask knows as root ‘/’ and the Docker container known as ‘elections’ considers it.

When I looked at the network traces in chrome:inspect panel, I can see the requests to localhost/assets/*.css being made but that directory is not at localhost/root but behind an nginx/ conttainer proxy routed to a gunicorn web server container as /home/project/elections/assets.

I have had this multi-app container thing working with three separate dash apps just fine. Its just when I try to get assets/css stuff it is not finding the right path within the container. Very deep and strange.

Once I solve this, I will share with the community as this may be a good way to host multi-app containers with dash on the cloud (AWS for now).

I put all of my css files onto an S3 bucket which solves the problem. Using external css is probably the way to go.

It accommodates your css and my own without hassle.
Removed the mode bar and the undo/redo button. Looks decent now.

Thanks for all your help @chriddyp

1 Like

@thoughtsociety and @chriddyp I have a similar problem. The standard suggestion of using custom css under assets folder didn’t work in the Docker container. In my case it is difficult to use S3, I hope Ploly team has found a robust way of accessing files under assets. I am deploying my application in Domino Lab. It is certainly the path issue. Any update on this issue would be very appreciated

One thing I did was this way. And it seems like working. I had to still add “append_css” in my case.

###DOMINO LAB SPECIFIC #######################################
app = dash.Dash(name)
app.config.requests_pathname_prefix = ‘’
server = app.server

external_css2 = [
“./assets/font_awesome_css.css”,
“./assets/font_family_raleway.css”,
“./assets/report_custom.css”
]
for css2 in external_css2:
app.css.append_css({“external_url”: css2})
###DOMINO SPECIFIC #######################################