survey-react 1.9.127 → 1.9.129

package/survey.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.127
+ * surveyjs - Survey JavaScript library v1.9.129
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -7,6 +7,10 @@
   --sjs-default-font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 
+:root {
+  --sjs-transition-duration: 150ms;
+}
+
 .sv_progress-buttons__container-center {
   text-align: center;
 }
@@ -116,6 +120,10 @@
   cursor: not-allowed;
 }
 
+:root {
+  --sjs-transition-duration: 150ms;
+}
+
 .sv_progress-toc {
   padding: var(--sjs-base-unit, var(--base-unit, 8px));
   max-width: 336px;
@@ -167,6 +175,14 @@
   background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
 }
 
+:root {
+  --sjs-transition-duration: 150ms;
+}
+
+:root {
+  --sjs-transition-duration: 150ms;
+}
+
 .sv_window {
   position: fixed;
   bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -176,16 +192,67 @@
   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-clip: padding-box;
   z-index: 100;
-  max-height: 90vh;
+  max-height: 50vh;
   overflow: auto;
   box-sizing: border-box;
+  background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
+}
+@-moz-document url-prefix() {
+  .sv_window,
+  .sv_window * {
+    scrollbar-width: thin;
+    scrollbar-color: var(--sjs-border-default, var(--border, #d6d6d6)) transparent;
+  }
+}
+.sv_window::-webkit-scrollbar,
+.sv_window *::-webkit-scrollbar {
+  width: 12px;
+  height: 12px;
+  background-color: transparent;
+}
+.sv_window::-webkit-scrollbar-thumb,
+.sv_window *::-webkit-scrollbar-thumb {
+  border: 4px solid rgba(0, 0, 0, 0);
+  background-clip: padding-box;
+  border-radius: 32px;
+  background-color: var(--sjs-border-default, var(--border, #d6d6d6));
+}
+.sv_window::-webkit-scrollbar-track,
+.sv_window *::-webkit-scrollbar-track {
+  background: transparent;
+}
+.sv_window::-webkit-scrollbar-thumb:hover,
+.sv_window *::-webkit-scrollbar-thumb:hover {
+  border: 2px solid rgba(0, 0, 0, 0);
+  background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+}
+
+.sv_window_root-content {
+  height: 100%;
+}
+
+.sv_window--full-screen {
+  top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  left: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  right: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  max-height: 100%;
+  width: initial !important;
+  max-width: initial !important;
+}
+
+.sv_window_header {
+  display: flex;
+  justify-content: flex-end;
 }
 
 .sv_window_content {
-  border-radius: var(--sjs-base-unit, var(--base-unit, 8px));
   overflow: hidden;
 }
 
+.sv_window--collapsed {
+  height: initial;
+}
 .sv_window--collapsed .sv_window_header {
   height: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   padding: var(--sjs-base-unit, var(--base-unit, 8px)) var(--sjs-base-unit, var(--base-unit, 8px)) var(--sjs-base-unit, var(--base-unit, 8px)) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -196,6 +263,10 @@
 .sv_window--collapsed .sv_window_content {
   display: none;
 }
+.sv_window--collapsed .sv_window_buttons_container {
+  margin-top: 0;
+  margin-right: 0;
+}
 
 .sv_window_header_title_collapsed {
   color: var(--sjs-general-dim-forecolor, rgba(0, 0, 0, 0.91));
@@ -206,7 +277,7 @@
   line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
   flex: 1;
   display: flex;
-  justify-content: start;
+  justify-content: flex-start;
   align-items: center;
 }
 
@@ -223,9 +294,9 @@
 }
 
 .sv_window_buttons_container {
-  position: absolute;
-  top: var(--sjs-base-unit, var(--base-unit, 8px));
-  right: var(--sjs-base-unit, var(--base-unit, 8px));
+  position: fixed;
+  margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
+  margin-right: var(--sjs-base-unit, var(--base-unit, 8px));
   display: flex;
   gap: var(--sjs-base-unit, var(--base-unit, 8px));
   z-index: 1;
@@ -242,13 +313,16 @@
 .sv_window_button:hover, .sv_window_button:active {
   background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
 }
-.sv_window_button:hover svg use, .sv_window_button:hover svg path, .sv_window_button:active svg use, .sv_window_button:active svg path {
+.sv_window_button:hover svg use,
+.sv_window_button:hover svg path, .sv_window_button:active svg use,
+.sv_window_button:active svg path {
   fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
 }
 .sv_window_button:active {
   opacity: 0.5;
 }
-.sv_window_button svg use, .sv_window_button svg path {
+.sv_window_button svg use,
+.sv_window_button svg path {
   fill: var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45));
 }
 
@@ -295,6 +369,10 @@ sv-brand-info, .sv-brand-info {
   color: #909090;
 }
 
+:root {
+  --sjs-transition-duration: 150ms;
+}
+
 .sv-dragged-element-shortcut {
   height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   min-width: calc(12.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -335,6 +413,10 @@ sv-brand-info, .sv-brand-info {
   visibility: hidden;
 }
 
+:root {
+  --sjs-transition-duration: 150ms;
+}
+
 .sv-save-data_root {
   position: fixed;
   left: 50%;
@@ -1177,10 +1259,6 @@ body {
 .sv_m600 .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_qstn table.sv_q_matrix td label.sv_q_m_label {
   display: inline;
 }
-.sv_m600 .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_q table.sv_q_matrix td:after,
-.sv_m600 .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_qstn table.sv_q_matrix td:after {
-  content: attr(data-responsive-title);
-}
 .sv_m600 .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_q table.sv_q_matrix .sv_q_m_cell,
 .sv_m600 .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_qstn table.sv_q_matrix .sv_q_m_cell {
   text-align: initial;
@@ -1258,10 +1336,6 @@ body {
   .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_qstn table.sv_q_matrix td label.sv_q_m_label {
     display: inline;
   }
-  .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_q table.sv_q_matrix td:after,
-  .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_qstn table.sv_q_matrix td:after {
-    content: attr(data-responsive-title);
-  }
   .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_q table.sv_q_matrix .sv_q_m_cell,
   .sv_main .sv_container .sv_body .sv_p_root .sv_row .sv_qstn table.sv_q_matrix .sv_q_m_cell {
     text-align: initial;