style(studio): keep StudioRightPanel under the 600 line cap

This commit is contained in:
Miguel Angel Simon Sierra
2026-07-28 16:44:43 +02:00
parent 4e74eefddd
commit bb24d0037a
@@ -446,8 +446,7 @@ export function StudioRightPanel({
return ( return (
<> <>
{/* Vertical resize divider: 3px visible seam, 13px pointer-capture zone via {/* Vertical resize divider: 3px visible seam, 13px hit zone via the inner div. */}
the absolutely-positioned inner hit area. */}
<div <div
role="separator" role="separator"
aria-label="Resize inspector panel" aria-label="Resize inspector panel"
@@ -467,11 +466,9 @@ export function StudioRightPanel({
adjustPanelWidth("right", delta); adjustPanelWidth("right", delta);
}} }}
> >
{/* Expanded hit zone, deliberately asymmetric: 8px into the preview pane's {/* Asymmetric hit zone: 8px into the preview's p-2 gutter (the only dead
p-2 stage gutter (the only dead space here), the 3px seam, then 2px space), the 3px seam, 2px into the card. Stops short of the 24px WCAG
into the inspector card. It stops at 13px rather than the 24px WCAG 2.2 2.5.8 target because the next pixel each way is live. */}
(2.5.8) target because the next pixel on either side is live: the
preview stage on the left, the inspector's own controls on the right. */}
<div className="absolute inset-y-0 -left-[8px] w-[13px]" /> <div className="absolute inset-y-0 -left-[8px] w-[13px]" />
{/* Visible hairline */} {/* Visible hairline */}
<div className="absolute top-1/2 left-0 h-[52px] w-[3px] -translate-y-1/2 bg-white/12 transition-colors group-hover:bg-white/18 group-active:bg-white/24" /> <div className="absolute top-1/2 left-0 h-[52px] w-[3px] -translate-y-1/2 bg-white/12 transition-colors group-hover:bg-white/18 group-active:bg-white/24" />