survey-react 1.9.96 → 1.9.98

package/defaultV2.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.96
+ * surveyjs - Survey JavaScript library v1.9.98
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -591,17 +591,17 @@ sv-popup {
   transform: translate(calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px))), calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
-.sv-popup--show-pointer.sv-popup--right {
+.sv-popup--show-pointer.sv-popup--right .sv-popup__container {
   transform: translate(calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-popup--show-pointer.sv-popup--right .sv-popup__pointer {
+.sv-popup--show-pointer.sv-popup--right .sv-popup__container .sv-popup__pointer {
   transform: translate(-12px, -4px) rotate(-90deg);
 }
 
-.sv-popup--show-pointer.sv-popup--left {
+.sv-popup--show-pointer.sv-popup--left .sv-popup__container {
   transform: translate(calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-popup--show-pointer.sv-popup--left .sv-popup__pointer {
+.sv-popup--show-pointer.sv-popup--left .sv-popup__container .sv-popup__pointer {
   transform: translate(-4px, -4px) rotate(90deg);
 }
 
@@ -1125,16 +1125,21 @@ sv-popup {
   opacity: 0.25;
 }
 
+.sv-ranking-item--disabled .sv-ranking-item__text {
+  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  opacity: 0.25;
+}
+
 .sv-ranking-item__ghost.sv-ranking-item__ghost {
   display: none;
   background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
   border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0px;
-  width: calc(25 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  width: calc(31 * var(--sjs-base-unit, var(--base-unit, 8px)));
   height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
   z-index: 1;
   position: absolute;
-  left: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  left: 0;
+  top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
 [dir=rtl] .sv-ranking-item__ghost {
@@ -1213,6 +1218,9 @@ sv-popup {
   top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
+.sv-ranking-shortcut .sv-ranking-item__content {
+  padding-left: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
 .sv-ranking-shortcut .sv-ranking-item__icon-container {
   margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
@@ -1222,19 +1230,32 @@ sv-popup {
 }
 
 .sv-ranking--select-to-rank-vertical {
-  flex-direction: column;
+  flex-direction: column-reverse;
 }
 .sv-ranking--select-to-rank-vertical .sv-ranking__containers-divider {
-  margin: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
+  margin: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
   height: 1px;
 }
+.sv-ranking--select-to-rank-vertical .sv-ranking__container--empty {
+  padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  padding-bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
 
 .sv-ranking--select-to-rank-horizontal .sv-ranking__containers-divider {
   width: 1px;
 }
 .sv-ranking--select-to-rank-horizontal .sv-ranking__container--to .sv-ranking-item {
+  left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sv-ranking--select-to-rank-horizontal .sv-ranking__container--empty.sv-ranking__container--to {
+  padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+.sv-ranking--select-to-rank-horizontal .sv-ranking__container--empty.sv-ranking__container--to .sv-ranking-item {
   left: initial;
 }
+.sv-ranking--select-to-rank-horizontal .sv-ranking__container--empty.sv-ranking__container--from {
+  padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
 
 .sv-ranking__container-placeholder {
   color: var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45));
@@ -1265,6 +1286,10 @@ sv-popup {
   background: var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
 }
 
+.sv-ranking__container--from .sv-ranking-item__icon--focus {
+  display: none;
+}
+
 .sv-list {
   padding: 0;
   margin: 0;
@@ -1316,6 +1341,7 @@ sv-popup {
   line-height: calc(1.5 * var(--sjs-font-size, 16px));
   cursor: pointer;
   overflow: hidden;
+  text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
@@ -1478,7 +1504,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 }
 
 .sv-save-data_root {
-  position: absolute;
+  position: fixed;
   left: 50%;
   bottom: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
   background: var(--sjs-general-backcolor, var(--background, #fff));
@@ -1805,6 +1831,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   border: 1px solid var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
   border-radius: var(--sjs-questionpanel-cornerRadius, var(--sjs-corner-radius, 4px));
   box-shadow: none;
+  background-color: transparent;
 }
 
 .sd-question {
@@ -3249,16 +3276,20 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   line-height: calc(1.5 * var(--sjs-font-size, 16px));
 }
 
+.sv-dropdown_select-wrapper {
+  position: relative;
+}
+
+.sv-dropdown_select-wrapper use {
+  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+}
+
 .sd-dropdown {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   padding-inline-end: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
   padding-inline-start: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  background-position: right calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) top 50%, 0 0;
-  background-repeat: no-repeat;
-  background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
-  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 15L17 10H7L12 15Z' fill='%23909090'/%3E%3C/svg%3E%0A");
   opacity: 1;
   display: flex;
   justify-content: space-between;
@@ -3302,15 +3333,23 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   margin: auto 0;
 }
 
+.sd-dropdown_chevron-button {
+  position: absolute;
+  width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  top: 0;
+  bottom: 0;
+  inset-inline-end: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-inline-end: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+
 .sd-dropdown_clean-button-svg {
   width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
   height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
-.sd-dropdown use {
-  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
-}
-
 .sd-input.sd-dropdown:focus-within {
   box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
 }
@@ -4405,6 +4444,14 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   box-sizing: border-box;
 }
 
+.sd-root_background-image {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
 .sd-multipletext {
   width: 100%;
   table-layout: fixed;
@@ -5060,6 +5107,11 @@ body {
   width: 100%;
   font-family: var(--font-family, var(--font-family));
   background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
+  position: relative;
+}
+.sd-root-modern form {
+  z-index: 1;
+  position: relative;
 }
 .sd-root-modern * {
   scrollbar-width: thin;