From 539dc828447952d54637abfdf1e4282dc851a006 Mon Sep 17 00:00:00 2001 From: Aleksey Novikov Date: Tue, 9 Jul 2024 19:13:59 +0300 Subject: [PATCH] #8528 Radiogroup items appear in a single column regardless of the colCount property value when the Panelless theme mode is enabled Fixes #8528 --- src/defaultV2-theme/blocks/sd-title.scss | 4 + ...stion-selectbase-zero-column-panelless.png | Bin 0 -> 4552 bytes .../tests/defaultV2/selectbase.ts | 78 ++++++++++++++++++ 3 files changed, 82 insertions(+) create mode 100644 visualRegressionTests/tests/defaultV2/etalons/question-selectbase-zero-column-panelless.png diff --git a/src/defaultV2-theme/blocks/sd-title.scss b/src/defaultV2-theme/blocks/sd-title.scss index c3a099fd44..643bace6f9 100644 --- a/src/defaultV2-theme/blocks/sd-title.scss +++ b/src/defaultV2-theme/blocks/sd-title.scss @@ -96,6 +96,10 @@ } } +.sd-root--compact .sd-title .sv-title-actions { + width: 100%; +} + .sd-action-title-bar { flex: 1 9 auto; min-width: calcSize(6); diff --git a/visualRegressionTests/tests/defaultV2/etalons/question-selectbase-zero-column-panelless.png b/visualRegressionTests/tests/defaultV2/etalons/question-selectbase-zero-column-panelless.png new file mode 100644 index 0000000000000000000000000000000000000000..a4f5858c865eeda6a02b98e36b9a028628184474 GIT binary patch literal 4552 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 literal 0 HcmV?d00001 diff --git a/visualRegressionTests/tests/defaultV2/selectbase.ts b/visualRegressionTests/tests/defaultV2/selectbase.ts index 5d0c2139d5..5b092f88b1 100644 --- a/visualRegressionTests/tests/defaultV2/selectbase.ts +++ b/visualRegressionTests/tests/defaultV2/selectbase.ts @@ -155,4 +155,82 @@ frameworks.forEach(framework => { }); }); + + test("Check rating smileys scale colored question themes", async (t) => { + await wrapVisualTest(t, async (t, comparer) => { + await t.resizeWindow(1920, 1080); + const focusBody = ClientFunction(() => { document.body.focus(); }); + + await initSurvey(framework, { + "logoPosition": "right", + "pages": [ + { + "name": "page1", + "elements": [ + { + "type": "radiogroup", + "name": "question1", + "startWithNewLine": false, + "title": "question1", + "choices": [ + "option1", + "option2", + "option3" + ], + "colCount": 3 + } + ], + "title": "Personal Information" + } + ] + }); + + await ClientFunction(() => { + const themeJson = { + "themeName": "default", + "colorPalette": "light", + "isPanelless": true, + "cssVariables": { + "--sjs-corner-radius": "4px", + "--sjs-base-unit": "8px", + "--sjs-shadow-small": "0px 1px 2px 0px rgba(0, 0, 0, 0.15)", + "--sjs-shadow-inner": "inset 0px 1px 2px 0px rgba(0, 0, 0, 0.15)", + "--sjs-border-default": "rgba(0, 0, 0, 0.16)", + "--sjs-border-light": "rgba(0, 0, 0, 0.09)", + "--sjs-general-backcolor": "rgba(255, 255, 255, 1)", + "--sjs-general-backcolor-dark": "rgba(248, 248, 248, 1)", + "--sjs-general-backcolor-dim-light": "rgba(249, 249, 249, 1)", + "--sjs-general-backcolor-dim-dark": "rgba(243, 243, 243, 1)", + "--sjs-general-forecolor": "rgba(0, 0, 0, 0.91)", + "--sjs-general-forecolor-light": "rgba(0, 0, 0, 0.45)", + "--sjs-general-dim-forecolor": "rgba(0, 0, 0, 0.91)", + "--sjs-general-dim-forecolor-light": "rgba(0, 0, 0, 0.45)", + "--sjs-secondary-backcolor": "rgba(255, 152, 20, 1)", + "--sjs-secondary-backcolor-light": "rgba(255, 152, 20, 0.1)", + "--sjs-secondary-backcolor-semi-light": "rgba(255, 152, 20, 0.25)", + "--sjs-secondary-forecolor": "rgba(255, 255, 255, 1)", + "--sjs-secondary-forecolor-light": "rgba(255, 255, 255, 0.25)", + "--sjs-shadow-small-reset": "0px 0px 0px 0px rgba(0, 0, 0, 0.15)", + "--sjs-shadow-medium": "0px 2px 6px 0px rgba(0, 0, 0, 0.1)", + "--sjs-shadow-large": "0px 8px 16px 0px rgba(0, 0, 0, 0.1)", + "--sjs-shadow-inner-reset": "inset 0px 0px 0px 0px rgba(0, 0, 0, 0.15)", + "--sjs-border-inside": "rgba(0, 0, 0, 0.16)", + "--sjs-general-backcolor-dim": "rgba(255, 255, 255, 1)", + "--sjs-primary-backcolor": "rgba(25, 179, 148, 1)", + "--sjs-primary-backcolor-dark": "rgba(20, 164, 139, 1)", + "--sjs-primary-backcolor-light": "rgba(25, 179, 148, 0.1)", + "--sjs-primary-forecolor": "rgba(255, 255, 255, 1)", + "--sjs-primary-forecolor-light": "rgba(255, 255, 255, 0.25)", + "--sjs-special-red": "rgba(229, 10, 62, 1)", + "--sjs-special-red-light": "rgba(229, 10, 62, 0.1)" + }, + }; + window["survey"].applyTheme(themeJson); + })(); + + const questionRoot = Selector(".sd-question .sd-question__content"); + await focusBody(); + await takeElementScreenshot("question-selectbase-zero-column-panelless", questionRoot, t, comparer); + }); + }); }); \ No newline at end of file