resolve #7387 Huge overlay shift on the mobile. (#7394)

Co-authored-by: OlgaLarina <olga.larina.dev@gmail.com>
surveyjs · Nov 22, 2023 · cddc7dd · cddc7dd
1 parent f4bcf8a
commit cddc7dd
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 0 deletions.
diff --git a/src/defaultV2-theme/blocks/header.scss b/src/defaultV2-theme/blocks/header.scss
@@ -20,6 +20,11 @@
   }
 }
 
+.sd-root-modern--mobile .sv-header__overlap {
+  margin-bottom: calcSize(-5);
+  padding-bottom: calcSize(2);
+}
+
 .sv-header__content {
   padding: calcSize(5);
   box-sizing: border-box;

diff --git a/visualRegressionTests/tests/defaultV2/advancedHeader.ts b/visualRegressionTests/tests/defaultV2/advancedHeader.ts
@@ -78,6 +78,12 @@ frameworks.forEach(framework => {
         });
       })();
       await takeElementScreenshot("survey-advanced-header-with-overlap.png", Selector(".sd-root-modern"), t, comparer);
+
+      await t.resizeWindow(500, 600);
+      await ClientFunction(() => {
+        (<any>window).survey.setIsMobile(true);
+      })();
+      await takeElementScreenshot("survey-advanced-header-mobile-with-overlap.png", Selector(".sd-root-modern"), t, comparer);
     });
   });
 });
diff --git a/...ionTests/tests/defaultV2/etalons/survey-advanced-header-mobile-with-overlap.png b/...ionTests/tests/defaultV2/etalons/survey-advanced-header-mobile-with-overlap.png