refactor: style element

Nexters · Aug 15, 2024 · 1e6338d · 1e6338d
1 parent 3556d41
commit 1e6338d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git 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
@@ -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,
       )}