survey-creator-core 1.9.104 → 1.9.106

package/survey-creator-core.fontless.css

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator v1.9.104
+ * SurveyJS Creator v1.9.106
  * (c) 2015-2023 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -293,6 +293,7 @@ svc-tab-json-editor-textarea {
   display: flex;
   justify-content: center;
   width: 100%;
+  height: 100%;
 }
 
 @media screen and (-webkit-min-device-pixel-ratio: 0) {
@@ -643,14 +644,28 @@ svc-tab-test {
   background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
 }
 
-.st-properties .spg-item.spg-selectbase__label:focus-within {
-  outline: 1px dotted var(--sjs-primary-backcolor, var(--primary, #19b394));
+.st-properties {
+  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
+  flex-grow: 1;
+  padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
-.st-properties .spg-selectbase__label:focus-within {
-  outline: none;
+.st-properties .spg-table .spg-table__cell:first-of-type {
+  width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
-.st-properties .spg-panel__content .spg-row {
-  margin-top: 0;
+.st-properties .spg-table .spg-table__question-wrapper {
+  padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.st-properties .spg-table .spg-table__question-wrapper .spg-checkbox {
+  margin: 0;
+}
+.st-properties .spg-table .spg-table__question-wrapper .spg-selectbase__label {
+  gap: 0;
+}
+.st-properties .spg-table .spg-checkbox--disabled .spg-checkbox__rectangle,
+.st-properties .spg-table .spg-checkbox--disabled .spg-checkbox__rectangle:hover {
+  background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
 }
 
 .st-no-strings {
@@ -2002,22 +2017,18 @@ svc-page {
   margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
-.svc-row .sd-row--multiple {
+.svc-row .sd-row.sd-row--multiple {
   overflow: auto;
-  padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  margin-left: 0;
-  width: 100%;
+  width: calc(100% + 4 * var(--sjs-base-unit, var(--base-unit, 8px)));
   flex-wrap: nowrap;
-  background: var(--sjs-general-backcolor, var(--background, #fff));
-  box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
-  border-radius: calc(1 * var(--sjs-corner-radius, 4px));
-}
-.svc-row .sd-row--multiple > div {
-  padding-left: 0;
+  margin-top: 0;
+  padding-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-bottom: 2px;
+  margin-right: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  margin-bottom: -2px;
 }
-.svc-row .sd-row--multiple .sd-row--multiple {
+.svc-row .sd-row.sd-row--multiple .sd-row--multiple {
   overflow: unset;
 }
 
@@ -2027,6 +2038,10 @@ svc-page {
   border-radius: 0;
   padding: 2px;
   margin: -2px;
+  width: 100%;
+}
+.sd-panel .svc-row .sd-row--multiple > div {
+  padding: 0;
 }
 
 .svc-row.svc-row--ghost .svc-question__content {
@@ -2172,6 +2187,8 @@ svc-question {
 
 .svc-panel__placeholder {
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  text-wrap: wrap;
+  text-align: center;
 }
 
 .svc-question__content-actions {
@@ -2182,12 +2199,11 @@ svc-question {
   inset-inline-end: calc(3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 .svc-question__content-actions .sv-action--convertTo {
-  min-width: calc(13 * var(--sjs-base-unit, var(--base-unit, 8px)));
   max-width: max-content;
 }
-.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item {
+.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item--icon {
   max-width: 100%;
-  flex-direction: row-reverse;
+  padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 .svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__title {
   overflow: hidden;
@@ -2196,9 +2212,24 @@ svc-question {
   display: inline-block;
   justify-content: left;
 }
+.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__title::after {
+  content: " ";
+  display: inline-block;
+  margin-inline-start: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  vertical-align: bottom;
+  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 11L13 6H3L8 11Z' fill='%23ff9814'/%3E%3C/svg%3E%0A");
+}
+.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__icon use {
+  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
+}
+.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__icon:not(:last-child) {
+  display: none;
+}
 .svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__title--with-icon {
   margin-inline-start: 0;
-  margin-inline-end: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  margin-inline-end: 0;
 }
 .svc-question__content-actions .sv-action--convertTo.sv-action--hidden {
   min-width: 0;
@@ -2206,6 +2237,24 @@ svc-question {
 .svc-question__content-actions .sv-action--convertTo-last {
   margin-inline-end: auto;
 }
+.svc-question__content-actions .sv-dots {
+  width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  margin-right: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.svc-question__content-actions .sv-dots.sv-action--hidden {
+  width: 0;
+  margin: 0;
+}
+.svc-question__content-actions .sv-dots.sv-action--hidden .sv-action__content {
+  display: none;
+}
+.svc-question__content-actions .sv-dots .sv-dots__item {
+  margin-left: 0;
+}
+.svc-question__content-actions .sv-dots__item use {
+  fill: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
+}
 
 .svc-question__content:focus,
 .svc-hovered > .svc-question__content {
@@ -2237,13 +2286,12 @@ svc-question {
 }
 
 .svc-dragged-element-shortcut {
-  min-width: 100px;
   height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
   border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   background-color: var(--sjs-general-backcolor, var(--background, #fff));
   color: var(--sjs-general-forecolor, var(--foreground, #161616));
   padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-right: calc(3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   cursor: grabbing;
   position: absolute;
   z-index: 1000;
@@ -2252,7 +2300,6 @@ svc-question {
   -webkit-user-select: none;
   -ms-user-select: none;
   user-select: none;
-  max-width: 500px;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
@@ -2296,7 +2343,7 @@ svc-question {
 .svc-question__content--drag-over-left:before {
   content: " ";
   position: absolute;
-  left: -6px;
+  left: -9px;
   background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
   top: 0;
   height: 100%;
@@ -2306,13 +2353,20 @@ svc-question {
 .svc-question__content--drag-over-right:after {
   content: " ";
   position: absolute;
-  right: -6px;
+  right: -9px;
   background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
   top: 0;
   height: 100%;
   width: 2px;
 }
 
+.sd-panel .svc-question__content--drag-over-left:before {
+  left: -6px;
+}
+.sd-panel .svc-question__content--drag-over-right:after {
+  right: -6px;
+}
+
 .svc-question__content--drag-over-top:before {
   content: " ";
   position: absolute;
@@ -2355,7 +2409,7 @@ svc-question {
 .svc-question__content-actions .sv-action-bar {
   box-sizing: border-box;
   padding: 0;
-  justify-content: flex-end;
+  justify-content: center;
 }
 
 svc-question sv-action-bar,
@@ -2436,36 +2490,35 @@ svc-question .sv-action-bar,
   fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 
-.sd-panel .svc-question__content--image:not(.svc-question__content--empty),
-.sd-row--multiple .svc-question__content--image:not(.svc-question__content--empty) {
+.sd-panel .svc-question__content--image:not(.svc-question__content--empty) {
   padding-left: 1px;
   padding-right: 1px;
 }
-.sd-panel .svc-question__content .sd-table-wrapper::before,
-.sd-row--multiple .svc-question__content .sd-table-wrapper::before {
+.sd-panel .svc-question__content .sd-table-wrapper::before {
   left: calc(-1 * var(--sd-base-padding) + 1px);
 }
-.sd-panel .svc-question__content .sd-table-wrapper::after,
-.sd-row--multiple .svc-question__content .sd-table-wrapper::after {
+.sd-panel .svc-question__content .sd-table-wrapper::after {
   right: calc(-1 * var(--sd-base-padding) + 1px);
 }
-.sd-panel .svc-question__content,
-.sd-row--multiple .svc-question__content {
+.sd-panel .svc-question__content {
   border-radius: 0;
   border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
   box-shadow: none;
 }
-.sd-panel .svc-hovered .svc-question__content:not(.svc-question__content--dragged),
-.sd-row--multiple .svc-hovered .svc-question__content:not(.svc-question__content--dragged) {
+.sd-panel .svc-hovered .svc-question__content:not(.svc-question__content--dragged) {
   border: 1px solid var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
   box-shadow: 0 0 0 1px var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25))) inset;
 }
-.sd-panel .svc-question__content.svc-question__content--selected:not(.svc-question__content--dragged),
-.sd-row--multiple .svc-question__content.svc-question__content--selected:not(.svc-question__content--dragged) {
+.sd-panel .svc-question__content.svc-question__content--selected:not(.svc-question__content--dragged) {
   border: 1px solid var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
   box-shadow: 0 0 0 1px var(--sjs-secondary-backcolor, var(--secondary, #ff9814)) inset;
 }
 
+.sd-page__row.sd-row--multiple .svc-question__content--empty .sd-row__question,
+.sd-page__row.sd-row--multiple .svc-question__content--empty .sd-row__panel {
+  height: 0;
+}
+
 .sd-panel .svc-row--ghost.svc-row--ghost .svc-question__content.svc-question__content {
   border: none;
 }
@@ -2492,6 +2545,7 @@ svc-question .sv-action-bar,
   justify-content: center;
   flex-direction: column;
   padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  flex-grow: 1;
 }
 
 .svc-panel__add-new-question-container {
@@ -2511,7 +2565,6 @@ svc-question .sv-action-bar,
   line-height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   vertical-align: baseline;
   text-align: center;
-  background-color: var(--sjs-general-backcolor, var(--background, #fff));
   cursor: pointer;
   user-select: none;
   border: none;
@@ -2528,6 +2581,7 @@ svc-question .sv-action-bar,
   margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
   line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
   color: var(--sjs-primary-backcolor, var(--primary, #19b394));
+  text-wrap: nowrap;
 }
 
 .svc-panel__question-type-selector {
@@ -2557,6 +2611,10 @@ svc-question .sv-action-bar,
   background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
 }
 
+.sv-list__container .sv-action-bar-item--secondary .sv-list__item-icon use {
+  fill: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
+}
+
 .sd-panel .svc-row {
   margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
@@ -2566,8 +2624,12 @@ svc-question .sv-action-bar,
 .sd-panel .svc-row .sd-row {
   margin-top: 0;
   margin-bottom: 0;
+  gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
+.svc-question__content .sd-element__header--location-top {
+  margin-top: 0;
+}
 .svc-question__content .sd-element--complex > .sd-element__header--location-top {
   padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
   padding-top: 0;
@@ -2800,7 +2862,7 @@ svc-question .sv-action-bar,
   background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
 }
 .svc-item-value--new .sv-ranking-item__index.sv-ranking-item__index--empty:empty {
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAACCAYAAABhYU3QAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAaSURBVHgBjcABDQAACAKwa2X6b1Tghxi8UQEkAAB3NR3N2gAAAABJRU5ErkJggg==);
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xMyA3SDNWOUgxM1Y3WiIgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMC40NSIvPg0KPC9zdmc+);
 }
 
 .sv-ranking .svc-item-value-wrapper {
@@ -3036,9 +3098,6 @@ svc-question .sv-action-bar,
 .svc-question__content .sd-table__cell--detail-panel {
   padding-left: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
-.svc-question__content .sd-table__cell--detail-panel .svc-question__adorner {
-  z-index: 13;
-}
 .svd-test-results {
   font-family: var(--font-family);
   width: 80%;
@@ -4009,6 +4068,7 @@ button.spg-action-button--large {
   background-repeat: no-repeat;
   background-position: 0 0;
   line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  white-space: normal;
   background-image: url("data:image/svg+xml,%3Csvg width='24' height='20' viewBox='0 0 24 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.0336 15.4803L14.5736 1.45346C13.9936 0.487805 12.9936 0 12.0036 0C11.0136 0 10.0136 0.487805 9.43364 1.45346L0.973642 15.4803C-0.226358 17.4714 1.21364 20 3.54364 20H20.4536C22.7836 20 24.2236 17.4714 23.0236 15.4803H23.0336ZM21.3336 17.5112C21.2436 17.6605 20.9936 18.0189 20.4636 18.0189H3.54364C3.01364 18.0189 2.76364 17.6705 2.67364 17.5112C2.58364 17.3519 2.41364 16.9537 2.68364 16.5057L11.1436 2.47885C11.4036 2.04082 11.8336 1.99104 12.0036 1.99104C12.1736 1.99104 12.5936 2.04082 12.8636 2.47885L21.3136 16.5057C21.5836 16.9537 21.4136 17.3519 21.3236 17.5112H21.3336ZM13.0036 7.05824V12.0358C13.0036 12.5834 12.5536 13.0314 12.0036 13.0314C11.4536 13.0314 11.0036 12.5834 11.0036 12.0358V7.05824C11.0036 6.5107 11.4536 6.06272 12.0036 6.06272C12.5536 6.06272 13.0036 6.5107 13.0036 7.05824ZM13.0036 15.0224C13.0036 15.5699 12.5536 16.0179 12.0036 16.0179C11.4536 16.0179 11.0036 15.5699 11.0036 15.0224C11.0036 14.4749 11.4536 14.0269 12.0036 14.0269C12.5536 14.0269 13.0036 14.4749 13.0036 15.0224Z' fill='%23E60A3E'/%3E%3C/svg%3E");
 }
 
@@ -4099,6 +4159,20 @@ button.spg-action-button--large {
   box-shadow: 0 0 0 1px inset var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
 }
 
+.spg-input-container--multiline {
+  align-items: end;
+  flex-direction: column;
+  gap: 0;
+  height: auto;
+}
+.spg-input-container--multiline sv-ng-question-comment {
+  height: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.spg-input-container--multiline .spg-input-container__input {
+  box-sizing: border-box;
+  resize: none;
+}
+
 .spg-input-container__input {
   flex-grow: 1;
   width: 100%;