diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/emailTemplate.test.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/emailTemplate.test.tsx index f82748776a..c79ec99988 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/emailTemplate.test.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/lib/emailTemplate.test.tsx @@ -101,7 +101,7 @@ const mockProject = { highlightBorderColor: null, cardBackgroundColor: { light: "#FFFFFF", dark: "#000000" }, cardBorderColor: { light: "#FFFFFF", dark: "#000000" }, - cardShadowColor: { light: "#FFFFFF", dark: "#000000" }, + questionColor: { light: "#FFFFFF", dark: "#000000" }, inputColor: { light: "#FFFFFF", dark: "#000000" }, inputBorderColor: { light: "#FFFFFF", dark: "#000000" }, @@ -123,7 +123,7 @@ const mockComputedStyling = { inputBorderColor: "#000000", cardBackgroundColor: "#FFFFFF", cardBorderColor: "#EEEEEE", - cardShadowColor: "#AAAAAA", + highlightBorderColor: null, thankYouCardIconColor: "#007BFF", thankYouCardIconBgColor: "#DDDDDD", diff --git a/apps/web/lib/styling/constants.ts b/apps/web/lib/styling/constants.ts index 83956b9c01..0d43306047 100644 --- a/apps/web/lib/styling/constants.ts +++ b/apps/web/lib/styling/constants.ts @@ -8,7 +8,6 @@ export const COLOR_DEFAULTS = { inputBorderColor: "#cbd5e1", cardBackgroundColor: "#ffffff", cardBorderColor: "#f8fafc", - cardShadowColor: "#000000", highlightBorderColor: "#64748b", } as const; @@ -32,9 +31,6 @@ export const defaultStyling: TProjectStyling = { cardBorderColor: { light: COLOR_DEFAULTS.cardBorderColor, }, - cardShadowColor: { - light: COLOR_DEFAULTS.cardShadowColor, - }, isLogoHidden: false, highlightBorderColor: undefined, isDarkModeEnabled: false, diff --git a/apps/web/locales/de-DE.json b/apps/web/locales/de-DE.json index d9503d1489..2a8849946e 100644 --- a/apps/web/locales/de-DE.json +++ b/apps/web/locales/de-DE.json @@ -1296,7 +1296,6 @@ "card_arrangement_for_survey_type_derived": "Kartenanordnung für {surveyTypeDerived} Umfragen", "card_background_color": "Hintergrundfarbe der Karte", "card_border_color": "Farbe des Kartenrandes", - "card_shadow_color": "Farbton des Kartenschattens", "card_styling": "Kartenstil", "casual": "Lässig", "caution_edit_duplicate": "Duplizieren & bearbeiten", @@ -1321,7 +1320,6 @@ "change_the_brand_color_of_the_survey": "Markenfarbe der Umfrage ändern.", "change_the_placement_of_this_survey": "Platzierung dieser Umfrage ändern.", "change_the_question_color_of_the_survey": "Fragefarbe der Umfrage ändern.", - "change_the_shadow_color_of_the_card": "Schattenfarbe der Karte ändern.", "changes_saved": "Änderungen gespeichert.", "character_limit_toggle_description": "Begrenzen Sie, wie kurz oder lang eine Antwort sein kann.", "character_limit_toggle_title": "Fügen Sie Zeichenbeschränkungen hinzu", @@ -2819,4 +2817,4 @@ "understand_purchase_intention_question_3_headline": "Was, wenn überhaupt, hält Dich heute davon ab, einen Kauf zu tätigen?", "understand_purchase_intention_question_3_placeholder": "Tippe deine Antwort hier..." } -} +} \ No newline at end of file diff --git a/apps/web/locales/en-US.json b/apps/web/locales/en-US.json index 67a2292633..dcc90b6bcd 100644 --- a/apps/web/locales/en-US.json +++ b/apps/web/locales/en-US.json @@ -1296,7 +1296,6 @@ "card_arrangement_for_survey_type_derived": "Card Arrangement for {surveyTypeDerived} Surveys", "card_background_color": "Card background color", "card_border_color": "Card border color", - "card_shadow_color": "Card shadow color", "card_styling": "Card Styling", "casual": "Casual", "caution_edit_duplicate": "Duplicate & edit", @@ -1321,7 +1320,6 @@ "change_the_brand_color_of_the_survey": "Change the brand color of the survey.", "change_the_placement_of_this_survey": "Change the placement of this survey.", "change_the_question_color_of_the_survey": "Change the question color of the survey.", - "change_the_shadow_color_of_the_card": "Change the shadow color of the card.", "changes_saved": "Changes saved.", "character_limit_toggle_description": "Limit how short or long an answer can be.", "character_limit_toggle_title": "Add character limits", @@ -2819,4 +2817,4 @@ "understand_purchase_intention_question_3_headline": "What, if anything, is holding you back from making a purchase today?", "understand_purchase_intention_question_3_placeholder": "Type your answer here..." } -} +} \ No newline at end of file diff --git a/apps/web/locales/fr-FR.json b/apps/web/locales/fr-FR.json index 312cb4d472..3e9fca7728 100644 --- a/apps/web/locales/fr-FR.json +++ b/apps/web/locales/fr-FR.json @@ -1296,7 +1296,6 @@ "card_arrangement_for_survey_type_derived": "Disposition des cartes pour les enquêtes {surveyTypeDerived}", "card_background_color": "Couleur de fond de la carte", "card_border_color": "Couleur de la bordure de la carte", - "card_shadow_color": "Couleur de l'ombre de la carte", "card_styling": "Style de carte", "casual": "Décontracté", "caution_edit_duplicate": "Dupliquer et modifier", @@ -1321,7 +1320,6 @@ "change_the_brand_color_of_the_survey": "Changez la couleur de la marque du sondage.", "change_the_placement_of_this_survey": "Changez le placement de cette enquête.", "change_the_question_color_of_the_survey": "Changez la couleur des questions du sondage.", - "change_the_shadow_color_of_the_card": "Changez la couleur de l'ombre de la carte.", "changes_saved": "Modifications enregistrées.", "character_limit_toggle_description": "Limitez la longueur des réponses.", "character_limit_toggle_title": "Ajouter des limites de caractères", @@ -2819,4 +2817,4 @@ "understand_purchase_intention_question_3_headline": "Qu'est-ce qui vous empêche de faire un achat aujourd'hui, s'il y a quelque chose ?", "understand_purchase_intention_question_3_placeholder": "Entrez votre réponse ici..." } -} +} \ No newline at end of file diff --git a/apps/web/locales/pt-BR.json b/apps/web/locales/pt-BR.json index e2311da469..d05822cf34 100644 --- a/apps/web/locales/pt-BR.json +++ b/apps/web/locales/pt-BR.json @@ -1296,7 +1296,6 @@ "card_arrangement_for_survey_type_derived": "Arranjo de Cartões para Pesquisas {surveyTypeDerived}", "card_background_color": "Cor de fundo do cartão", "card_border_color": "Cor da borda do cartão", - "card_shadow_color": "cor da sombra do cartão", "card_styling": "Estilização de Cartão", "casual": "Casual", "caution_edit_duplicate": "Duplicar e editar", @@ -1321,7 +1320,6 @@ "change_the_brand_color_of_the_survey": "Muda a cor da marca da pesquisa.", "change_the_placement_of_this_survey": "Muda a posição dessa pesquisa.", "change_the_question_color_of_the_survey": "Muda a cor da pergunta da pesquisa.", - "change_the_shadow_color_of_the_card": "Muda a cor da sombra do cartão.", "changes_saved": "Mudanças salvas.", "character_limit_toggle_description": "Limite o quão curta ou longa uma resposta pode ser.", "character_limit_toggle_title": "Adicionar limites de caracteres", @@ -2819,4 +2817,4 @@ "understand_purchase_intention_question_3_headline": "O que, se é que tem algo, está te impedindo de fazer a compra hoje?", "understand_purchase_intention_question_3_placeholder": "Digite sua resposta aqui..." } -} +} \ No newline at end of file diff --git a/apps/web/locales/pt-PT.json b/apps/web/locales/pt-PT.json index 2c3e699140..407a762945 100644 --- a/apps/web/locales/pt-PT.json +++ b/apps/web/locales/pt-PT.json @@ -1296,7 +1296,6 @@ "card_arrangement_for_survey_type_derived": "Arranjo de Cartões para Inquéritos {surveyTypeDerived}", "card_background_color": "Cor de fundo do cartão", "card_border_color": "Cor da borda do cartão", - "card_shadow_color": "Cor da sombra do cartão", "card_styling": "Estilo do cartão", "casual": "Casual", "caution_edit_duplicate": "Duplicar e editar", @@ -1321,7 +1320,6 @@ "change_the_brand_color_of_the_survey": "Alterar a cor da marca do inquérito", "change_the_placement_of_this_survey": "Alterar a colocação deste inquérito.", "change_the_question_color_of_the_survey": "Alterar a cor da pergunta do inquérito", - "change_the_shadow_color_of_the_card": "Alterar a cor da sombra do cartão.", "changes_saved": "Alterações guardadas.", "character_limit_toggle_description": "Limitar o quão curta ou longa uma resposta pode ser.", "character_limit_toggle_title": "Adicionar limites de caracteres", @@ -2819,4 +2817,4 @@ "understand_purchase_intention_question_3_headline": "O que, se alguma coisa, o está a impedir de fazer uma compra hoje?", "understand_purchase_intention_question_3_placeholder": "Escreva a sua resposta aqui..." } -} +} \ No newline at end of file diff --git a/apps/web/locales/zh-Hant-TW.json b/apps/web/locales/zh-Hant-TW.json index 161e5fc754..8f20c9bd03 100644 --- a/apps/web/locales/zh-Hant-TW.json +++ b/apps/web/locales/zh-Hant-TW.json @@ -1296,7 +1296,6 @@ "card_arrangement_for_survey_type_derived": "'{'surveyTypeDerived'}' 問卷的卡片排列", "card_background_color": "卡片背景顏色", "card_border_color": "卡片邊框顏色", - "card_shadow_color": "卡片陰影顏色", "card_styling": "卡片樣式設定", "casual": "隨意", "caution_edit_duplicate": "複製 & 編輯", @@ -1321,7 +1320,6 @@ "change_the_brand_color_of_the_survey": "變更問卷的品牌顏色。", "change_the_placement_of_this_survey": "變更此問卷的位置。", "change_the_question_color_of_the_survey": "變更問卷的問題顏色。", - "change_the_shadow_color_of_the_card": "變更卡片的陰影顏色。", "changes_saved": "已儲存變更。", "character_limit_toggle_description": "限制答案的長度或短度。", "character_limit_toggle_title": "新增字元限制", @@ -2819,4 +2817,4 @@ "understand_purchase_intention_question_3_headline": "有什麼阻礙您今天進行購買嗎？", "understand_purchase_intention_question_3_placeholder": "在此輸入您的答案..." } -} +} \ No newline at end of file diff --git a/apps/web/modules/ee/whitelabel/remove-branding/lib/project.test.ts b/apps/web/modules/ee/whitelabel/remove-branding/lib/project.test.ts index 7a60ff3d2e..f7dbf8bd9e 100644 --- a/apps/web/modules/ee/whitelabel/remove-branding/lib/project.test.ts +++ b/apps/web/modules/ee/whitelabel/remove-branding/lib/project.test.ts @@ -39,7 +39,7 @@ describe("updateProjectBranding", () => { inputBorderColor: { light: "#cbd5e1" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#f8fafc" }, - cardShadowColor: { light: "#000000" }, + isLogoHidden: false, isDarkModeEnabled: false, background: { bg: "#fff", bgType: "color" as const }, diff --git a/apps/web/modules/survey/editor/components/form-styling-settings.test.tsx b/apps/web/modules/survey/editor/components/form-styling-settings.test.tsx index 1e773ac93f..32856a7330 100644 --- a/apps/web/modules/survey/editor/components/form-styling-settings.test.tsx +++ b/apps/web/modules/survey/editor/components/form-styling-settings.test.tsx @@ -56,7 +56,6 @@ describe("FormStylingSettings Component", () => { inputBorderColor: { light: "#cccccc" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#eeeeee" }, - cardShadowColor: { light: "#dddddd" }, }, }) as UseFormReturn; @@ -106,7 +105,6 @@ describe("FormStylingSettings Component", () => { inputBorderColor: { light: "#cccccc" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#eeeeee" }, - cardShadowColor: { light: "#dddddd" }, }, }) as UseFormReturn; @@ -169,7 +167,6 @@ describe("FormStylingSettings Component", () => { inputBorderColor: { light: "#cccccc" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#eeeeee" }, - cardShadowColor: { light: "#dddddd" }, }, }) as UseFormReturn; @@ -215,7 +212,6 @@ describe("FormStylingSettings Component", () => { inputBorderColor: { light: "#cccccc" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#eeeeee" }, - cardShadowColor: { light: "#dddddd" }, }, }) as UseFormReturn; @@ -261,7 +257,6 @@ describe("FormStylingSettings Component", () => { inputBorderColor: { light: "#cccccc" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#eeeeee" }, - cardShadowColor: { light: "#dddddd" }, }, }) as UseFormReturn; @@ -384,7 +379,6 @@ describe("FormStylingSettings Component", () => { inputBorderColor: { light: "#cccccc" }, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#eeeeee" }, - cardShadowColor: { light: "#dddddd" }, }, }) as UseFormReturn; diff --git a/apps/web/modules/survey/editor/components/form-styling-settings.tsx b/apps/web/modules/survey/editor/components/form-styling-settings.tsx index 301a211cb0..e59db522d7 100644 --- a/apps/web/modules/survey/editor/components/form-styling-settings.tsx +++ b/apps/web/modules/survey/editor/components/form-styling-settings.tsx @@ -40,7 +40,7 @@ export const FormStylingSettings = ({ const setInputBorderColor = (color: string) => form.setValue("inputBorderColor.light", color); const setCardBackgroundColor = (color: string) => form.setValue("cardBackgroundColor.light", color); const setCardBorderColor = (color: string) => form.setValue("cardBorderColor.light", color); - const setCardShadowColor = (color: string) => form.setValue("cardShadowColor.light", color); + const setBackgroundColor = (color: string) => { form.setValue("background", { bg: color, @@ -59,7 +59,6 @@ export const FormStylingSettings = ({ setCardBackgroundColor(mixColor(brandColor, "#ffffff", 0.97)); setCardBorderColor(mixColor(brandColor, "#ffffff", 0.8)); - setCardShadowColor(brandColor); if (!background || background?.bgType === "color") { setBackgroundColor(mixColor(brandColor, "#ffffff", 0.855)); diff --git a/apps/web/modules/ui/components/card-styling-settings/index.test.tsx b/apps/web/modules/ui/components/card-styling-settings/index.test.tsx index 0dab39f2d0..d7f4826343 100644 --- a/apps/web/modules/ui/components/card-styling-settings/index.test.tsx +++ b/apps/web/modules/ui/components/card-styling-settings/index.test.tsx @@ -82,7 +82,6 @@ const TestWrapper = ({ isLogoHidden: false, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#e2e8f0" }, - cardShadowColor: { light: "#f1f5f9" }, }, }) => { const methods = useForm({ defaultValues }); @@ -109,7 +108,6 @@ const TestComponent = ({ isLogoHidden: false, cardBackgroundColor: { light: "#ffffff" }, cardBorderColor: { light: "#e2e8f0" }, - cardShadowColor: { light: "#f1f5f9" }, }, }); @@ -176,7 +174,7 @@ describe("CardStylingSettings", () => { // Check for color picker labels expect(screen.getByText("environments.surveys.edit.card_background_color")).toBeInTheDocument(); expect(screen.getByText("environments.surveys.edit.card_border_color")).toBeInTheDocument(); - expect(screen.getByText("environments.surveys.edit.card_shadow_color")).toBeInTheDocument(); + }); test("renders slider for roundness adjustment", () => { diff --git a/apps/web/modules/ui/components/card-styling-settings/index.tsx b/apps/web/modules/ui/components/card-styling-settings/index.tsx index 0974e599b7..755fb1cb34 100644 --- a/apps/web/modules/ui/components/card-styling-settings/index.tsx +++ b/apps/web/modules/ui/components/card-styling-settings/index.tsx @@ -162,28 +162,7 @@ export const CardStylingSettings = ({ )} /> - ( - -
- {t("environments.surveys.edit.card_shadow_color")} - - {t("environments.surveys.edit.change_the_shadow_color_of_the_card")} - -
- - field.onChange(color)} - containerClass="max-w-xs" - /> - - - )} - /> {}); + getSetIsError((_prev) => { }); } }, onResponseSendingFinished: () => { setIsResponseSendingFinished(true); if (getSetIsResponseSendingFinished) { - getSetIsResponseSendingFinished((_prev) => {}); + getSetIsResponseSendingFinished((_prev) => { }); } }, }, @@ -698,7 +698,6 @@ export function Survey({
diff --git a/packages/surveys/src/components/wrappers/stacked-cards-container.test.tsx b/packages/surveys/src/components/wrappers/stacked-cards-container.test.tsx index 7e43a96bec..2061731ba7 100644 --- a/packages/surveys/src/components/wrappers/stacked-cards-container.test.tsx +++ b/packages/surveys/src/components/wrappers/stacked-cards-container.test.tsx @@ -158,7 +158,7 @@ const mockProjectStyling: TProjectStyling = { cardBorderColor: { light: "#projCardBorder", dark: "#projCardBorder_dark" }, brandColor: { light: "#brand", dark: "#brand_dark" }, cardBackgroundColor: { light: "#projCardBg", dark: "#projCardBg_dark" }, - cardShadowColor: { light: "#projCardShadow", dark: "#projCardShadow_dark" }, + questionColor: { light: "#projQ", dark: "#projQ_dark" }, inputColor: { light: "#projInput", dark: "#projInput_dark" }, inputBorderColor: { light: "#projInputBorder", dark: "#projInputBorder_dark" }, diff --git a/packages/surveys/src/lib/styles.test.ts b/packages/surveys/src/lib/styles.test.ts index fd13b4688b..b5668c2c2a 100644 --- a/packages/surveys/src/lib/styles.test.ts +++ b/packages/surveys/src/lib/styles.test.ts @@ -27,7 +27,7 @@ const getBaseProjectStyling = (overrides: Partial = {}): TProje brandColor: null, cardBackgroundColor: null, cardBorderColor: null, - cardShadowColor: null, + questionColor: null, inputColor: null, inputBorderColor: null, @@ -171,7 +171,7 @@ describe("addCustomThemeToDom", () => { inputBorderColor: { light: "#DDDDDD" }, cardBackgroundColor: { light: "#EEEEEE" }, cardBorderColor: { light: "#CCCCCC" }, - cardShadowColor: { light: "#BBBBBB" }, + inputColor: { light: "#F0F0F0" }, roundness: 12, hideProgressBar: false, @@ -186,7 +186,6 @@ describe("addCustomThemeToDom", () => { expect(variables["--fb-brand-color"]).toBe("#112233"); expect(variables["--fb-focus-color"]).toBe("#112233"); expect(variables["--fb-brand-text-color"]).toBe("white"); - expect(variables["--fb-survey-shadow-color"]).toBeDefined(); // Relies on mixColor expect(variables["--fb-heading-color"]).toBe("#AABBCC"); expect(variables["--fb-subheading-color"]).toBe("#AABBCC"); expect(variables["--fb-placeholder-color"]).toBeDefined(); // Relies on mixColor @@ -280,7 +279,7 @@ describe("getBaseProjectStyling_Helper", () => { expect(baseStyling.brandColor).toBeNull(); expect(baseStyling.cardBackgroundColor).toBeNull(); expect(baseStyling.cardBorderColor).toBeNull(); - expect(baseStyling.cardShadowColor).toBeNull(); + expect(baseStyling.questionColor).toBeNull(); // Specifically testing lines highlighted by user expect(baseStyling.inputColor).toBeNull(); diff --git a/packages/surveys/src/lib/styles.ts b/packages/surveys/src/lib/styles.ts index 67eca2599d..7332c9d399 100644 --- a/packages/surveys/src/lib/styles.ts +++ b/packages/surveys/src/lib/styles.ts @@ -53,10 +53,7 @@ export const addCustomThemeToDom = ({ styling }: { styling: TProjectStyling | TS appendCssVariable("brand-text-color", "#ffffff"); } - if (styling.cardShadowColor?.light) { - // mix the shadow color with white to get a lighter shadow - appendCssVariable("survey-shadow-color", mixColor(styling.cardShadowColor.light, "#ffffff", 0.4)); - } + appendCssVariable("heading-color", styling.questionColor?.light); appendCssVariable("subheading-color", styling.questionColor?.light); diff --git a/packages/surveys/src/styles/global.css b/packages/surveys/src/styles/global.css index 5dd3141f88..3c6c085575 100644 --- a/packages/surveys/src/styles/global.css +++ b/packages/surveys/src/styles/global.css @@ -42,10 +42,6 @@ p.fb-editor-paragraph { overflow-wrap: break-word; } -.fb-survey-shadow { - box-shadow: 0px 0px 90px -40px var(--fb-survey-shadow-color); -} - /* theming */ :root { --brand-default: #64748b; @@ -79,13 +75,11 @@ p.fb-editor-paragraph { --fb-branding-text-color: var(--slate-500); --fb-survey-background-color: white; --fb-survey-border-color: var(--slate-50); - --fb-survey-shadow-color: rgba(0, 0, 0, 0.4); --fb-accent-background-color: var(--slate-200); --fb-accent-background-color-selected: var(--slate-100); --fb-input-background-color: var(--slate-50); --fb-input-background-color-selected: var(--slate-200); --fb-placeholder-color: var(--slate-400); - --fb-shadow-color: var(--slate-300); --fb-rating-fill: var(--yellow-100); --fb-rating-hover: var(--yellow-500); --fb-back-btn-border: transparent; @@ -128,4 +122,4 @@ p.fb-editor-paragraph { .grecaptcha-badge { visibility: hidden; -} +} \ No newline at end of file diff --git a/packages/surveys/tailwind.config.cjs b/packages/surveys/tailwind.config.cjs index 1c3e27c5ad..5ede99da0d 100644 --- a/packages/surveys/tailwind.config.cjs +++ b/packages/surveys/tailwind.config.cjs @@ -23,13 +23,11 @@ module.exports = { "branding-text": "var(--fb-branding-text-color)", "survey-bg": "var(--fb-survey-background-color)", "survey-border": "var(--fb-survey-border-color)", - "survey-shadow": "var(--fb-survey-shadow-color)", "accent-bg": "var(--fb-accent-background-color)", "accent-selected-bg": "var(--fb-accent-background-color-selected)", "input-bg": "var(--fb-input-background-color)", "input-bg-selected": "var(--fb-input-background-color-selected)", placeholder: "var(--fb-placeholder-color)", - shadow: "var(--fb-shadow-color)", "rating-fill": "var(--fb-rating-fill)", "rating-focus": "var(--fb-rating-hover)", "rating-selected": "var(--fb-rating-selected)", diff --git a/packages/types/styling.ts b/packages/types/styling.ts index d6f303eaf3..5dd7b5a5f0 100644 --- a/packages/types/styling.ts +++ b/packages/types/styling.ts @@ -41,7 +41,6 @@ export const ZBaseStyling = z.object({ inputBorderColor: ZStylingColor.nullish(), cardBackgroundColor: ZStylingColor.nullish(), cardBorderColor: ZStylingColor.nullish(), - cardShadowColor: ZStylingColor.nullish(), highlightBorderColor: ZStylingColor.nullish(), isDarkModeEnabled: z.boolean().nullish(), roundness: z.number().nullish(),