Add support for confined/unconfined image outputs

Add support for confined/unconfined image outputs

Remove svg styling for now

Do not toggle the class on MD output

Remove svg styling

src/notebook/notebook/widget.ts

@@ -104,6 +104,12 @@ const SELECTED_CLASS = 'jp-mod-selected';
  */
 const OTHER_SELECTED_CLASS = 'jp-mod-multiSelected';
 
+/**
+ * The class name added to unconfined images.
+ */
+const UNCONFINED_CLASS = 'jp-mod-unconfined';
+
+
 /**
  * The interactivity modes for the notebook.
  */
@@ -970,7 +976,8 @@ class Notebook extends StaticNotebook {
     if (!model || model.readOnly) {
       return;
     }
-    let i = this._findCell(event.target as HTMLElement);
+    let target = event.target as HTMLElement;
+    let i = this._findCell(target);
     if (i === -1) {
       return;
     }
@@ -980,6 +987,8 @@ class Notebook extends StaticNotebook {
     if (cell.type === 'markdown') {
       widget.rendered = false;
       return;
+    } else if (target.localName === 'img') {
+      target.classList.toggle(UNCONFINED_CLASS);
     }
   }
 

src/notebook/theme.css

@@ -85,6 +85,17 @@
 }
 
 
+.jp-Output-executeResult img {
+  max-width: 100%;
+  height: auto;
+}
+
+
+img.jp-mod-unconfined {
+  max-width: none;
+}
+
+
 .jp-Output-prompt {
   color: #D84315;
   font-family: monospace;