From 2f0d79ce633e1b47e8d9477516dc959fc66d59e2 Mon Sep 17 00:00:00 2001
From: Oleg Isonen <oleg008@gmail.com>
Date: Fri, 8 Jul 2022 23:35:45 +0200
Subject: [PATCH 1/2] weird margin fix above the root container on canvas

---
 apps/designer/app/shared/db/tree.server.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/apps/designer/app/shared/db/tree.server.ts b/apps/designer/app/shared/db/tree.server.ts
index 26784ddcef..2cad3f22be 100644
--- a/apps/designer/app/shared/db/tree.server.ts
+++ b/apps/designer/app/shared/db/tree.server.ts
@@ -19,6 +19,11 @@ export const createRootInstance = (breakpoints: Array<Breakpoint>) => {
       {
         breakpoint: defaultBreakpoint.id,
         style: {
+          // Fixes a weird margin above the root when first node has margin.
+          overflow: {
+            type: "keyword",
+            value: "auto",
+          },
           backgroundColor: {
             type: "keyword",
             value: "white",

From 0ffb2421e4faaca0458907b26b2aaebc6bcf6e2e Mon Sep 17 00:00:00 2001
From: Oleg Isonen <oleg008@gmail.com>
Date: Fri, 22 Jul 2022 13:36:27 +0200
Subject: [PATCH 2/2] workaround for margin collapsing

---
 apps/designer/app/shared/db/tree.server.ts | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/apps/designer/app/shared/db/tree.server.ts b/apps/designer/app/shared/db/tree.server.ts
index 2cad3f22be..35df542465 100644
--- a/apps/designer/app/shared/db/tree.server.ts
+++ b/apps/designer/app/shared/db/tree.server.ts
@@ -19,11 +19,6 @@ export const createRootInstance = (breakpoints: Array<Breakpoint>) => {
       {
         breakpoint: defaultBreakpoint.id,
         style: {
-          // Fixes a weird margin above the root when first node has margin.
-          overflow: {
-            type: "keyword",
-            value: "auto",
-          },
           backgroundColor: {
             type: "keyword",
             value: "white",
@@ -51,6 +46,10 @@ export const createRootInstance = (breakpoints: Array<Breakpoint>) => {
             unit: "vh",
             value: 100,
           },
+          display: {
+            type: "keyword",
+            value: "flex",
+          },
           flexDirection: {
             type: "keyword",
             value: "column",