mirror/formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-03-13 11:09:29 -05:00
Code Issues Packages Projects Releases 138 Wiki Activity

fix: styling fixes (#4279)

Browse Source 
Co-authored-by: Johannes <72809645+jobenjada@users.noreply.github.com>
Co-authored-by: pandeymangg <anshuman.pandey9999@gmail.com>
This commit is contained in:
Dhruwang Jariwala
2024-11-13 16:29:01 +05:30
committed by GitHub
parent 609dcabf77
commit 9fd585ee07
10 changed files with 139 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/web/app/(app)/(survey-editor)/environments/[environmentId]/surveys/[surveyId]/edit/components/CardStylingSettings.tsx
View File

@@ -41,8 +41,8 @@ export const CardStylingSettings = ({
const surveyTypeDerived = isAppSurvey ? "App" : "Link";
const isLogoVisible = !!product.logo?.url;
const linkCardArrangement = form.watch("cardArrangement.linkSurveys") ?? "simple";
const appCardArrangement = form.watch("cardArrangement.appSurveys") ?? "simple";
const linkCardArrangement = form.watch("cardArrangement.linkSurveys") ?? "straight";
const appCardArrangement = form.watch("cardArrangement.appSurveys") ?? "straight";
const roundness = form.watch("roundness") ?? 8;
const [parent] = useAutoAnimate();

71
apps/web/app/(app)/(survey-editor)/environments/[environmentId]/surveys/[surveyId]/edit/components/StylingView.tsx
View File

@@ -2,12 +2,10 @@ import { RotateCcwIcon } from "lucide-react";
import { useTranslations } from "next-intl";
import Link from "next/link";
import React, { useEffect, useMemo, useState } from "react";
import { UseFormReturn, useForm, useWatch } from "react-hook-form";
import { UseFormReturn, useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { COLOR_DEFAULTS } from "@formbricks/lib/styling/constants";
import { TEnvironment } from "@formbricks/types/environment";
import { TProduct, TProductStyling } from "@formbricks/types/product";
import { TBaseStyling } from "@formbricks/types/styling";
import { TSurvey, TSurveyStyling } from "@formbricks/types/surveys/types";
import { AlertDialog } from "@formbricks/ui/components/AlertDialog";
import { Button } from "@formbricks/ui/components/Button";
@@ -53,50 +51,8 @@ export const StylingView = ({
}: StylingViewProps) => {
const t = useTranslations();
const stylingDefaults: TBaseStyling = useMemo(() => {
let stylingDefaults: TBaseStyling;
const isOverwriteEnabled = localSurvey.styling?.overwriteThemeStyling ?? false;
if (isOverwriteEnabled) {
const { overwriteThemeStyling, ...baseSurveyStyles } = localSurvey.styling ?? {};
stylingDefaults = baseSurveyStyles;
} else {
const { allowStyleOverwrite, ...baseProductStyles } = product.styling ?? {};
stylingDefaults = baseProductStyles;
}
return {
brandColor: { light: stylingDefaults.brandColor?.light ?? COLOR_DEFAULTS.brandColor },
questionColor: { light: stylingDefaults.questionColor?.light ?? COLOR_DEFAULTS.questionColor },
inputColor: { light: stylingDefaults.inputColor?.light ?? COLOR_DEFAULTS.inputColor },
inputBorderColor: { light: stylingDefaults.inputBorderColor?.light ?? COLOR_DEFAULTS.inputBorderColor },
cardBackgroundColor: {
light: stylingDefaults.cardBackgroundColor?.light ?? COLOR_DEFAULTS.cardBackgroundColor,
},
cardBorderColor: { light: stylingDefaults.cardBorderColor?.light ?? COLOR_DEFAULTS.cardBorderColor },
cardShadowColor: { light: stylingDefaults.cardShadowColor?.light ?? COLOR_DEFAULTS.cardShadowColor },
highlightBorderColor: stylingDefaults.highlightBorderColor?.light
? {
light: stylingDefaults.highlightBorderColor.light,
}
: undefined,
isDarkModeEnabled: stylingDefaults.isDarkModeEnabled ?? false,
roundness: stylingDefaults.roundness ?? 8,
cardArrangement: stylingDefaults.cardArrangement ?? {
linkSurveys: "simple",
appSurveys: "simple",
},
background: stylingDefaults.background,
hideProgressBar: stylingDefaults.hideProgressBar ?? false,
isLogoHidden: stylingDefaults.isLogoHidden ?? false,
};
}, [localSurvey.styling, product.styling]);
const form = useForm<TSurveyStyling>({
defaultValues: {
...localSurvey.styling,
...stylingDefaults,
},
defaultValues: localSurvey.styling ?? product.styling,
});
const overwriteThemeStyling = form.watch("overwriteThemeStyling");
@@ -133,20 +89,17 @@ export const StylingView = ({
}
}, [overwriteThemeStyling]);
const watchedValues = useWatch({
control: form.control,
});
useEffect(() => {
// @ts-expect-error
setLocalSurvey((prev) => ({
...prev,
styling: {
...prev.styling,
...watchedValues,
},
}));
}, [watchedValues, setLocalSurvey]);
form.watch((data: TSurveyStyling) => {
setLocalSurvey((prev) => ({
...prev,
styling: {
...prev.styling,
...data,
},
}));
});
}, [setLocalSurvey]);
const defaultProductStyling = useMemo(() => {
const { styling: productStyling } = product;

8
apps/web/app/(app)/environments/[environmentId]/product/look/components/ThemeStyling.tsx
View File

@@ -72,8 +72,8 @@ export const ThemeStyling = ({
isDarkModeEnabled: product.styling.isDarkModeEnabled ?? false,
roundness: product.styling.roundness ?? 8,
cardArrangement: product.styling.cardArrangement ?? {
linkSurveys: "simple",
appSurveys: "simple",
linkSurveys: "straight",
appSurveys: "straight",
},
background: product.styling.background,
hideProgressBar: product.styling.hideProgressBar ?? false,
@@ -119,8 +119,8 @@ export const ThemeStyling = ({
},
roundness: 8,
cardArrangement: {
linkSurveys: "simple",
appSurveys: "simple",
linkSurveys: "straight",
appSurveys: "straight",
},
};

4
apps/web/app/(app)/environments/[environmentId]/product/look/loading.tsx
View File

@@ -28,9 +28,9 @@ const Loading = () => {
<ProductConfigNavigation activeId="look" loading />
</PageHeader>
<SettingsCard
title="environments.product.look.theme"
title={t("environments.product.look.theme")}
className="max-w-7xl"
description="environments.product.look.theme_settings_description">
description={t("environments.product.look.theme_settings_description")}>
<div className="flex animate-pulse">
<div className="w-1/2">
<div className="flex flex-col gap-4 pr-6">

54
packages/lib/messages/de-DE.json
View File

@@ -1937,34 +1937,34 @@
"build_product_roadmap_question_2_placeholder": "Tippe deine Antwort hier...",
"card_abandonment_survey": "Umfrage zum Warenkorbabbruch",
"card_abandonment_survey_description": "Verstehe die Gründe für Warenkorbabbrüche in deinem Webshop.",
"card_abandonment_survey_question_1_button_label": "Klar!",
"card_abandonment_survey_question_1_dismiss_button_label": "Nein, danke.",
"card_abandonment_survey_question_1_headline": "Haben Sie 2 Minuten Zeit, um uns bei der Verbesserung zu helfen?",
"card_abandonment_survey_question_1_html": "<p class=\"fb-editor-paragraph\" dir=\"ltr\"><span>Wir haben bemerkt, dass Du einige Artikel in deinem Warenkorb gelassen hast. Wir würden gerne verstehen, warum.</span></p>",
"card_abandonment_survey_question_2_button_label": "Klar!",
"card_abandonment_survey_question_2_dismiss_button_label": "Nein, danke.",
"card_abandonment_survey_question_2_headline": "Was ist der Hauptgrund, warum Du deinen Kauf nicht abgeschlossen hast?",
"card_abandonment_survey_question_3_choice_1": "Hohe Versandkosten",
"card_abandonment_survey_question_3_choice_2": "Woanders einen besseren Preis gefunden",
"card_abandonment_survey_question_3_choice_3": "Ich schaue mich nur um",
"card_abandonment_survey_question_3_choice_4": "Entschieden, nicht zu kaufen",
"card_abandonment_survey_question_3_choice_5": "Problem mit der Zahlung",
"card_abandonment_survey_question_3_choice_6": "Andere",
"card_abandonment_survey_question_3_headline": "Was war der Hauptgrund, warum Du deinen Kauf nicht abgeschlossen hast?",
"card_abandonment_survey_question_3_subheader": "Bitte wähle eine der folgenden Optionen aus:",
"card_abandonment_survey_question_4_headline": "Bitte erläutere deinen Grund für den Abbruch des Kaufs:",
"card_abandonment_survey_question_5_headline": "Wie würdest Du dein gesamtes Einkaufserlebnis bewerten?",
"card_abandonment_survey_question_5_lower_label": "Sehr unzufrieden",
"card_abandonment_survey_question_5_upper_label": "Sehr zufrieden",
"card_abandonment_survey_question_6_choice_1": "Niedrigere Versandkosten",
"card_abandonment_survey_question_6_choice_2": "Rabatte oder Aktionen",
"card_abandonment_survey_question_6_choice_3": "Mehr Zahlungsmöglichkeiten",
"card_abandonment_survey_question_6_choice_4": "Bessere Produktbeschreibungen",
"card_abandonment_survey_question_6_choice_5": "Verbesserte Website-Navigation",
"card_abandonment_survey_question_6_choice_6": "Andere",
"card_abandonment_survey_question_6_headline": "Welche Faktoren würden Dich dazu ermutigen, deinen Kauf zukünftig abzuschließen?",
"card_abandonment_survey_question_6_subheader": "Bitte wähle alle zutreffenden Optionen aus:",
"card_abandonment_survey_question_7_headline": "Möchtest Du einen Rabattcode per E-Mail erhalten?",
"card_abandonment_survey_question_7_label": "Ja, sehr gerne.",
"card_abandonment_survey_question_8_headline": "Bitte teile deine E-Mail-Adresse:",
"card_abandonment_survey_question_9_headline": "Weitere Kommentare oder Vorschläge?",
"card_abandonment_survey_question_2_choice_1": "Hohe Versandkosten",
"card_abandonment_survey_question_2_choice_2": "Woanders einen besseren Preis gefunden",
"card_abandonment_survey_question_2_choice_3": "Ich schaue mich nur um",
"card_abandonment_survey_question_2_choice_4": "Entschieden, nicht zu kaufen",
"card_abandonment_survey_question_2_choice_5": "Problem mit der Zahlung",
"card_abandonment_survey_question_2_choice_6": "Andere",
"card_abandonment_survey_question_2_headline": "Was war der Hauptgrund, warum Du deinen Kauf nicht abgeschlossen hast?",
"card_abandonment_survey_question_2_subheader": "Bitte wähle eine der folgenden Optionen aus:",
"card_abandonment_survey_question_3_headline": "Bitte erläutere deinen Grund für den Abbruch des Kaufs:",
"card_abandonment_survey_question_4_headline": "Wie würdest Du dein gesamtes Einkaufserlebnis bewerten?",
"card_abandonment_survey_question_4_lower_label": "Sehr unzufrieden",
"card_abandonment_survey_question_4_upper_label": "Sehr zufrieden",
"card_abandonment_survey_question_5_choice_1": "Niedrigere Versandkosten",
"card_abandonment_survey_question_5_choice_2": "Rabatte oder Aktionen",
"card_abandonment_survey_question_5_choice_3": "Mehr Zahlungsmöglichkeiten",
"card_abandonment_survey_question_5_choice_4": "Bessere Produktbeschreibungen",
"card_abandonment_survey_question_5_choice_5": "Verbesserte Website-Navigation",
"card_abandonment_survey_question_5_choice_6": "Andere",
"card_abandonment_survey_question_5_headline": "Welche Faktoren würden Dich dazu ermutigen, deinen Kauf zukünftig abzuschließen?",
"card_abandonment_survey_question_5_subheader": "Bitte wähle alle zutreffenden Optionen aus:",
"card_abandonment_survey_question_6_headline": "Möchtest Du einen Rabattcode per E-Mail erhalten?",
"card_abandonment_survey_question_6_label": "Ja, sehr gerne.",
"card_abandonment_survey_question_7_headline": "Bitte teile deine E-Mail-Adresse:",
"card_abandonment_survey_question_8_headline": "Weitere Kommentare oder Vorschläge?",
"career_development_survey_description": "Bewerte die Mitarbeiterzufriedenheit anhand von Möglichkeiten der Weiterentwicklung.",
"career_development_survey_name": "Umfrage zur Karriereentwicklung",
"career_development_survey_question_1_headline": "Ich bin zufrieden mit den Möglichkeiten zur persönlichen und beruflichen Entwicklung bei {{productName}}.",

52
packages/lib/messages/en-US.json
View File

@@ -1937,34 +1937,34 @@
"build_product_roadmap_question_2_placeholder": "Type your answer here...",
"card_abandonment_survey": "Cart Abandonment Survey",
"card_abandonment_survey_description": "Understand the reasons behind cart abandonment in your web shop.",
"card_abandonment_survey_question_1_button_label": "Sure!",
"card_abandonment_survey_question_1_dismiss_button_label": "No, thanks.",
"card_abandonment_survey_question_1_headline": "Do you have 2 minutes to help us improve?",
"card_abandonment_survey_question_1_html": "<p class=\"fb-editor-paragraph\" dir=\"ltr\"><span>We noticed you left some items in your cart. We would love to understand why.</span></p>",
"card_abandonment_survey_question_2_button_label": "Sure!",
"card_abandonment_survey_question_2_dismiss_button_label": "No, thanks.",
"card_abandonment_survey_question_2_choice_1": "High shipping costs",
"card_abandonment_survey_question_2_choice_2": "Found a better price elsewhere",
"card_abandonment_survey_question_2_choice_3": "Just browsing",
"card_abandonment_survey_question_2_choice_4": "Decided not to buy",
"card_abandonment_survey_question_2_choice_5": "Payment issues",
"card_abandonment_survey_question_2_choice_6": "Other",
"card_abandonment_survey_question_2_headline": "What was the primary reason you didn't complete your purchase?",
"card_abandonment_survey_question_3_choice_1": "High shipping costs",
"card_abandonment_survey_question_3_choice_2": "Found a better price elsewhere",
"card_abandonment_survey_question_3_choice_3": "Just browsing",
"card_abandonment_survey_question_3_choice_4": "Decided not to buy",
"card_abandonment_survey_question_3_choice_5": "Payment issues",
"card_abandonment_survey_question_3_choice_6": "Other",
"card_abandonment_survey_question_3_headline": "What was the primary reason you didn't complete your purchase?",
"card_abandonment_survey_question_3_subheader": "Please select one of the following options:",
"card_abandonment_survey_question_4_headline": "Please elaborate on your reason for not completing the purchase:",
"card_abandonment_survey_question_5_headline": "How would you rate your overall shopping experience?",
"card_abandonment_survey_question_5_lower_label": "Very dissatisfied",
"card_abandonment_survey_question_5_upper_label": "Very satisfied",
"card_abandonment_survey_question_6_choice_1": "Lower shipping costs",
"card_abandonment_survey_question_6_choice_2": "Discounts or promotions",
"card_abandonment_survey_question_6_choice_3": "More payment options",
"card_abandonment_survey_question_6_choice_4": "Better product descriptions",
"card_abandonment_survey_question_6_choice_5": "Improved website navigation",
"card_abandonment_survey_question_6_choice_6": "Other",
"card_abandonment_survey_question_6_headline": "What factors would encourage you to complete your purchase in the future?",
"card_abandonment_survey_question_6_subheader": "Please select all that apply:",
"card_abandonment_survey_question_7_headline": "Would you like to receive a discount code via email?",
"card_abandonment_survey_question_7_label": "Yes, please reach out.",
"card_abandonment_survey_question_8_headline": "Please share your email address:",
"card_abandonment_survey_question_9_headline": "Any additional comments or suggestions?",
"card_abandonment_survey_question_2_subheader": "Please select one of the following options:",
"card_abandonment_survey_question_3_headline": "Please elaborate on your reason for not completing the purchase:",
"card_abandonment_survey_question_4_headline": "How would you rate your overall shopping experience?",
"card_abandonment_survey_question_4_lower_label": "Very dissatisfied",
"card_abandonment_survey_question_4_upper_label": "Very satisfied",
"card_abandonment_survey_question_5_choice_1": "Lower shipping costs",
"card_abandonment_survey_question_5_choice_2": "Discounts or promotions",
"card_abandonment_survey_question_5_choice_3": "More payment options",
"card_abandonment_survey_question_5_choice_4": "Better product descriptions",
"card_abandonment_survey_question_5_choice_5": "Improved website navigation",
"card_abandonment_survey_question_5_choice_6": "Other",
"card_abandonment_survey_question_5_headline": "What factors would encourage you to complete your purchase in the future?",
"card_abandonment_survey_question_5_subheader": "Please select all that apply:",
"card_abandonment_survey_question_6_headline": "Would you like to receive a discount code via email?",
"card_abandonment_survey_question_6_label": "Yes, please reach out.",
"card_abandonment_survey_question_7_headline": "Please share your email address:",
"card_abandonment_survey_question_8_headline": "Any additional comments or suggestions?",
"career_development_survey_description": "Assess employee satisfaction with career growth and development opportunities.",
"career_development_survey_name": "Career Development Survey",
"career_development_survey_question_1_headline": "I am satisfied with the opportunities for personal and professional growth at {{productName}}.",

54
packages/lib/messages/pt-BR.json
View File

@@ -1937,34 +1937,34 @@
"build_product_roadmap_question_2_placeholder": "Digite sua resposta aqui...",
"card_abandonment_survey": "Pesquisa de Abandono de Carrinho",
"card_abandonment_survey_description": "Entenda os motivos por trás do abandono de carrinho na sua loja online.",
"card_abandonment_survey_question_1_button_label": "Claro!",
"card_abandonment_survey_question_1_dismiss_button_label": "Não, valeu.",
"card_abandonment_survey_question_1_headline": "Você tem 2 minutos para nos ajudar a melhorar?",
"card_abandonment_survey_question_1_html": "Percebemos que você deixou alguns itens no seu carrinho. Adoraríamos entender o motivo.",
"card_abandonment_survey_question_2_button_label": "Claro!",
"card_abandonment_survey_question_2_dismiss_button_label": "Não, valeu.",
"card_abandonment_survey_question_2_headline": "Qual foi o principal motivo para você não ter finalizado sua compra?",
"card_abandonment_survey_question_3_choice_1": "Custos de frete altos",
"card_abandonment_survey_question_3_choice_2": "Encontrei um preço melhor em outro lugar",
"card_abandonment_survey_question_3_choice_3": "Só dando uma olhada",
"card_abandonment_survey_question_3_choice_4": "Decidi não comprar",
"card_abandonment_survey_question_3_choice_5": "Problemas com pagamento",
"card_abandonment_survey_question_3_choice_6": "outro",
"card_abandonment_survey_question_3_headline": "Qual foi o principal motivo pra você não ter finalizado a compra?",
"card_abandonment_survey_question_3_subheader": "Por favor, escolha uma das opções a seguir:",
"card_abandonment_survey_question_4_headline": "Por favor, explique o motivo de não ter concluído a compra:",
"card_abandonment_survey_question_5_headline": "Como você avaliaria sua experiência geral de compra?",
"card_abandonment_survey_question_5_lower_label": "Muito insatisfeito",
"card_abandonment_survey_question_5_upper_label": "Muito satisfeito",
"card_abandonment_survey_question_6_choice_1": "Reduzir os custos de envio",
"card_abandonment_survey_question_6_choice_2": "Descontos ou promoções",
"card_abandonment_survey_question_6_choice_3": "Mais opções de pagamento",
"card_abandonment_survey_question_6_choice_4": "Melhores descrições de produtos",
"card_abandonment_survey_question_6_choice_5": "Navegação do site melhorada",
"card_abandonment_survey_question_6_choice_6": "outro",
"card_abandonment_survey_question_6_headline": "O que te incentivaria a finalizar sua compra no futuro?",
"card_abandonment_survey_question_6_subheader": "Por favor, selecione todas as opções que se aplicam:",
"card_abandonment_survey_question_7_headline": "Você gostaria de receber um código de desconto por e-mail?",
"card_abandonment_survey_question_7_label": "Sim, por favor entre em contato.",
"card_abandonment_survey_question_8_headline": "Por favor, compartilha seu e-mail:",
"card_abandonment_survey_question_9_headline": "Algum comentário ou sugestão a mais?",
"card_abandonment_survey_question_2_choice_1": "Custos de frete altos",
"card_abandonment_survey_question_2_choice_2": "Encontrei um preço melhor em outro lugar",
"card_abandonment_survey_question_2_choice_3": "Só dando uma olhada",
"card_abandonment_survey_question_2_choice_4": "Decidi não comprar",
"card_abandonment_survey_question_2_choice_5": "Problemas com pagamento",
"card_abandonment_survey_question_2_choice_6": "outro",
"card_abandonment_survey_question_2_headline": "Qual foi o principal motivo pra você não ter finalizado a compra?",
"card_abandonment_survey_question_2_subheader": "Por favor, escolha uma das opções a seguir:",
"card_abandonment_survey_question_3_headline": "Por favor, explique o motivo de não ter concluído a compra:",
"card_abandonment_survey_question_4_headline": "Como você avaliaria sua experiência geral de compra?",
"card_abandonment_survey_question_4_lower_label": "Muito insatisfeito",
"card_abandonment_survey_question_4_upper_label": "Muito satisfeito",
"card_abandonment_survey_question_5_choice_1": "Reduzir os custos de envio",
"card_abandonment_survey_question_5_choice_2": "Descontos ou promoções",
"card_abandonment_survey_question_5_choice_3": "Mais opções de pagamento",
"card_abandonment_survey_question_5_choice_4": "Melhores descrições de produtos",
"card_abandonment_survey_question_5_choice_5": "Navegação do site melhorada",
"card_abandonment_survey_question_5_choice_6": "outro",
"card_abandonment_survey_question_5_headline": "O que te incentivaria a finalizar sua compra no futuro?",
"card_abandonment_survey_question_5_subheader": "Por favor, selecione todas as opções que se aplicam:",
"card_abandonment_survey_question_6_headline": "Você gostaria de receber um código de desconto por e-mail?",
"card_abandonment_survey_question_6_label": "Sim, por favor entre em contato.",
"card_abandonment_survey_question_7_headline": "Por favor, compartilha seu e-mail:",
"card_abandonment_survey_question_8_headline": "Algum comentário ou sugestão a mais?",
"career_development_survey_description": "Avalie a satisfação dos funcionários com o crescimento na carreira e oportunidades de desenvolvimento.",
"career_development_survey_name": "Pesquisa de Desenvolvimento de Carreira",
"career_development_survey_question_1_headline": "Estou satisfeito(a) com as oportunidades de desenvolvimento pessoal e profissional no {{productName}}.",

13
packages/lib/styling/constants.ts
View File

@@ -1,6 +1,6 @@
// https://github.com/airbnb/javascript/#naming--uppercase
import { TSurvey } from "@formbricks/types/surveys/types";
import { getDefaultEndingCard, translate } from "../templates";
import { translate } from "../templates";
export const COLOR_DEFAULTS = {
brandColor: "#64748b",
@@ -100,7 +100,16 @@ export const getPreviewSurvey = (locale: string) => {
shuffleOption: "none",
},
],
endings: [getDefaultEndingCard([], locale)],
endings: [
{
id: "cltyqp5ng000108l9dmxw6nde",
type: "endScreen",
headline: { default: translate("default_ending_card_headline", locale) },
subheader: { default: translate("default_ending_card_subheader", locale) },
buttonLabel: { default: translate("default_ending_card_button_label", locale) },
buttonLink: "https://formbricks.com",
},
],
hiddenFields: {
enabled: true,
fieldIds: [],

54
packages/lib/templates.ts
View File

@@ -107,19 +107,19 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
],
},
],
headline: { default: translate("card_abandonment_survey_question_2_headline", locale) },
headline: { default: translate("card_abandonment_survey_question_1_headline", locale) },
required: false,
buttonLabel: { default: translate("card_abandonment_survey_question_2_button_label", locale) },
buttonLabel: { default: translate("card_abandonment_survey_question_1_button_label", locale) },
buttonExternal: false,
dismissButtonLabel: {
default: translate("card_abandonment_survey_question_2_dismiss_button_label", locale),
default: translate("card_abandonment_survey_question_1_dismiss_button_label", locale),
},
},
{
id: createId(),
type: TSurveyQuestionTypeEnum.MultipleChoiceSingle,
headline: { default: translate("card_abandonment_survey_question_3_headline", locale) },
subheader: { default: translate("card_abandonment_survey_question_3_subheader", locale) },
headline: { default: translate("card_abandonment_survey_question_2_headline", locale) },
subheader: { default: translate("card_abandonment_survey_question_2_subheader", locale) },
buttonLabel: { default: translate("next", locale) },
backButtonLabel: { default: translate("back", locale) },
required: true,
@@ -127,27 +127,27 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
choices: [
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_3_choice_1", locale) },
label: { default: translate("card_abandonment_survey_question_2_choice_1", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_3_choice_2", locale) },
label: { default: translate("card_abandonment_survey_question_2_choice_2", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_3_choice_3", locale) },
label: { default: translate("card_abandonment_survey_question_2_choice_3", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_3_choice_4", locale) },
label: { default: translate("card_abandonment_survey_question_2_choice_4", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_3_choice_5", locale) },
label: { default: translate("card_abandonment_survey_question_2_choice_5", locale) },
},
{
id: "other",
label: { default: translate("card_abandonment_survey_question_3_choice_6", locale) },
label: { default: translate("card_abandonment_survey_question_2_choice_6", locale) },
},
],
},
@@ -155,7 +155,7 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
id: createId(),
type: TSurveyQuestionTypeEnum.OpenText,
headline: {
default: translate("card_abandonment_survey_question_4_headline", locale),
default: translate("card_abandonment_survey_question_3_headline", locale),
},
required: false,
buttonLabel: { default: translate("next", locale) },
@@ -165,12 +165,12 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
{
id: createId(),
type: TSurveyQuestionTypeEnum.Rating,
headline: { default: translate("card_abandonment_survey_question_5_headline", locale) },
headline: { default: translate("card_abandonment_survey_question_4_headline", locale) },
required: true,
scale: "number",
range: 5,
lowerLabel: { default: translate("card_abandonment_survey_question_5_lower_label", locale) },
upperLabel: { default: translate("card_abandonment_survey_question_5_upper_label", locale) },
lowerLabel: { default: translate("card_abandonment_survey_question_4_lower_label", locale) },
upperLabel: { default: translate("card_abandonment_survey_question_4_upper_label", locale) },
buttonLabel: { default: translate("next", locale) },
backButtonLabel: { default: translate("back", locale) },
isColorCodingEnabled: false,
@@ -179,36 +179,36 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
id: createId(),
type: TSurveyQuestionTypeEnum.MultipleChoiceMulti,
headline: {
default: translate("card_abandonment_survey_question_6_headline", locale),
default: translate("card_abandonment_survey_question_5_headline", locale),
},
subheader: { default: translate("card_abandonment_survey_question_6_subheader", locale) },
subheader: { default: translate("card_abandonment_survey_question_5_subheader", locale) },
buttonLabel: { default: translate("next", locale) },
backButtonLabel: { default: translate("back", locale) },
required: true,
choices: [
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_6_choice_1", locale) },
label: { default: translate("card_abandonment_survey_question_5_choice_1", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_6_choice_2", locale) },
label: { default: translate("card_abandonment_survey_question_5_choice_2", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_6_choice_3", locale) },
label: { default: translate("card_abandonment_survey_question_5_choice_3", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_6_choice_4", locale) },
label: { default: translate("card_abandonment_survey_question_5_choice_4", locale) },
},
{
id: createId(),
label: { default: translate("card_abandonment_survey_question_6_choice_5", locale) },
label: { default: translate("card_abandonment_survey_question_5_choice_5", locale) },
},
{
id: "other",
label: { default: translate("card_abandonment_survey_question_6_choice_6", locale) },
label: { default: translate("card_abandonment_survey_question_5_choice_6", locale) },
},
],
},
@@ -241,16 +241,16 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
},
],
type: TSurveyQuestionTypeEnum.Consent,
headline: { default: translate("card_abandonment_survey_question_7_headline", locale) },
headline: { default: translate("card_abandonment_survey_question_6_headline", locale) },
required: false,
label: { default: translate("card_abandonment_survey_question_7_label", locale) },
label: { default: translate("card_abandonment_survey_question_6_label", locale) },
buttonLabel: { default: translate("next", locale) },
backButtonLabel: { default: translate("back", locale) },
},
{
id: createId(),
type: TSurveyQuestionTypeEnum.OpenText,
headline: { default: translate("card_abandonment_survey_question_8_headline", locale) },
headline: { default: translate("card_abandonment_survey_question_7_headline", locale) },
required: true,
inputType: "email",
longAnswer: false,
@@ -261,7 +261,7 @@ const cartAbandonmentSurvey = (locale: string): TTemplate => {
{
id: reusableQuestionIds[2],
type: TSurveyQuestionTypeEnum.OpenText,
headline: { default: translate("card_abandonment_survey_question_9_headline", locale) },
headline: { default: translate("card_abandonment_survey_question_8_headline", locale) },
required: false,
inputType: "text",
buttonLabel: { default: translate("finish", locale) },

2
packages/surveys/src/lib/styles.ts
View File

@@ -33,7 +33,7 @@ export const addCustomThemeToDom = ({ styling }: { styling: TProductStyling | TS
let cssVariables = ":root {\n";
// Helper function to append the variable if it's not undefined
const appendCssVariable = (variableName: string, value: string | undefined) => {
const appendCssVariable = (variableName: string, value?: string) => {
if (value !== undefined) {
cssVariables += `--fb-${variableName}: ${value};\n`;
}