Better overlay of stat elem

SeanSun6814 · Mar 27, 2023 · 0bc3d8b · 0bc3d8b
1 parent 6fe4d9e
commit 0bc3d8b
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
   "description": "My Electron application description",
   "keywords": [],
   "main": "./src/main.js",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "author": "Sean Sun",
   "scripts": {
     "start": "electron .",

diff --git a/src/style.css b/src/style.css
@@ -103,9 +103,10 @@ body {
 }
 
 #myColumns {
-    top: 100px;
+    top: 85px;
     left: 0px;
     position: absolute;
+    padding-top: 15px;
     height: calc(100% - 100px);
     width: 100%;
     overflow-x: scroll;

diff --git a/src/utils.js b/src/utils.js
@@ -189,15 +189,17 @@ function createStatElem(item) {
   statElem.classList.add("liStats");
   statElem.setAttribute("id", "statElem");
   statElem.innerHTML = str;
-  document.body.appendChild(statElem);
+  myColumns.appendChild(statElem);
   updateStatElemPos(item.html, statElem);
 }
 
 function updateStatElemPos(elem, statElem) {
   let top = elem.getBoundingClientRect().top;
   top += elem.getBoundingClientRect().height / 2.0;
   top -= statElem.getBoundingClientRect().height / 2.0;
-  let left = elem.getBoundingClientRect().left + elem.getBoundingClientRect().width + 10;
+  top -= 85; // subtract the "top" of #myColumns
+  let left = elem.getBoundingClientRect().left + myColumns.scrollLeft + elem.getBoundingClientRect().width + 10;
+  // add myColumns.scrollLeft since the statElem is a child of myColumns, not body
   statElem.style.position = "absolute";
   statElem.style.top = top + "px";
   statElem.style.left = left + "px";