From d774a50f134a27d3c0ccaa0b1038dcc2c147cc8b Mon Sep 17 00:00:00 2001
From: Robin Scholtes <robin@theweirdscience.com>
Date: Wed, 10 May 2023 17:09:26 +1200
Subject: [PATCH] [#181] set mobile ops-dropdown to fill all space except ops
 and banner. No need for the controls at this point while scrolling the ops

---
 src/web/App.mjs                              | 4 ++--
 src/web/TODO.md                              | 2 ++
 src/web/stylesheets/components/_controls.css | 7 +------
 3 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/src/web/App.mjs b/src/web/App.mjs
index 8798c7ff..8684f51c 100755
--- a/src/web/App.mjs
+++ b/src/web/App.mjs
@@ -906,7 +906,7 @@ class App {
         const controlsHeight = 50;
         const operationsHeight = 80;
 
-        const remainingSpace = window.innerHeight - (bannerHeight+controlsHeight+operationsHeight);
+        const remainingSpace = window.innerHeight - (bannerHeight+controlsHeight+operationsHeight - 1); // - 1 is accounting for a border
 
         // equally divide among recipe, input and output
         ["recipe", "input", "output"].forEach(( div ) => {
@@ -914,7 +914,7 @@ class App {
         });
 
         // set the ops-dropdown height
-        document.getElementById("operations-dropdown").style.maxHeight = `${remainingSpace}px`;
+        document.getElementById("operations-dropdown").style.maxHeight = `${window.innerHeight - (bannerHeight+operationsHeight)}px`;
     }
 }
 
diff --git a/src/web/TODO.md b/src/web/TODO.md
index 43fe7075..1364d5fe 100644
--- a/src/web/TODO.md
+++ b/src/web/TODO.md
@@ -7,6 +7,8 @@
 - shannon entropy thingies
 - maybe a bit annoying that the fav cat opens whenever you add a new fav via icon-fav-click on mobile
 - backspace on fs view should close max view. Keep making the same mistake and navigating away when for instance recipe is expanded and double click the window to fs > resolve. Reset layout
+- remove tabs on window resizing large to small?
+- drag and drop from op to rec on desktop only working once
 
 ### JS:
 - `core/Recipe.mjs`, `core/lib/Magic.js` return imports to original
diff --git a/src/web/stylesheets/components/_controls.css b/src/web/stylesheets/components/_controls.css
index 83408211..d5c7086b 100644
--- a/src/web/stylesheets/components/_controls.css
+++ b/src/web/stylesheets/components/_controls.css
@@ -8,16 +8,11 @@
 
 #controls {
     width: 100%;
+    border-top: 1px solid var(--primary-border-colour);
     background-color: var(--secondary-background-colour);
     overflow: hidden;
 }
 
-@media only screen and (min-width: 768px) {
-    #controls {
-        border-top: 1px solid var(--primary-border-colour);
-    }
-}
-
 #controls-content {
     display: flex;
     padding: 10px 0;