Adding popouts to the right

[choldgraf]

In a lot of documents (e.g., the spacy documentation as well as the Tufte theme style), the content has a right sidebar with popout information (and in some cases, things like plots). For example:

We had one attempt at this that petered out here: #169

This is likely what'd be needed to make this work:

https://github.com/jupyter/jupyter-book/pull/169/files#diff-e5460f1334ce33770f3270e4f8f2e423R27

this issue is for keeping track of what was done in the hopes that we can get there eventually.

What would need to be done

• Probably some restructuring of the CSS that defines the layout of the main page, to make sure things behaved as expected on different sizes
• CSS rules to pop out cells with a certain tag into the right sidebar
• CSS rules to pop out the outputs of some cells to the right sidebar
• A decision about what to do with the right sidebar elements when the screen is too narrow
• A way to prevent the TOC from totally blocking the sidebar (see below)

What to do about the Table of Contents?

One challenge with #169 was that the right TOC occluded the popouts, and we couldn't figure out a good way to merge the two together. One option would be to make the right TOC hidden by default, and shown with a hover. E.g., something like this:

could be accomplished with just a few CSS rules. Then you could have the right popouts span much more of the space.

To do

• Make the TOC appear on hover from the top of a page
• Use the white-space to the right for the popouts: https://github.com/jupyter/jupyter-book/pull/169/files#diff-e5460f1334ce33770f3270e4f8f2e423R27

[choldgraf]

This is now done!