Specifying print CSS rules for notebooks

[SylvainCorlay]

References

This CSS change is meant to prevent page breaks in the middle of outputs when printing notebooks (webpdf export in nbconvert).

Code changes

Adding @media print CSS rules to:

• hide collapsers
• display the input wrappers and output wrapper with display: block (because flex prevents the use of break-inside CSS property in inner HTML).
• set the break-inside property to avoid-page for jp-OutputArea-child elements.

Screenshots (Before | After)

[jupyterlab-probot]

Thanks for making a pull request to jupyterlab!
To try out this branch on binder, follow this link:

[jtpio]

Diff looks good, thanks!

Mind posting a quick screenshot of what it looks like when printed if you have one around? So we have it as reference here in this PR.

[SylvainCorlay]

Diff looks good, thanks!

Mind posting a quick screenshot of what it looks like when printed if you have one around? So we have it as reference here in this PR.

I added a before / after screenshot going over several pages with bqplot figures.

[jtpio]

Nice, thanks!

[github-actions]

Benchmark report

The execution time (in milliseconds) are grouped by test file, test type and browser.
For each case, the following values are computed: min <- [1st quartile - median - 3rd quartile] -> max.

The mean relative comparison is computed with 95% confidence.

Results table

Test file	large_code_notebook	large_md_notebook
open
chromium
actual	5056 <- [5190 - 5267 - 5356] -> 6600	3391 <- [3564 - 3621 - 3668] -> 3836
expected	4944 <- [5152 - 5242 - 5334] -> 6477	3466 <- [3564 - 3635 - 3688] -> 3890
Mean relative change	1.1% ± 1.6%	-0.5% ± 0.7%
switch-from
chromium
actual	607 <- [688 - 724 - 759] -> 965	506 <- [536 - 548 - 566] -> 761
expected	626 <- [697 - 730 - 753] -> 1083	493 <- [537 - 551 - 568] -> 604
Mean relative change	-0.7% ± 2.5%	0.1% ± 1.4%
switch-to
chromium
actual	683 <- [740 - 772 - 804] -> 997	612 <- [629 - 637 - 660] -> 724
expected	672 <- [725 - 759 - 800] -> 938	606 <- [628 - 642 - 664] -> 701
Mean relative change	1.4% ± 2.1%	-0.0% ± 1.1%
close
chromium
actual	596 <- [692 - 937 - 1168] -> 1583	503 <- [533 - 544 - 556] -> 590
expected	629 <- [708 - 1090 - 1143] -> 1571	501 <- [525 - 539 - 553] -> 588
Mean relative change	-0.9% ± 7.7%	0.8% ± 1.0%

Changes are computed with expected as reference.