From 3c3c78ee71d94842a43cb5e69e624daade41d4cc Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Thu, 21 Jan 2021 19:59:16 +0100
Subject: [PATCH 1/3] Remove javascript resizing code from editor.ts

---
 qt/aqt/data/web/js/editor.ts | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/qt/aqt/data/web/js/editor.ts b/qt/aqt/data/web/js/editor.ts
index 85483078c..0e74bdea7 100644
--- a/qt/aqt/data/web/js/editor.ts
+++ b/qt/aqt/data/web/js/editor.ts
@@ -607,12 +607,6 @@ let filterNode = function (node: Node, extendedMode: boolean): void {
     }
 };
 
-let adjustFieldsTopMargin = function (): void {
-    const topHeight = $("#topbuts").height();
-    const margin = topHeight + 8;
-    document.getElementById("fields").style.marginTop = `${margin}px`;
-};
-
 document.addEventListener("click", (evt: MouseEvent): void => {
     const src = evt.target as Element;
     if (src.tagName === "IMG") {
@@ -626,11 +620,3 @@ document.addEventListener("click", (evt: MouseEvent): void => {
         }
     }
 });
-
-window.addEventListener("resize", () => {
-    adjustFieldsTopMargin();
-});
-
-$(function (): void {
-    adjustFieldsTopMargin();
-});

From 8467b052f948cf88177bd4173adc5abe2be78f81 Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Thu, 21 Jan 2021 20:50:17 +0100
Subject: [PATCH 2/3] Remove image click event handler, as it never takes place

* className of fields will be "field clearfix", never just "field"
---
 qt/aqt/data/web/js/editor.ts | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/qt/aqt/data/web/js/editor.ts b/qt/aqt/data/web/js/editor.ts
index 0e74bdea7..a22b699ed 100644
--- a/qt/aqt/data/web/js/editor.ts
+++ b/qt/aqt/data/web/js/editor.ts
@@ -606,17 +606,3 @@ let filterNode = function (node: Node, extendedMode: boolean): void {
         }
     }
 };
-
-document.addEventListener("click", (evt: MouseEvent): void => {
-    const src = evt.target as Element;
-    if (src.tagName === "IMG") {
-        // image clicked; find contenteditable parent
-        let p = src;
-        while ((p = p.parentNode as Element)) {
-            if (p.className === "field") {
-                document.getElementById(p.id).focus();
-                break;
-            }
-        }
-    }
-});

From 431b2fde63e4a79dd0eb20f095a93335afc28976 Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Thu, 21 Jan 2021 21:20:57 +0100
Subject: [PATCH 3/3] Adjust the positioning of the editor toolarea via CSS

---
 qt/aqt/data/web/css/editor.scss | 10 ++--------
 qt/aqt/editor.py                | 12 +++++++-----
 2 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/qt/aqt/data/web/css/editor.scss b/qt/aqt/data/web/css/editor.scss
index c1bff5cf0..dc65c3e6a 100644
--- a/qt/aqt/data/web/css/editor.scss
+++ b/qt/aqt/data/web/css/editor.scss
@@ -34,12 +34,10 @@ body {
 }
 
 #topbutsOuter {
-    position: fixed;
+    position: sticky;
     top: 0;
-    padding: 2px;
     left: 0;
-    right: 0;
-    z-index: 1;
+    padding: 2px;
 }
 
 .topbut {
@@ -94,10 +92,6 @@ button.highlighted {
     }
 }
 
-#fields {
-    margin-top: 35px;
-}
-
 .dupe {
     background: var(--flag1-bg);
 }
diff --git a/qt/aqt/editor.py b/qt/aqt/editor.py
index 342bdb877..3abe0ca70 100644
--- a/qt/aqt/editor.py
+++ b/qt/aqt/editor.py
@@ -74,12 +74,14 @@ _html = """
 html { background: %s; }
 #topbutsOuter { background: %s; }
 </style>
-<div id="topbutsOuter">
-    <div id="topbuts" class="clearfix">
-%s
+<div>
+    <div id="topbutsOuter">
+        <div id="topbuts" class="clearfix">
+    %s
+        </div>
+    </div>
+    <div id="fields">
     </div>
-</div>
-<div id="fields">
 </div>
 <div id="dupes" style="display:none;">
     <a href="#" onclick="pycmd('dupes');return false;">