survey-react 1.12.11 → 1.12.13

package/defaultV2.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.11
+ * surveyjs - Survey JavaScript library v1.12.13
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -467,6 +467,21 @@ button.sv-action-bar-item {
   align-items: center;
   line-height: 0;
 }
+.sv-matrixdynamic-dragged-row .sd-table__cell.sd-table__cell--drag > div {
+  background-color: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
+  min-height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
+.sd-table__cell--header.sd-table__cell--drag,
+.sd-table__cell.sd-table__cell--drag {
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.sd-question--mobile .sd-table__cell--header.sd-table__cell--drag,
+.sd-question--mobile .sd-table__cell.sd-table__cell--drag {
+  display: none;
+}
 
 .sv-matrix-row--drag-drop-ghost-mod td {
   background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
@@ -612,6 +627,10 @@ sv-popup {
   gap: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
+.sd-root-modern--mobile .sv-popup--confirm-delete .sv-popup__body-content {
+  min-width: auto;
+}
+
 .sv-popup--overlay {
   width: 100%;
   height: var(--sv-popup-overlay-height, 100vh);
@@ -2332,8 +2351,8 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list-item__marker-icon use {
 
 .sd-element__title-expandable-svg {
   display: inline-block;
-  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  width: var(--lbr-question-panel-expand-button-icon-width, calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))));
+  height: var(--lbr-question-panel-expand-button-icon-height, calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))));
   position: absolute;
   inset-inline-start: calc(-3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   top: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -3216,13 +3235,29 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   margin-left: 0;
 }
 
+.sd-table__row:hover .sd-drag-element__svg {
+  visibility: visible;
+}
+
+.sd-table__cell.sd-table__cell--drag > div {
+  display: flex;
+  justify-content: end;
+  align-items: center;
+  margin-left: calc(-4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  width: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  background-color: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
+  min-height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
 .sd-drag-element__svg {
-  width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   display: block;
+  cursor: pointer;
+  visibility: hidden;
 }
 .sd-drag-element__svg use {
-  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
 }
 
 @keyframes borderAnimation {
@@ -3440,10 +3475,6 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 .sd-question:not(.sd-question--mobile) .sd-table--alternate-rows .sd-table__row:nth-of-type(odd) td:first-of-type .sd-item:not(.sd-item--error).sd-item--preview.sd-item--preview .sd-item__decorator {
   background-color: transparent;
 }
-.sd-question:not(.sd-question--mobile) .sd-table--alternate-rows .sd-table__row:nth-of-type(odd) > td.sd-table__cell:not(.sd-table__cell--actions) .sd-item:not(.sd-item--error).sd-radio--checked .sd-radio__control:focus + .sd-radio__decorator:after,
-.sd-question:not(.sd-question--mobile) .sd-table--alternate-rows .sd-table__row:nth-of-type(odd) td:first-of-type .sd-item:not(.sd-item--error).sd-radio--checked .sd-radio__control:focus + .sd-radio__decorator:after {
-  background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
-}
 
 .sd-table__cell {
   --sjs-internal-font-editorfont-size: var(--sjs-mobile-font-editorfont-size, var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px)));
@@ -3481,6 +3512,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 
 .sd-table__cell--item .sd-selectbase__item {
   text-align: center;
+  justify-content: center;
 }
 .sd-table__cell--item .sd-selectbase__label {
   justify-content: center;
@@ -4252,6 +4284,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 }
 
 .sd-item {
+  display: flex;
   padding: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0;
 }
 
@@ -6672,8 +6705,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 .sd-file__choose-btn--text .sv-svg-icon {
   margin-left: calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  width: 24px;
-  height: 24px;
+  width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
 }
 
@@ -8513,13 +8546,15 @@ sv-components-container,
   height: 100%;
 }
 
-.sd-root-modern {
+.sd-root-modern,
+.sd-container-modern {
   --sd-base-padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   --sd-base-vertical-padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
   --sd-page-vertical-padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
-.sd-root-modern.sd-root-modern--mobile {
+.sd-root-modern.sd-root-modern--mobile,
+.sd-root-modern--mobile .sd-container-modern {
   --sd-base-padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
   --sd-base-vertical-padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
   --sd-page-vertical-padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));