Support dropdown class attribute

[psychemedia]

Describe the problem/need and solution

The :class: dropdown element does not appear to be supported within a special content (admonition) block.

Are pure CSS solutions available to implement this sort of feature without then requiring any change to the HTML structure of the rendered cells other than changes to the class attribute?

Guide for implementation

No response

Tasks and updates

No response

[nthiery]

Dropdown admonitions in JupyterLab would be great for teaching: in particular for
tips / solutions that student don't see by default but can reveal if they feel the need for it.

Looking forward to them! Is there a timeline?

Thanks in advance!

[agoose77]

@nthiery are you using jupyterlab-myst in a teaching context? It's good to get a sense of who are users are.

The long-term plan for MyST support in JupyterLab is likely to become https://github.com/executablebooks/jupyterlab-mystjs. This is a MyST-first integration into JupyterLab, rather than an add-on renderer, which is what jupyterlab-myst is similar to. I recommend that you keep an eye on that repository. I can't recall exactly how feature-complete it is vs jupyterlab-myst, but I'll be contributing over there once my time frees up.

[nthiery]

Yes indeed! Admonitions are very helpful to structure the text and catch the eye
of students on specific points. So far, we have been using div's but it's not
as comfortable. Now that we have support in jupyterlab, we are progressively
migrating to myst admonitions, and we will use them much more, especially
with features like dropdowns and the like.

See e.g.:

https://nicolas.thiery.name/Enseignement/IntroScienceDonnees/Devoirs/Semaine2/1_analyse_de_donnees.html#conclusion

[nthiery]

Thanks for the pointer to jupyterlab-mystjs!

[rowanc1]

Feel free to install the jupyterlab-mystjs extension -- it is still very new! Internal images and links are currently broken, hoping to fix up by the end of this week! Tracking internationalization here and here.

Dropdown admonitions do work though! :)

[nthiery]

Ah ah, I tried jupyterlab-mystjs and dropdown indeed worked smoothly. I am
still stuck with md:myst notebooks
and possibly internationalization, but it's getting so close now. Keep it up!

[rowanc1]

I hope most things are fixed now with dropdowns now that the latest release has been brought together with #57.

There is still a pass on styles that needs to be done relatively soon (e.g. with the toggle button not rotating). The dropdown is also html/css powered now, so you can also add other classes that respond to the details[open] css if you want @psychemedia.

Please reopen or comment if I have missed something in this issue!

[psychemedia]

@rowanc1 looks good running in MyBinder to me... as you suggest, the arrow toggle is not there yet, but the essential dropdown functionality is:-)

I just need to persuade folk I work with that we should now upgrade our markdown to myst!