From db26bf7f283921f6e20d65f9fc329435b565ce68 Mon Sep 17 00:00:00 2001
From: Stewart Allen <stewart.allen@gmail.com>
Date: Mon, 23 Feb 2026 23:57:07 -0500
Subject: [PATCH] triage cam-pop-op position, constrain widget list, add
 overflow

---
 src/kiri/mode/cam/app/init-ui.js |  7 ++++---
 web/kiri/index.css               | 19 +++++++++++++------
 2 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/kiri/mode/cam/app/init-ui.js b/src/kiri/mode/cam/app/init-ui.js
index ae2498ee..45cc809f 100644
--- a/src/kiri/mode/cam/app/init-ui.js
+++ b/src/kiri/mode/cam/app/init-ui.js
@@ -421,9 +421,10 @@ export function opRender() {
             const brect = ev.target.getBoundingClientRect();
             const prect = parent.getBoundingClientRect();
             const Prect = poprec.div.getBoundingClientRect();
-            const tdiff = prect.top - brect.top;
-            const botoff = innerHeight - (brect.top + Prect.height);
-            const offpx = -tdiff + (botoff < 0 ? botoff : -Prect.height/3);
+            const topmv = brect.top - prect.top - 20;
+            const topnu = prect.top + topmv;
+            const botof = innerHeight - (topnu + Prect.height);
+            const offpx = botof < 0 ? topmv + botof : topmv;
             poprec.div.style.transform = `translateY(${offpx}px)`;
             poprec.div.onmouseenter = () => { inside = true };
             poprec.div.onmouseleave = onLeave;
diff --git a/web/kiri/index.css b/web/kiri/index.css
index aa64d261..09ee91e0 100644
--- a/web/kiri/index.css
+++ b/web/kiri/index.css
@@ -837,6 +837,10 @@ details[open] summary::after {
 #panel-right {
     overflow: unset;
 }
+#ws-widgets {
+    max-height: 250px;
+    overflow-y: auto;
+}
 #ws-widgets, #camops, #fdm-ranges {
     padding: 0 4px 0 4px;
 }
@@ -846,6 +850,10 @@ details[open] summary::after {
 #panel-left {
     padding-right: 5px;
 }
+#panel-slide {
+    border-right: 1px solid var(--border-gray);
+    border-bottom: 1px solid var(--border-gray);
+}
 .slideshow #panel-slide {
     padding-right: 1px;
     border-right: 20px solid rgba(128,128,128,0.3);
@@ -855,9 +863,12 @@ details[open] summary::after {
     transition: transform 0.15s ease-in-out, border 0.15s ease-in-out;
 }
 .slideshow #panel-slide:hover {
+    padding-right: 0px;
     transition: transform 0.15s ease-in-out, border 0.15s ease-in-out;
     transform: translateX(0);
-    border-right: 0px solid rgba(128,128,128,0.3);
+    border-right: 1px solid var(--border-gray);
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
 }
 #panel-left, #panel-right {
     max-height: 100%;
@@ -1196,7 +1207,7 @@ details[open] summary::after {
 }
 .cam-pop-op {
     top: 0;
-    right: calc(100% + 4px);
+    right: calc(100% - 4px);
     text-align: left;
     position: absolute;
     white-space: nowrap;
@@ -2300,19 +2311,15 @@ details[open] summary::after {
     justify-self: center;
 }
 .var-row input {
-    /* flex: 1 1 auto;   */
     min-width: 0;
     max-width: 7ch;
     margin-right: 0;
     margin-bottom: 1px;
     padding-bottom: 1px;
     padding-top: 1px;
-    border: 0;
-    /* border-bottom: 1px solid; */
 }
 .var-row select {
     border: 0;
-    /* border-bottom: 1px solid; */
     border-radius: 0;
     text-align: right;
 }