notebook css styling for nbconvert and ebp

[phaustin]

Quick question(s) -- I'd appreciate suggestions/guidance on writing css styles that will work with both ebp and nbconvert for notebook cells/widgets/pages. Does ebp plan to port the notebook less files to scss for bootstrap4 compatibility (and am I correct that jupyterlab has moved to straight css with no preprocessor)?

[chrisjsewell]

This is the default CSS for myst-nb: https://github.com/ExecutableBookProject/MyST-NB/blob/master/myst_nb/_static/mystnb.css, which you can customise via sphinx in the build process, I believe this has decent overlap with the classes used in nbconvert base.html.j2.

Does ebp plan to port the notebook less files to scss for bootstrap4 compatibility

This sentence means absolutely nothing to me lol, @choldgraf may know more

[phaustin]

Thanks, that's helpful -- elaborating on some of the buzzwords: the css file that nbconvert uses for html: style.css is generated from style.less using the lessc preprocessor. The pandas-sphinx-theme that is installed allong with executable_book_cli uses bootstrap4, which has switched from less to the rival preprocessor sass. From the 7 days I've spent in the web development hall of mirrors, I get the impression that less is being generally replaced by sass, I also get the impression that the notebook is being phased out in favor of jupyterlab, but it really has been only 7 days, so who knows.

[choldgraf]

Hey @phaustin - a couple quick thoughts:

• less and sass both compile to regular old CSS in the end, so a safe bet it always to just write CSS
• The JupyterLab world is definitely getting more attention than the notebook, and I would design with that UI in mind primarily for widgets, because I bet in X years that's the tool most people will be using when doing widget-y things.
• That said, I bet the JupyterLab community might be better-suited to answer your question, have you asked around in discourse.jupyter.org?
• As a general feeling, I agree that sass has become much more popular than less.
• Another community you could ask for some inspiration is the voila community which tends live at the intersection of notebooks, jupyterlab, widgets, and HTML