From 7ca46e55bc45aff6a089416b28a719a8d285542e Mon Sep 17 00:00:00 2001 From: ciregenz Date: Wed, 10 Jun 2026 22:45:55 -0700 Subject: [PATCH] [eric] ui: resize line anchored to the chat side so the preview webview stops clipping its lower half (the real thick-at-top cause) --- frontend/src/app/pages/Views/ViewEditor.tsx | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/frontend/src/app/pages/Views/ViewEditor.tsx b/frontend/src/app/pages/Views/ViewEditor.tsx index b142fdeb..7001fe72 100644 --- a/frontend/src/app/pages/Views/ViewEditor.tsx +++ b/frontend/src/app/pages/Views/ViewEditor.tsx @@ -1072,21 +1072,21 @@ const ViewEditor: React.FC = ({ output }) => { flexShrink: 0, cursor: 'col-resize', position: 'relative', - // Above both panels so neither one's background clips the overlapping - // line (the right panel paints later and was half-covering it, which - // made the line look thicker only where the header is transparent). - zIndex: 2, bgcolor: 'transparent', transition: 'background-color 0.15s', + // Draw the line on the CHAT side of the seam, never centered. The app + // preview is an Electron (its own compositor layer that floats + // above normal DOM and ignores z-index), so a centered line had its + // right half swallowed by the webview in the body but not in the + // header, the long-standing thick-at-top look. Anchoring left of the + // seam keeps the whole line over plain DOM, so it's uniform. '&::after': { content: '""', position: 'absolute', top: 0, bottom: 0, - left: '50%', - transform: 'translateX(-50%)', + right: '50%', width: 1, - // Invisible at rest; otherwise the border line forms a T-junction with the chat header. bgcolor: 'transparent', transition: 'width 0.15s, background-color 0.15s', },