From 1e6338d01eb786d0504cb067ea9240956f4988ff Mon Sep 17 00:00:00 2001 From: bepyan <bepyan@naver.com> Date: Thu, 15 Aug 2024 20:16:43 +0900 Subject: [PATCH] refactor: style element --- src/components/editor/elements/container.tsx | 9 ++++++--- src/components/editor/elements/element-wrapper.tsx | 2 +- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/components/editor/elements/container.tsx b/src/components/editor/elements/container.tsx index 5e3c93c..bc50056 100644 --- a/src/components/editor/elements/container.tsx +++ b/src/components/editor/elements/container.tsx @@ -16,7 +16,7 @@ type Props = { element: EditorElement }; export default function Container({ element }: Props) { const { id, content, type } = element; - const { dispatch } = useEditor(); + const { editor, dispatch } = useEditor(); const isRoot = type === "__body"; const handleDragStart = (e: React.DragEvent) => { @@ -126,8 +126,11 @@ export default function Container({ element }: Props) { <ElementWrapper element={element} className={cn( - "group relative h-fit w-full max-w-full p-4 transition-all", - isRoot && "h-full overflow-visible", + "h-fit w-full max-w-full", + isRoot && "h-full overflow-y-auto", + !isRoot && + !editor.state.isPreviewMode && + "ring-1 ring-muted hover:ring-border", )} onDrop={handleDrop} onDragStart={handleDragStart} diff --git a/src/components/editor/elements/element-wrapper.tsx b/src/components/editor/elements/element-wrapper.tsx index a798296..e6482d3 100644 --- a/src/components/editor/elements/element-wrapper.tsx +++ b/src/components/editor/elements/element-wrapper.tsx @@ -36,7 +36,7 @@ export default function ElementWrapper({ ref={rootRef} style={element.styles} className={cn( - "relative w-full p-1 transition-all", + "relative w-full transition-all", !editor.state.isPreviewMode && "ring-border hover:ring-1", className, )}