notebook resonspive ipad/tablet fixes

mireille-raad · mireille-raad · commit 22fa80e204e0 · 2020-12-07T21:08:32.000-05:00
diff --git a/wasm/notebook/src/index.ejs b/wasm/notebook/src/index.ejs
@@ -14,7 +14,7 @@
 <div class="d-flex">
     <div class="header item-center">RustPython 🐍 😱 🤘</div>
     <div>
-        <a target="_blank" class="mr-px-5 text-black" href="https://github.com/RustPython/RustPython/tree/master/wasm/notebook">how this works</a>
+        <a target="_blank" class="d-md-none mr-px-5 text-black" href="https://github.com/RustPython/RustPython/tree/master/wasm/notebook">how this works</a>
         <a target="_blank" class="text-black" href="https://github.com/RustPython/"> github</a>
     </div>
 </div>
@@ -30,7 +30,7 @@
             </div>
             
             <div class="nav-bar-links d-flex">
-                <a href="#" id="split-view" class="bg-light mr-px-5 text-black">split view</a>
+                <a href="#" id="split-view" class="d-md-none bg-light mr-px-5 text-black">split view</a>
                 <a href="#" id="default-view" class="bg-light mr-px-5  text-black">default view</a>
                 <a href="#" id="reader-view" class="bg-light text-black">reader view</a>
             </div>
diff --git a/wasm/notebook/src/style.css b/wasm/notebook/src/style.css
@@ -172,7 +172,7 @@ ul.list-inline li {
 input[type='url'] {
     border: 1px solid black;
     border-radius: 0px;
-    width: 85%;
+    width: 75%;
     font-size: 1rem;
     padding: 4px;
     font-family: monospace;
@@ -241,12 +241,17 @@ input[type='url'] {
     overflow: auto;
 }
 
-@media screen and (max-width: 700px) {
+@media screen and (max-width: 768px) {
     .box {
         width: 70%;
     }
 
     .popup {
         width: 70%;
     }
+
+    .d-md-none {
+        display: none;
+    }
+
 }
