Styling cells through metadata?

Did this PR or related go anywhere? [https://github.com/jupyterlab/jupyterlab/pull/8410]

The issue you referred to appears to have been closed as stale, and another issue linked as the “moved to” thread also appears to have stalled?

There is a possibly related extension at Files · master · Rafe / celltag2DOM · GitLab but I’m not sure if it works with current JupyterLab releases; similarly the GitHub - wallneradam/jupyterlab-custom-css: Add custom CSS rules for JupyterLab which I think in principle would work with the celltag2dom extension to give no developer users a route to being able to tag cells and then style them?

(I really struggle to make sense of JupyterLab extension code and dev environments were any fixes required; the activation energy to try to even get started is just way too expensive for me right now:-(

Did you ever get anywhere with an extension to style notebook cells based on cell tags in a JupyterLab or RetroLab UI? The lack of such a feature continues to be one of the blockers to me moving to JupyterLab for teaching and learning purposes, where we make heavy use of extension styled notebooks based on tag attributes.

If you would like some pointers on where to look to implement this yourself as an extension, you could look at my jupyterlab-imarkdown extension. This extension provides its own NotebookPanel.IContentFactory, which it uses to override the behaviour of the Markdown cell.
This extension does several things, so there are several JupyterLab plugins in index.ts. You only need one to provide your custom factory. You can use the extension cookie-cutter to get started, and inherit directly from NotebookPanel.ContentFactory for your factory, (see jupyterlab-imarkdown/index.ts at 4a564a75ac85240670e4166c36fbbe3a865cb32e · agoose77/jupyterlab-imarkdown · GitHub)
You could subclass all of the cell types in your own factory, and listen to the cell model for changes to the metadata. This could then be used to add or remove classes, e.g. the MARKDOWN_CELL_CLASS added in MarkdownCell

2 Likes

Hiya @psychemedia

sorry for the super late answer to your question, which did not hit my radar at the time:

The answer is no; I’m on exactly the same page as you seem to be, in that a) there are many things that draw me back to the classic notebook even though I know the whole community is pushing towards jlab, and b) I feel totally overwhelmed when it comes to jlab extensions :wink:

@parmentelat I’m still stuck on progress w/ JupyerLab too…

FWIW, I’ve been exploring alternative routes recently, as described here.

thanks for the tips @psychemedia

@parmentelat I made a start trying to dig into a tags2classes extension here. Next step is to add styling by getting a CSS file in there too.

1 Like

Hi @psychemedia
thank a lot for writing all this down !

for the record, if others are interested in the full read, @psychemedia’s blog starts here - (it took me a while to figure out, the next and previous links appear at the very bottom)

as a question to the community: is this html structure something that can be relied on to stay stable in the future ?

1 Like

in case this is still of interest, I just published a jupyterlab extension that adds CSS classes to a cell’s DOM element based on its tags, and keep them in sync

pip install jupyterlab_celltagsclasses

this only supports jlab4 though, so probably not usable in prod right away, given that jlab4 is not yet released, not to mention having to wait for extensions as well (the breaking changes between 3 and 4 are rather numerous in my little experience)

2 Likes

That sounds ominous… :frowning:

1 Like