ipywidgets_server icon indicating copy to clipboard operation
ipywidgets_server copied to clipboard

Remove bootstrap from frontend

Open pbugnion opened this issue 7 years ago • 4 comments

At the moment, we include the Bootstrap CSS. This changes the behaviour of other CSS rules on the page. In particular, since Bootstrap is not included in the ipywidgets embed by default, including bootstrap here leads to slight differences in layout.

For instance, the buttons in the example of issue #6 are not aligned.

The only reason Bootstrap was included was to access the grid layout. We can reproduce this manually without resorting to Bootstrap.

pbugnion avatar Oct 15 '17 06:10 pbugnion

Maybe it can help you?

https://stackoverflow.com/questions/20403443/how-to-get-just-the-responsive-grid-from-bootstrap-3

maryna-yanul avatar Oct 15 '17 07:10 maryna-yanul

Thanks for this! Unfortunately, this does not help because it seems that, even the most minimal bootstrap normalizes CSS properties so that the DOM behaves in a similar way across all browsers.

Note that I'm not against normalizing CSS properties in principle. I just think that the CSS we provide needs to match the CSS provided by the ipywidgets embed bundle so that users get a consistent experience.

pbugnion avatar Oct 15 '17 08:10 pbugnion

I edit this css file to customise my Notebooks. : C:\Users'UserID'\Miniconda3\Lib\site-packages\notebook\static\style\style.min.css

There are many other ways of customising the Jupyter Notebook. For example, the Stackoverflow answers in the link below suggest several methods to change the width of the Jupyter cells. https://stackoverflow.com/questions/21971449/how-do-i-increase-the-cell-width-of-the-jupyter-ipython-notebook-in-my-browser

Perhaps the user could specify the css file in the command line to override Bootstrap CSS settings. This would enable a consistent experience between Jupyter and ipywidgets-server.

DougRzz avatar Nov 12 '17 17:11 DougRzz

When the users can specify their own HTML file (x.ref issue #5 ), they can choose to serve arbitrary CSS (including overriding any bootstrap defaults that they want).

The rationale for this issue is just that bootstrap adds a lot of CSS rules that we don't need, and that might lead to complex errors that are hard for the user to diagnose (like the misaligned buttons in the bqplot example from issue #6).

pbugnion avatar Nov 13 '17 07:11 pbugnion