Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Invisible progress bars when using ipywidgets / tqdm progress bars #621

Open
ndalchau opened this issue Aug 12, 2022 · 3 comments
Open

Invisible progress bars when using ipywidgets / tqdm progress bars #621

ndalchau opened this issue Aug 12, 2022 · 3 comments

Comments

@ndalchau
Copy link

I always use ipywidgets to make tqdm progress bars look nicer in Jupyter notebooks:
image

Unfortunately, this does not render correctly when presenting in RiSE:
image

The progress bar is invisible, and the font sizes are too small.

Is RiSE compatible with ipywidgets?

@parmentelat
Copy link
Collaborator

Hi

We have examples of interactive demos in rise built on top of ipywidgets, so generally speaking I would tend to say yes

this being said, I was not aware of that library, so I have an empty mileage
as per the README though https://github.com/tqdm/tqdm#ipython-jupyter-integration,
it looks like you're supposed to import stuff through the tqdm.notebook module, right ?

have you tried that approach ?

@ndalchau
Copy link
Author

Thanks for the response @parmentelat . I've tried using all of the various incarnations that I know about. I find that from tqdm.notebook import tqdm and from tqdm.auto_notebook import tqdm give the same behaviour as from tqdm.auto import tqdm, as above.

@patnr
Copy link

patnr commented Nov 20, 2023

I'm pretty sure this has to do with the CSS class .progress being used by both tqdm and reveal.js, where the latter applies display: none when toggling the presentation mode. Not sure how to fix it but including this in my local CSS made the tqdm progress bars appear in presenter mode (but not when toggling back to regular view):

.widget-hprogress .progress {
  display: block !important;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants