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,
       )}