From b8b9115554ae08c96b5fdf5d01b262069e52600e Mon Sep 17 00:00:00 2001
From: Dmitry <dk981234@gmail.com>
Date: Mon, 5 Feb 2024 10:28:23 +0400
Subject: [PATCH] Fix row gap in compact mode (#7803)

* Fix row-gap in compact mode

* Add vr test
---
 src/defaultV2-theme/blocks/sd-row.scss        |  17 ++++---
 .../etalons/row-multiple-compact-mode.png     | Bin 0 -> 11265 bytes
 .../tests/defaultV2/survey.ts                 |  43 ++++++++++++++++++
 3 files changed, 51 insertions(+), 9 deletions(-)
 create mode 100644 visualRegressionTests/tests/defaultV2/etalons/row-multiple-compact-mode.png

diff --git a/src/defaultV2-theme/blocks/sd-row.scss b/src/defaultV2-theme/blocks/sd-row.scss
index 6b882566fe..9eaab695e3 100644
--- a/src/defaultV2-theme/blocks/sd-row.scss
+++ b/src/defaultV2-theme/blocks/sd-row.scss
@@ -20,17 +20,17 @@
 
 .sd-page__title,
 .sd-page__description {
-  &~.sd-row.sd-page__row:not(.sd-row--compact) {
+  & ~ .sd-row.sd-page__row:not(.sd-row--compact) {
     margin-top: calcSize(3);
   }
 
-  &~.sd-page__row.sd-row--compact {
+  & ~ .sd-page__row.sd-row--compact {
     margin-top: var(--sd-base-vertical-padding);
   }
 }
 
 .sd-row.sd-page__row:not(.sd-row--compact) {
-  &~.sd-row.sd-page__row:not(.sd-row--compact) {
+  & ~ .sd-row.sd-page__row:not(.sd-row--compact) {
     margin-top: calcSize(2);
   }
 }
@@ -41,7 +41,7 @@
   width: calc(100% + var(--sd-base-padding));
   flex-wrap: wrap;
 
-  &>div {
+  & > div {
     box-sizing: border-box;
     padding-left: calcSize(2);
     display: flex;
@@ -53,14 +53,14 @@
   .sd-row--multiple {
     row-gap: var(--sd-base-vertical-padding);
 
-    &>div {
+    & > div {
       padding-left: var(--sd-base-padding);
     }
   }
 }
 
 .sd-row--multiple.sd-row--compact {
-  &>div {
+  & > div {
     padding-left: var(--sd-base-padding);
   }
 }
@@ -69,13 +69,12 @@
   margin-left: calcSize(-2);
   width: calc(100% + 2 * var(--sjs-base-unit, var(--base-unit, 8px)));
 
-
   &.sd-row--compact {
     padding: 0;
+    row-gap: var(--sd-base-vertical-padding);
     margin-left: calc(-1 * var(--sd-base-padding));
     width: calc(100% + var(--sd-base-padding));
   }
-
 }
 
 .sd-row__panel {
@@ -87,4 +86,4 @@
   box-sizing: border-box;
   width: 100%;
   white-space: nowrap;
-}
\ No newline at end of file
+}
diff --git a/visualRegressionTests/tests/defaultV2/etalons/row-multiple-compact-mode.png b/visualRegressionTests/tests/defaultV2/etalons/row-multiple-compact-mode.png
new file mode 100644
index 0000000000000000000000000000000000000000..ebe0b95ac55a7139d882c1e06d4e455ace8d9dff
GIT binary patch
literal 11265
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

literal 0
HcmV?d00001

diff --git a/visualRegressionTests/tests/defaultV2/survey.ts b/visualRegressionTests/tests/defaultV2/survey.ts
index dcfe6217ff..000e9271dc 100644
--- a/visualRegressionTests/tests/defaultV2/survey.ts
+++ b/visualRegressionTests/tests/defaultV2/survey.ts
@@ -1287,6 +1287,49 @@ frameworks.forEach(framework => {
     });
   });
 
+  test("Check multiple row in compact mode", async (t) => {
+    await wrapVisualTest(t, async (t, comparer) => {
+      await t.resizeWindow(700, 1080);
+      const json = {
+        pages: [
+          {
+            name: "p1",
+            elements: [
+              {
+                type: "text",
+                name: "q1",
+                title: "Question",
+                startWithNewLine: false
+              },
+              {
+                type: "text",
+                name: "q2",
+                title: "Question",
+                startWithNewLine: false
+              },
+              {
+                type: "text",
+                name: "q3",
+                title: "Question",
+                startWithNewLine: false
+              },
+              {
+                type: "text",
+                name: "q4",
+                title: "Question",
+                startWithNewLine: false
+              },
+            ]
+          },
+        ]
+      };
+
+      await initSurvey(framework, json);
+      await ClientFunction(() => (window as any).survey.isCompact = true)();
+      await takeElementScreenshot("row-multiple-compact-mode.png", Selector(".sd-root-modern"), t, comparer);
+    });
+  });
+
   test("Check survey logo right with empty title", async (t) => {
     await wrapVisualTest(t, async (t, comparer) => {
       await t.resizeWindow(1920, 1080);