feat: add resizable side panels for replay mode in editor page
This commit is contained in:
@@ -1272,7 +1272,7 @@ export default function Page() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div style={{ display: "flex", minHeight: "100vh" }}>
|
<div style={{ display: "flex", minHeight: "100vh" }}>
|
||||||
{mode !== "replay" && (
|
{mode !== "replay" ? (
|
||||||
<>
|
<>
|
||||||
<Editor
|
<Editor
|
||||||
mode={mode}
|
mode={mode}
|
||||||
@@ -1298,6 +1298,16 @@ export default function Page() {
|
|||||||
width={leftPanelWidth}
|
width={leftPanelWidth}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<ResizeHandle
|
||||||
|
title="Resize left panel"
|
||||||
|
onDrag={(deltaX) => {
|
||||||
|
setLeftPanelWidth((prev) => clampNumber(prev + deltaX, 220, 520));
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<div style={{ width: leftPanelWidth, height: "100vh", background: "#0b1220", borderRight: "1px solid #1f2937", flex: "0 0 auto" }} />
|
||||||
<ResizeHandle
|
<ResizeHandle
|
||||||
title="Resize left panel"
|
title="Resize left panel"
|
||||||
onDrag={(deltaX) => {
|
onDrag={(deltaX) => {
|
||||||
@@ -1391,7 +1401,7 @@ export default function Page() {
|
|||||||
<div style={{ flex: 1, minHeight: "100vh", background: "#0b1220" }} />
|
<div style={{ flex: 1, minHeight: "100vh", background: "#0b1220" }} />
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{mode !== "replay" && (
|
{mode !== "replay" ? (
|
||||||
<>
|
<>
|
||||||
<ResizeHandle
|
<ResizeHandle
|
||||||
title="Resize right panel"
|
title="Resize right panel"
|
||||||
@@ -1690,6 +1700,16 @@ export default function Page() {
|
|||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<ResizeHandle
|
||||||
|
title="Resize right panel"
|
||||||
|
onDrag={(deltaX) => {
|
||||||
|
setRightPanelWidth((prev) => clampNumber(prev - deltaX, 260, 720));
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div style={{ width: rightPanelWidth, height: "100vh", background: "#111827", borderLeft: "1px solid #1f2937", flex: "0 0 auto" }} />
|
||||||
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user