search

jupyter-widgets / jupyterlab-sidecar

A sidecar output widget for JupyterLab
BSD 3-Clause "New" or "Revised" License
247 stars 39 forks source link

CSS layout changed with jupyter 1.0 upgrade #25

Open ablaagaard opened 5 years ago

ablaagaard commented 5 years ago

This commit

https://github.com/jupyter-widgets/jupyterlab-sidecar/commit/aab5071b9ccc630a6f03bcde0f2e116a2d435bc7

added "display: flex" to the CSS, causing a change in layout when showing multiple elements. Example: sc = Sidecar(...) with sc: display(widgets.Label("A")) display(widgets.Label("B"))

Used to show A B Like it would in a normal output cell

Now it shows A B

SylvainCorlay commented 5 years ago

Thanks! I think we probably need to set the flex direction. The goal is to basically have the same CSS as in normal outputs.

jasongrout commented 5 years ago

Something similar also happened over in https://github.com/jupyterlab/jupyterlab/issues/6928 - not sure if it is related, but we ended up deleting a display: flex there as unnecessary.

ablaagaard commented 5 years ago

I've tested by just disabling "display: flex" on the jupyterlab-sidecar style in Chrome, and in my tests the behavior goes back to how it used to be, and how it is in a normal output cell. But since I don't know why it was added, it is hard for me to conclude that this is the right fix.

ablaagaard commented 5 years ago

As a temporary work-around for now I wrapped the sidecar output in an Output widget like this:

sc = Sidecar(...) sc_out = ipywidgets.Output() with sc: display(sc_out) with sc_out: display(widgets.Label("A")) display(widgets.Label("B"))

Doing this also made me think that it could have potential use-cases if Sidecar respected "layout" and "style" attributes like ipywidgets. Then my work-around might have been something like Sidecar(layout={'display': 'block'})