Fix style for mobile layout

jupyterlab · Oct 9, 2023 · cb0a830 · cb0a830
1 parent 7ad6d82
commit cb0a830
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/packages/cells/style/inputarea.css b/packages/cells/style/inputarea.css
@@ -74,6 +74,10 @@
 | Mobile
 |----------------------------------------------------------------------------*/
 @media only screen and (width <= 760px) {
+  .jp-InputArea {
+    flex-direction: column;
+  }
+
   .jp-InputArea-editor {
     margin-left: var(--jp-notebook-padding);
   }

diff --git a/packages/outputarea/style/base.css b/packages/outputarea/style/base.css
@@ -287,13 +287,16 @@ body.lm-mod-override-cursor .jp-OutputArea-output.jp-mod-isolated::before {
 | Mobile
 |----------------------------------------------------------------------------*/
 @media only screen and (width <= 760px) {
+  .jp-OutputArea-child {
+    flex-direction: column;
+  }
+
   .jp-OutputPrompt {
-    display: table-row;
+    flex: 0 0 auto;
     text-align: left;
   }
 
   .jp-OutputArea-child .jp-OutputArea-output {
-    display: table-row;
     margin-left: var(--jp-notebook-padding);
   }
 }