survey-react 1.12.7 → 1.12.9

package/defaultV2.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.7
+ * surveyjs - Survey JavaScript library v1.12.9
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -452,6 +452,22 @@ button.sv-action-bar-item {
   margin-top: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
+.sv-matrixdynamic-dragged-row {
+  cursor: grabbing;
+  position: absolute;
+  z-index: 10000;
+  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
+}
+.sv-matrixdynamic-dragged-row .sd-table__row {
+  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
+  background-color: var(--sjs-general-backcolor, var(--background, #fff));
+  display: flex;
+  flex-grow: 0;
+  flex-shrink: 0;
+  align-items: center;
+  line-height: 0;
+}
+
 .sv-matrix-row--drag-drop-ghost-mod td {
   background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
 }
@@ -1392,12 +1408,15 @@ sv-brand-info,
 .sv-ranking-item__icon-container {
   position: relative;
   left: 0;
-  top: 5px;
   bottom: 0;
   flex-shrink: 0;
   width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   align-self: flex-start;
+  padding-left: var(--sjs-base-unit, var(--base-unit, 8px));
+  padding-right: var(--sjs-base-unit, var(--base-unit, 8px));
+  margin-left: calc(-2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  box-sizing: content-box;
 }
 
 .sv-ranking-item--disabled.sv-ranking-item--disabled,
@@ -1418,8 +1437,8 @@ sv-brand-info,
   fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
   position: absolute;
   top: var(--sjs-base-unit, var(--base-unit, 8px));
-  width: calc(1.75 * (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))));
 }
 
 .sv-ranking-item__index.sv-ranking-item__index {
@@ -1582,8 +1601,8 @@ sv-brand-info,
 }
 
 .sv-ranking-shortcut .sv-ranking-item__icon {
-  width: calc(1.75 * (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))));
   top: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
@@ -1591,7 +1610,7 @@ sv-brand-info,
   padding-left: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 .sv-ranking-shortcut .sv-ranking-item__icon-container {
-  margin-left: var(--sjs-base-unit, var(--base-unit, 8px));
+  margin-left: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
 .sv-ranking-shortcut {
@@ -1769,6 +1788,15 @@ sv-brand-info,
   padding-right: 0;
 }
 
+.sd-question--mobile .sv-ranking-item__icon-container,
+.sd-root-modern.sd-root-modern--mobile .sv-ranking-item__icon-container {
+  margin-left: calc(-2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  display: flex;
+  justify-content: flex-end;
+  padding: 0;
+  width: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
 :root {
   --sjs-transition-duration: 150ms;
 }
@@ -2279,9 +2307,9 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list-item__marker-icon use {
 [style*="direction: rtl"] .sd-element__num {
   float: right;
 }
-[dir=rtl] .sd-element__title--expandable:before,
-[style*="direction:rtl"] .sd-element__title--expandable:before,
-[style*="direction: rtl"] .sd-element__title--expandable:before {
+[dir=rtl] .sd-element__title--collapsed .sd-element__title-expandable-svg,
+[style*="direction:rtl"] .sd-element__title--collapsed .sd-element__title-expandable-svg,
+[style*="direction: rtl"] .sd-element__title--collapsed .sd-element__title-expandable-svg {
   transform: rotate(180deg);
 }
 
@@ -2302,22 +2330,16 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list-item__marker-icon use {
   display: block;
 }
 
-.sd-element__title--expandable:before {
-  content: "";
+.sd-element__title-expandable-svg {
   display: inline-block;
-  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 14L5 13L10 8L5 3L6 2L12 8L6 14Z' fill='%23909090'/%3E%3C/svg%3E%0A");
-  background-repeat: no-repeat;
-  background-position: center center;
   height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   width: 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))));
-  transition-property: transform;
 }
-
-.sd-element__title--expandable.sd-element__title--expanded:before {
-  transform: rotate(90deg);
+.sd-element__title-expandable-svg use {
+  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 
 .sd-element--with-frame {
@@ -2876,7 +2898,10 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   inset-block-end: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
-.sd-question__content:focus-within .sd-remaining-character-counter {
+.sd-text__content:focus-within .sd-remaining-character-counter,
+.sd-comment__content:focus-within .sd-remaining-character-counter,
+.sd-multipletext__content:focus-within .sd-remaining-character-counter,
+.sd-matrix__question-wrapper:focus-within .sd-remaining-character-counter {
   display: flex;
 }
 
@@ -3107,8 +3132,8 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 
 .sd-checkbox__svg {
   display: block;
-  width: calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(2.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))));
 }
 .sd-checkbox__svg use {
   fill: transparent;
@@ -3579,7 +3604,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   padding: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
-.sd-matrixdynamic__content .sd-table__question-wrapper {
+.sd-matrix__question-wrapper {
   position: relative;
 }
 
@@ -4402,8 +4427,8 @@ div[class*=sv-q-column-]:not(:first-of-type) .sd-item--enter {
 
 .sd-checkbox__svg {
   display: block;
-  width: calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(2.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))));
 }
 .sd-checkbox__svg use {
   fill: transparent;
@@ -5741,6 +5766,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 .sd-imagepicker__no-image-svg use {
   fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  opacity: 0.5;
 }
 
 .sd-imagepicker__column {
@@ -5814,6 +5840,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 
 .sd-image__no-image use {
   fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  opacity: 0.5;
 }
 
 .sd-question--image {
@@ -6787,8 +6814,11 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   cursor: pointer;
 }
 .sd-file__preview-item .sd-file__default-image {
-  width: calc(7 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(8.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  width: calc(9 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(9 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sd-file__preview-item .sd-file__default-image use {
+  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 .sd-file__preview-item:hover .sd-file__remove-file-button {
   opacity: 1;
@@ -8085,6 +8115,9 @@ svg.sd-action--icon {
   padding-top: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   padding-bottom: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
+.sv_progress-toc use {
+  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+}
 
 .sv_progress-toc--left {
   border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
@@ -8504,7 +8537,7 @@ sv-components-container,
   float: none;
   width: auto;
 }
-.sd-root-modern.sd-root-modern--mobile .sd-element__title--expandable:before {
+.sd-root-modern.sd-root-modern--mobile .sd-element__title-expandable-svg {
   inset-inline-start: calc(-2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 .sd-root-modern.sd-root-modern--mobile .sd-title.sd-container-modern__title {
@@ -8513,10 +8546,6 @@ sv-components-container,
 .sd-root-modern.sd-root-modern--mobile .sd-header__text {
   min-width: 100%;
 }
-.sd-root-modern.sd-root-modern--mobile .sv-ranking-item__icon-container {
-  margin-left: 0;
-  margin-right: 0;
-}
 
 .sd-multipletext--mobile .sd-multipletext__cell {
   display: block;