fix(portal): workflows layout — canvas collapsed to 0 width
The workflows route layout used `display: flex` on the wrapper without giving the `.flow` child `flex: 1`. With Flexbox's default `flex: 0 1 auto`, the child shrunk to its non-flex content — palette (234px) + inspector (286px) = 520px — leaving the canvas wrap at width 0. Nodes, toolbar and zoom controls were positioned absolutely against a 0-wide parent so nothing painted. Fix: drop `display: flex` on the wrapper. `.flow` already has `display: flex; height: 100%` and as a block-level child it fills the width naturally. Verified via Playwright: canvas-wrap now 1168×746 and all 7 seed nodes render at expected positions. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -2,16 +2,18 @@ import type { ReactNode } from "react";
|
||||
|
||||
// Workflows is full-bleed — the editor (palette + canvas + inspector)
|
||||
// takes the entire content area, so we strip the standard `.content-inner`
|
||||
// max-width wrapper. The parent `.content` is already `overflow-y: auto`,
|
||||
// so we force `min-height: 0` here to let the editor's own grid fill.
|
||||
// max-width wrapper and pin a block container that `.flow` (display:flex,
|
||||
// height:100%) fills naturally.
|
||||
//
|
||||
// Don't make this wrapper `display: flex` — the child `.flow` would then
|
||||
// be a non-flex flex-item that shrinks to its fixed-width palette +
|
||||
// inspector and leaves the canvas at width 0.
|
||||
export default function WorkflowsLayout({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
position: "absolute",
|
||||
inset: 0,
|
||||
display: "flex",
|
||||
minHeight: 0,
|
||||
overflow: "hidden",
|
||||
}}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user