diff --git a/packages/survey-creator-core/src/components/question.scss b/packages/survey-creator-core/src/components/question.scss
index 8d4315077..940bc5347 100644
--- a/packages/survey-creator-core/src/components/question.scss
+++ b/packages/survey-creator-core/src/components/question.scss
@@ -153,11 +153,6 @@ svc-question {
user-select: all;
pointer-events: all;
}
-
- .sd-question__header--hidden,
- .svc-question__header--hidden {
- padding-bottom: calcSize(1);
- }
}
.svc-question__content>div,
@@ -604,6 +599,26 @@ svc-question,
z-index: 1;
}
+.svc-element__header--hidden {
+ display: block;
+ padding-bottom: calcSize(1);
+ box-sizing: border-box;
+ .svc-string-editor,
+ .svc-fake-title,
+ sv-ng-string>.svc-string-editor{
+ display: inline-flex;
+ &::before {
+ content: '('
+ }
+ &::after {
+ content: ')'
+ }
+ }
+ .svc-element__title--hidden {
+ display: none;
+ }
+}
+
.svc-question__adorner {
.svc-question__content--collapsed {
&>* {
@@ -627,32 +642,11 @@ svc-question,
display: none;
}
- &.sd-panel__header--hidden,
- &.sd-question__header--hidden,
- &.svc-question__header--hidden {
+ &.svc-element__header--hidden {
display: block;
}
-
- .sd-element__title,
- .sd-title.sd-element__title {
-
- &.sd-element__title--hidden,
- &.svc-element__title--hidden {
- display: block;
-
- &>.svc-string-editor,
- &>sv-ng-string>.svc-string-editor {
- display: inline-flex;
-
- &::before {
- content: "(";
- }
-
- &::after {
- content: ")";
- }
- }
- }
+ .svc-element__title--hidden {
+ display: block;
}
}
}
@@ -1043,9 +1037,7 @@ svc-question,
.svc-question__content.svc-question__content--collapsed {
.sd-element--complex>.sd-element__header--location-top {
- &.sd-panel__header--hidden,
- &.sd-question__header--hidden,
- &.svc-question__header--hidden {
+ &.svc-element__header--hidden {
padding: 0;
}
}
@@ -1060,9 +1052,7 @@ svc-question,
padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
padding-top: 0;
- &.sd-panel__header--hidden,
- &.sd-question__header--hidden,
- &.svc-question__header--hidden {
+ &.svc-element__header--hidden {
padding-bottom: calcSize(1);
}
diff --git a/packages/survey-creator-core/src/components/question.ts b/packages/survey-creator-core/src/components/question.ts
index 9a6e20022..c7968c3e0 100644
--- a/packages/survey-creator-core/src/components/question.ts
+++ b/packages/survey-creator-core/src/components/question.ts
@@ -190,7 +190,7 @@ export class QuestionAdornerViewModel extends SurveyElementAdornerBase {
return (this.element)?.getPropertyValue("isMessagePanelVisible");
}
get cssCollapsedHiddenHeader(): string {
- return (this.element as PanelModel | Question).cssHeader + " svc-question__header--hidden";
+ return (this.element as PanelModel | Question).cssHeader + " svc-element__header--hidden";
}
get cssCollapsedHiddenTitle(): string {
return this.element.cssTitle + " svc-element__title--hidden";
@@ -294,6 +294,9 @@ export class QuestionAdornerViewModel extends SurveyElementAdornerBase {
return false;
}
+ public get showHiddenTitle() {
+ return !this.element.hasTitle && this.element.isInteractiveDesignElement;
+ }
public get placeholderText(): string {
if (this.surveyElement instanceof QuestionHtmlModel) {
return getLocString("ed.htmlPlaceHolder");
diff --git a/packages/survey-creator-core/src/components/tabs/designer.scss b/packages/survey-creator-core/src/components/tabs/designer.scss
index 69a8ac350..2cac50d33 100644
--- a/packages/survey-creator-core/src/components/tabs/designer.scss
+++ b/packages/survey-creator-core/src/components/tabs/designer.scss
@@ -42,10 +42,6 @@ svc-tab-designer {
.sd-title {
display: flex;
- &.sd-element__title--hidden,
- &.svc-element__title--hidden {
- display: none;
- }
}
.sd-container-modern {
diff --git a/packages/survey-creator-knockout/src/adorners/panel.html b/packages/survey-creator-knockout/src/adorners/panel.html
index e08a82620..33decafb1 100644
--- a/packages/survey-creator-knockout/src/adorners/panel.html
+++ b/packages/survey-creator-knockout/src/adorners/panel.html
@@ -17,9 +17,20 @@
diff --git a/packages/survey-creator-knockout/src/adorners/question.html b/packages/survey-creator-knockout/src/adorners/question.html
index 6e87b687b..190cc32e6 100644
--- a/packages/survey-creator-knockout/src/adorners/question.html
+++ b/packages/survey-creator-knockout/src/adorners/question.html
@@ -16,7 +16,7 @@
diff --git a/packages/survey-creator-react/index.html b/packages/survey-creator-react/index.html
index 05aabded4..f744c41db 100644
--- a/packages/survey-creator-react/index.html
+++ b/packages/survey-creator-react/index.html
@@ -8,8 +8,8 @@
SurveyJS Creator React
-
-
+
+
diff --git a/packages/survey-creator-react/src/adorners/Question.tsx b/packages/survey-creator-react/src/adorners/Question.tsx
index 071f72778..ed8518b6e 100644
--- a/packages/survey-creator-react/src/adorners/Question.tsx
+++ b/packages/survey-creator-react/src/adorners/Question.tsx
@@ -104,12 +104,12 @@ export class QuestionAdornerComponent extends CreatorModelElement<
}
protected renderQuestionTitle(): JSX.Element {
- if (this.model.element.hasTitle || this.model.element.isPanel) return null;
+ if (!this.model.showHiddenTitle) return null;
const element = this.model.element as Question | PanelModel;
return (
- {SurveyElementBase.renderLocString(element.locTitle, null, "q_title")}
+ {element.title ? SurveyElementBase.renderLocString(element.locTitle, null, "q_title") : {element.name}}
);
diff --git a/packages/survey-creator-vue/src/adorners/Panel.vue b/packages/survey-creator-vue/src/adorners/Panel.vue
index 6f40731ac..2289cae00 100644
--- a/packages/survey-creator-vue/src/adorners/Panel.vue
+++ b/packages/survey-creator-vue/src/adorners/Panel.vue
@@ -51,6 +51,12 @@
>