From cc15654f2ed449cfcd9f510336ffd8bcc846f93d Mon Sep 17 00:00:00 2001
From: Oleg Isonen <oleg008@gmail.com>
Date: Tue, 14 Jun 2022 12:51:45 +0200
Subject: [PATCH] ensure min height directly on the empty element, which
 automatically goes away once there is a node inside

---
 app/canvas/features/wrapper-component/use-css.tsx     | 2 ++
 app/shared/canvas-components/primitives/box.tsx       | 5 -----
 app/shared/canvas-components/primitives/heading.tsx   | 8 +-------
 app/shared/canvas-components/primitives/paragraph.tsx | 8 +-------
 4 files changed, 4 insertions(+), 19 deletions(-)

diff --git a/app/canvas/features/wrapper-component/use-css.tsx b/app/canvas/features/wrapper-component/use-css.tsx
index 4e664fc23a..cf48cc81e4 100644
--- a/app/canvas/features/wrapper-component/use-css.tsx
+++ b/app/canvas/features/wrapper-component/use-css.tsx
@@ -50,6 +50,8 @@ const emptyStyle = {
   "&:empty": {
     outline: "1px dashed #555",
     outlineOffset: -1,
+    paddingTop: "$8",
+    paddingRight: "$8",
   },
 };
 
diff --git a/app/shared/canvas-components/primitives/box.tsx b/app/shared/canvas-components/primitives/box.tsx
index 84a531834f..70246d083c 100644
--- a/app/shared/canvas-components/primitives/box.tsx
+++ b/app/shared/canvas-components/primitives/box.tsx
@@ -3,11 +3,6 @@ export { SquareIcon as Icon } from "~/shared/icons";
 
 // Webstudio specific default styles for the node type.
 export const defaultStyle: Style = {
-  minHeight: {
-    type: "unit",
-    unit: "px",
-    value: 100,
-  },
   boxSizing: {
     type: "keyword",
     value: "border-box",
diff --git a/app/shared/canvas-components/primitives/heading.tsx b/app/shared/canvas-components/primitives/heading.tsx
index c3adb29350..4fd1c7fc01 100644
--- a/app/shared/canvas-components/primitives/heading.tsx
+++ b/app/shared/canvas-components/primitives/heading.tsx
@@ -2,13 +2,7 @@ import { type Style, components } from "@webstudio-is/sdk";
 export { HeadingIcon as Icon } from "~/shared/icons";
 
 // Webstudio specific default styles for the node type.
-export const defaultStyle: Style = {
-  minHeight: {
-    type: "unit",
-    unit: "em",
-    value: 1,
-  },
-};
+export const defaultStyle: Style = {};
 
 export const children = ["Heading you can edit"];
 
diff --git a/app/shared/canvas-components/primitives/paragraph.tsx b/app/shared/canvas-components/primitives/paragraph.tsx
index c48b2b0539..c244294c8e 100644
--- a/app/shared/canvas-components/primitives/paragraph.tsx
+++ b/app/shared/canvas-components/primitives/paragraph.tsx
@@ -2,13 +2,7 @@ import { type Style, components } from "@webstudio-is/sdk";
 export { TextAlignLeftIcon as Icon } from "~/shared/icons";
 
 // Webstudio specific default styles for the node type.
-export const defaultStyle: Style = {
-  minHeight: {
-    type: "unit",
-    unit: "em",
-    value: 1,
-  },
-};
+export const defaultStyle: Style = {};
 
 export const children = ["Pragraph you can edit"];