diff --git a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-panel.scss b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-panel.scss index 49f87c0633..2f830b4338 100644 --- a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-panel.scss +++ b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-panel.scss @@ -60,7 +60,7 @@ } .spg-row--multiple { - margin-top: calcSize(1); + margin-top: var(--ctr-editor-layout-gap, calcSize(1)); } } .spg-panel__content > .spg-row:first-of-type { diff --git a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-question.scss b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-question.scss index d8a2a887cf..8ac677ad5a 100644 --- a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-question.scss +++ b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-question.scss @@ -77,7 +77,8 @@ .spg-row--multiple { & > div > .spg-row-narrow__question { - margin-top: calcSize(-1); + --thm-ctr-editor-layout-gap: var(--ctr-editor-layout-gap, #{calcSize(1)}); + margin-top: calc(-1 * var(--thm-ctr-editor-layout-gap)); } } diff --git a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-theme-builder.scss b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-theme-builder.scss index 344da57bbf..b25066bcac 100644 --- a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-theme-builder.scss +++ b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-theme-builder.scss @@ -116,23 +116,23 @@ } .sd-question--title-top .spg-paneldynamic { - margin-top: calcSize(-1); + --thm-ctr-editor-layout-gap: var(--ctr-editor-layout-gap, #{calcSize(1)}); + margin-top: calc(-1 * var(--thm-ctr-editor-layout-gap)); } - .spg-question.spg-row__question:not(.sd-question--title-top):not(.spg-question--boolean) { - margin-top: calcSize(-1); + .spg-question.spg-row__question:not(.sd-question--title-top):not(.spg-question--boolean), + .spg-question__content-coloralpha { + --thm-ctr-property-grid-form-gap: var(--ctr-property-grid-form-gap, #{calcSize(2)}); + --thm-ctr-editor-layout-gap: var(--ctr-editor-layout-gap, #{calcSize(1)}); + margin-top: calc(var(--thm-ctr-editor-layout-gap) - var(--thm-ctr-property-grid-form-gap)); } .spg-row--multiple .spg-question.spg-row__question:not(.sd-question--title-top) { margin-top: 0; } - .spg-question__content-coloralpha { - margin-top: calcSize(-1); - } - .spg-question-composite__content .spg-row:first-of-type { - margin-top: calcSize(1); + margin-top: var(--ctr-editor-layout-gap, #{calcSize(1)}); } }