From 317349ed37d317b0eed902583c248a249b220f3b Mon Sep 17 00:00:00 2001 From: Maxime Leblond <17575141+depfryer@users.noreply.github.com> Date: Tue, 27 May 2025 20:07:37 +0200 Subject: [PATCH 1/3] Update form-trigger.handlebars --- packages/cli/templates/form-trigger.handlebars | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/packages/cli/templates/form-trigger.handlebars b/packages/cli/templates/form-trigger.handlebars index 3b636b41e705a..ea608a6e3f85d 100644 --- a/packages/cli/templates/form-trigger.handlebars +++ b/packages/cli/templates/form-trigger.handlebars @@ -32,6 +32,7 @@ /* Colors */ --color-background: #fbfcfe; + --background-mobile-color: #ffffff; --color-test-notice-text: #e6a23d; --color-test-notice-bg: #fefaf6; --color-test-notice-border: #f6dcb7; @@ -59,7 +60,9 @@ /* Spacing */ --padding-container-top: 24px; + --padding-mobile-container: 24px; --padding-card: 24px; + --padding-mobile-card: 0px; --padding-test-notice-vertical: 12px; --padding-test-notice-horizontal: 24px; --margin-bottom-card: 16px; @@ -400,7 +403,7 @@ @media only screen and (max-width: 500px) { body { - background-color: #ffffff; + background-color: var(--background-mobile-color); } hr { display: block; @@ -408,15 +411,15 @@ .container { width: 95%; min-height: 100vh; - padding: 24px; - background-color: #ffffff; + padding: var(--padding-mobile-container); + background-color: var(--background-mobile-color); border: 0px solid var(--color-input-border); border-radius: 0px; box-shadow: 0px 0px 0px 0px #ffffff; } .card { - padding: 0px; - background-color: #ffffff; + padding: var(--padding-mobile-card); + background-color: var(--background-mobile-color); border: 0px solid var(--color-input-border); border-radius: 0px; box-shadow: 0px 0px 0px 0px #ffffff; From c8464a3ee81e5d57b6154fcc8aa8e4b285c5dc62 Mon Sep 17 00:00:00 2001 From: Maxime Leblond <17575141+depfryer@users.noreply.github.com> Date: Tue, 27 May 2025 20:07:56 +0200 Subject: [PATCH 2/3] Update form-trigger.handlebars --- packages/cli/templates/form-trigger.handlebars | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/templates/form-trigger.handlebars b/packages/cli/templates/form-trigger.handlebars index ea608a6e3f85d..30690bca1e429 100644 --- a/packages/cli/templates/form-trigger.handlebars +++ b/packages/cli/templates/form-trigger.handlebars @@ -53,7 +53,7 @@ --color-html-text: #555; --color-html-link: #FF6D5A; - /* Border Radii */ + /* Border Radius */ --border-radius-card: 8px; --border-radius-input: 6px; --border-radius-clear-btn: 50%; From c49127d9f9b2d70ebd70214c3cb2c648393d7ab6 Mon Sep 17 00:00:00 2001 From: Maxime Leblond <17575141+depfryer@users.noreply.github.com> Date: Tue, 27 May 2025 20:12:07 +0200 Subject: [PATCH 3/3] Update cssVariables.ts --- packages/nodes-base/nodes/Form/cssVariables.ts | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/packages/nodes-base/nodes/Form/cssVariables.ts b/packages/nodes-base/nodes/Form/cssVariables.ts index 2cd06dc01a329..7dac1cb16cbbc 100644 --- a/packages/nodes-base/nodes/Form/cssVariables.ts +++ b/packages/nodes-base/nodes/Form/cssVariables.ts @@ -1,8 +1,7 @@ export const cssVariables = ` :root { - --font-family: 'Open Sans', sans-serif; - --font-weight-normal: 400; - --font-weight-bold: 600; + /* Fonts */ + --font-family: "Open Sans", sans-serif; --font-size-body: 12px; --font-size-label: 14px; --font-size-test-notice: 12px; @@ -17,10 +16,10 @@ export const cssVariables = ` --font-size-html-h4: 14px; --font-size-html-h5: 12px; --font-size-html-h6: 10px; - --font-size-subheader: 14px; /* Colors */ --color-background: #fbfcfe; + --background-mobile-color: #ffffff; --color-test-notice-text: #e6a23d; --color-test-notice-bg: #fefaf6; --color-test-notice-border: #f6dcb7; @@ -39,24 +38,22 @@ export const cssVariables = ` --color-required: #ff6d5a; --color-clear-button-bg: #7e8186; --color-html-text: #555; - --color-html-link: #ff6d5a; - --color-header-subtext: #7e8186; + --color-html-link: #FF6D5A; - /* Border Radii */ + /* Border Radius */ --border-radius-card: 8px; --border-radius-input: 6px; --border-radius-clear-btn: 50%; - --card-border-radius: 8px; /* Spacing */ --padding-container-top: 24px; + --padding-mobile-container: 24px; --padding-card: 24px; + --padding-mobile-card: 0px; --padding-test-notice-vertical: 12px; --padding-test-notice-horizontal: 24px; --margin-bottom-card: 16px; --padding-form-input: 12px; - --card-padding: 24px; - --card-margin-bottom: 16px; /* Dimensions */ --container-width: 448px;