Hello community,
I would like to find out, how to customize the CSS of dcc.Loading to make the overlay (background) transparent.
I have a callback function redrawing a graph. This callback takes several seconds so I find it important to have it wrapped in dcc.Loading so that the user can immediately see whether or not the graph is finished.
However, I also want the user to see the immediate difference between previous and new version of the graph. Thus, I don’t like the fact that dcc.Loading has the white overlay hiding the graph during loading.
I tried to inspect the loading element in order to modify its CSS. There are two issues though. First, passing the style property to dcc.Loading only modifies the spinner, not the overlay. Second, the overlay itself has no class so I cannot define my custom CSS for it.
I know that all it takes to achieve the transparent background is to modify the visibility CSS property of the overlay from hidden to visible but I just don’t know how to do it when the class for the overlay is not defined.
Any ideas?
EDIT: The same question has been asked before but wasn’t answered.