Kain344/History-user
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add resizable side panels for replay mode in editor page

Browse Source
This commit is contained in:
taDuc
2026-05-14 17:21:22 +07:00
parent 8fc9456a6a
commit 2ad8f9793b
1 changed files with 22 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/editor/[id]/page.tsx
+22 -2
View File
@@ -1272,7 +1272,7 @@ export default function Page() {
return (
<div style={{ display: "flex", minHeight: "100vh" }}>
{mode !== "replay" && (
{mode !== "replay" ? (
<>
<Editor
mode={mode}
@@ -1298,6 +1298,16 @@ export default function Page() {
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
title="Resize left panel"
onDrag={(deltaX) => {
@@ -1391,7 +1401,7 @@ export default function Page() {
<div style={{ flex: 1, minHeight: "100vh", background: "#0b1220" }} />
)}
{mode !== "replay" && (
{mode !== "replay" ? (
<>
<ResizeHandle
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>
);