diff --git a/src/defaultV2-theme/blocks/sd-table.scss b/src/defaultV2-theme/blocks/sd-table.scss index 4f61332087..2adeba9bb4 100644 --- a/src/defaultV2-theme/blocks/sd-table.scss +++ b/src/defaultV2-theme/blocks/sd-table.scss @@ -40,51 +40,55 @@ .sd-table--no-header { padding-top: calcSize(3); } - -.sd-panel__content { - .sd-table--no-header { - padding-top: 0; - } - - .sd-question--table { - .sd-question__content { - padding-top: calcSize(0); +.sd-panel:not(.sd-panel--as-page) { + &>.sd-panel__content { + .sd-table--no-header { + padding-top: 0; } - &>.sd-question__header { - &+.sd-question__content { - padding-top: calcSize(2); + .sd-question--table { + .sd-question__content { + padding-bottom: calcSize(0.25); + margin-bottom: calcSize(-0.25); + padding-top: calcSize(1); + margin-top: calcSize(-1); + } + + &>.sd-question__header { + &+.sd-question__content { + padding-top: calcSize(2); - .sd-table--no-header { - padding-top: calcSize(4); + .sd-table--no-header { + padding-top: calcSize(4); + } } } } - } - .sd-question--table>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { - margin-top: calcSize(-3); - } + .sd-question--table>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { + margin-top: calcSize(-3); + } - .sd-question--table.sd-question--error-top>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { - margin-top: 0; - } + .sd-question--table.sd-question--error-top>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { + margin-top: 0; + } - &>.sd-row:not(:first-of-type) .sd-question--table>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { - margin-top: calcSize(-2); - } + &>.sd-row:not(:first-of-type) .sd-question--table>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { + margin-top: calcSize(-2); + } - &>.sd-row:not(:first-of-type) .sd-question--table.sd-question--error-top>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { - margin-top: calcSize(0); - } + &>.sd-row:not(:first-of-type) .sd-question--table.sd-question--error-top>.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { + margin-top: calcSize(0); + } - .sd-question--table>.sd-question__header+.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { - margin-top: calcSize(1); - } + .sd-question--table>.sd-question__header+.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { + margin-top: calcSize(1); + } - &>.sd-row:not(:first-of-type) .sd-question--table>.sd-question__header+.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { - margin-top: calcSize(1); + &>.sd-row:not(:first-of-type) .sd-question--table>.sd-question__header+.sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) { + margin-top: calcSize(1); + } } } @@ -384,13 +388,6 @@ min-width: auto; overflow-x: auto; } - - &>.sd-question__content { - padding-bottom: calcSize(0.25); - margin-bottom: calcSize(-0.25); - padding-top: calcSize(1); - margin-top: calcSize(-1); - } } &.sd-element--nested>.sd-question__content, diff --git a/visualRegressionTests/tests/defaultV2/etalons/question-matrix--single-page.png b/visualRegressionTests/tests/defaultV2/etalons/question-matrix--single-page.png new file mode 100644 index 0000000000..a5ae6d1e5d Binary files /dev/null and b/visualRegressionTests/tests/defaultV2/etalons/question-matrix--single-page.png differ diff --git a/visualRegressionTests/tests/defaultV2/matrix.ts b/visualRegressionTests/tests/defaultV2/matrix.ts index c1af46a62c..d83668f145 100644 --- a/visualRegressionTests/tests/defaultV2/matrix.ts +++ b/visualRegressionTests/tests/defaultV2/matrix.ts @@ -1095,4 +1095,58 @@ frameworks.forEach(framework => { }); }); + test("Matrix in single page mode", async (t) => { + await wrapVisualTest(t, async (t, comparer) => { + await t.resizeWindow(800, 600); + await initSurvey(framework, { + "pages": [ + { + "name": "page1", + "elements": [ + { + "type": "matrix", + "name": "question1", + "titleLocation": "hidden", + "columns": [ + "Column 1", + "Column 2", + "Column 3" + ], + "rows": [ + "Row 1", + "Row 2" + ] + } + ] + }, + { + "name": "page2", + "elements": [ + { + "type": "matrix", + "name": "question2", + "titleLocation": "hidden", + "columns": [ + "Column 1", + "Column 2", + "Column 3" + ], + "rows": [ + "Row 1", + "Row 2" + ] + } + ] + } + ], + "questionsOnPageMode": "singlePage", + "focusFirstQuestionAutomatic": false, + "widthMode": "static" + }); + //await t.click(Selector("body"), { offsetX: 5, offsetY: 5 }); + const pageElement = Selector(".sd-page"); + + await takeElementScreenshot("question-matrix--single-page.png", pageElement, t, comparer); + }); + }); });