From 2333754862f527531256ec8f0898dfe86f9ba005 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 28 Jun 2021 10:47:23 +0100
Subject: [PATCH] Update autoscreens and default layouts to use new component
 props

---
 .../store/screenTemplates/rowListScreen.js    |  4 ++++
 .../screenTemplates/utils/commonComponents.js | 19 ++++++++++++++-----
 packages/server/src/constants/screens.js      |  6 ++----
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js b/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js
index 7d7283c3d6..83b6e6a502 100644
--- a/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js
+++ b/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js
@@ -54,6 +54,10 @@ function generateTitleContainer(table) {
     .type("h2")
     .instanceName("Title")
     .text(table.name)
+    .customProps({
+      size: "M",
+      align: "left",
+    })
 
   return new Component("@budibase/standard-components/container")
     .normalStyle({
diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js b/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js
index 4d2c13355d..93361e6c11 100644
--- a/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js
+++ b/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js
@@ -25,11 +25,8 @@ export function makeLinkComponent(tableName) {
     .customProps({
       url: `/${tableName.toLowerCase()}`,
       openInNewTab: false,
-      color: "",
-      hoverColor: "",
-      underline: false,
-      fontSize: "",
-      fontFamily: "initial",
+      size: "S",
+      align: "left",
     })
 }
 
@@ -62,6 +59,10 @@ export function makeBreadcrumbContainer(tableName, text, capitalise = false) {
     .customStyle(spectrumColor(700))
     .text(">")
     .instanceName("Arrow")
+    .customProps({
+      size: "S",
+      align: "left",
+    })
 
   const textStyling = {
     color: "#000000",
@@ -77,6 +78,10 @@ export function makeBreadcrumbContainer(tableName, text, capitalise = false) {
     .customStyle(spectrumColor(700))
     .text(text)
     .instanceName("Identifier")
+    .customProps({
+      size: "S",
+      align: "left",
+    })
 
   return new Component("@budibase/standard-components/container")
     .normalStyle({
@@ -148,6 +153,10 @@ export function makeTitleContainer(title) {
     .type("h2")
     .instanceName("Title")
     .text(title)
+    .customProps({
+      size: "M",
+      align: "left",
+    })
 
   return new Component("@budibase/standard-components/container")
     .normalStyle({
diff --git a/packages/server/src/constants/screens.js b/packages/server/src/constants/screens.js
index 8e3bda5cb8..ec07b128e5 100644
--- a/packages/server/src/constants/screens.js
+++ b/packages/server/src/constants/screens.js
@@ -20,15 +20,13 @@ exports.createHomeScreen = () => ({
         _id: "ef60083f-4a02-4df3-80f3-a0d3d16847e7",
         _component: "@budibase/standard-components/heading",
         _styles: {
-          normal: {
-            "text-align": "left",
-          },
           hover: {},
           active: {},
           selected: {},
         },
         text: "Welcome to your Budibase App 👋",
-        type: "h2",
+        size: "M",
+        align: "left",
         _instanceName: "Heading",
         _children: [],
       },