survey-react 1.9.135 → 1.9.136

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/defaultV2.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * surveyjs - Survey JavaScript library v1.9.135
2
+ * surveyjs - Survey JavaScript library v1.9.136
3
3
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ - http://surveyjs.io/
4
4
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
5
5
  */
@@ -1983,8 +1983,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
1983
1983
  padding-bottom: var(--sd-base-padding);
1984
1984
  background: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
1985
1985
  box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
1986
- display: flex;
1987
- flex-direction: column;
1988
1986
  }
1989
1987
 
1990
1988
  .sd-element--with-frame.sd-element--compact {
@@ -2066,6 +2064,8 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2066
2064
  }
2067
2065
  .sd-element--with-frame.sd-question--error-bottom {
2068
2066
  padding-bottom: 0;
2067
+ display: flex;
2068
+ flex-direction: column;
2069
2069
  }
2070
2070
  .sd-element--with-frame.sd-question--error-bottom > .sd-question__content {
2071
2071
  margin-bottom: var(--sd-base-padding);
@@ -6244,21 +6244,22 @@ svg.sd-action--icon {
6244
6244
  display: block;
6245
6245
  content: "";
6246
6246
  height: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6247
- background-color: var(--sjs-navigation-default, #bcbcbc);
6247
+ background-color: var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45));
6248
+ opacity: 0.5;
6248
6249
  position: absolute;
6249
6250
  bottom: calc(1.125 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6250
6251
  right: calc(50% + 4px);
6251
6252
  width: calc(100% - 4px);
6252
6253
  pointer-events: none;
6253
6254
  }
6254
- .sd-progress-buttons__list li:after {
6255
+ .sd-progress-buttons__list li .sd-progress-buttons__button {
6256
+ position: relative;
6255
6257
  display: flex;
6256
6258
  content: attr(data-page-number);
6257
6259
  width: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6258
6260
  height: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6259
6261
  margin: calc(0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6260
6262
  border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid transparent;
6261
- background-color: var(--sjs-navigation-default, #bcbcbc);
6262
6263
  border-radius: 50%;
6263
6264
  align-self: center;
6264
6265
  z-index: 1;
@@ -6268,29 +6269,70 @@ svg.sd-action--icon {
6268
6269
  justify-content: center;
6269
6270
  color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
6270
6271
  }
6271
- .sd-progress-buttons__list li:hover:after {
6272
+ .sd-progress-buttons__list li .sd-progress-buttons__button .sd-progress-buttons__button-background {
6273
+ position: absolute;
6274
+ width: 100%;
6275
+ height: 100%;
6276
+ top: calc(-0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6277
+ left: calc(-0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6278
+ background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
6279
+ z-index: -2;
6280
+ border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
6281
+ border-radius: 50%;
6282
+ }
6283
+ .sd-progress-buttons__list li .sd-progress-buttons__button .sd-progress-buttons__button-content {
6284
+ position: absolute;
6285
+ width: 100%;
6286
+ height: 100%;
6287
+ top: calc(-0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6288
+ left: calc(-0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6289
+ background-color: var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45));
6290
+ opacity: 0.5;
6291
+ z-index: -1;
6292
+ border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid transparent;
6293
+ border-radius: 50%;
6294
+ }
6295
+ .sd-progress-buttons__list li:hover .sd-progress-buttons__button {
6272
6296
  color: var(--sjs-primary-backcolor, var(--primary, #19b394));
6273
6297
  padding: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6274
6298
  margin: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6275
6299
  border: calc(0.75 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
6276
6300
  background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
6277
6301
  }
6302
+ .sd-progress-buttons__list li:hover .sd-progress-buttons__button .sd-progress-buttons__button-content {
6303
+ top: calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6304
+ left: calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6305
+ border: calc(0.75 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
6306
+ background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
6307
+ opacity: 1;
6308
+ }
6278
6309
  .sd-progress-buttons__list .sd-progress-buttons__list-element--passed:not(:first-child) > .sd-progress-buttons__connector {
6279
6310
  background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
6311
+ opacity: 1;
6312
+ }
6313
+ .sd-progress-buttons__list .sd-progress-buttons__list-element--passed .sd-progress-buttons__button {
6314
+ background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
6280
6315
  }
6281
- .sd-progress-buttons__list .sd-progress-buttons__list-element--passed:after {
6316
+ .sd-progress-buttons__list .sd-progress-buttons__list-element--passed .sd-progress-buttons__button .sd-progress-buttons__button-content {
6282
6317
  background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
6318
+ opacity: 1;
6283
6319
  }
6284
6320
  .sd-progress-buttons__list .sd-progress-buttons__list-element--current:not(:first-child) > .sd-progress-buttons__connector {
6285
6321
  background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
6322
+ opacity: 1;
6286
6323
  }
6287
- .sd-progress-buttons__list .sd-progress-buttons__list-element--current:after {
6324
+ .sd-progress-buttons__list .sd-progress-buttons__list-element--current .sd-progress-buttons__button {
6288
6325
  border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
6289
6326
  background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
6290
6327
  color: var(--sjs-primary-backcolor, var(--primary, #19b394));
6291
6328
  padding: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6292
6329
  margin: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6293
6330
  }
6331
+ .sd-progress-buttons__list .sd-progress-buttons__list-element--current .sd-progress-buttons__button .sd-progress-buttons__button-content {
6332
+ border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
6333
+ background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
6334
+ opacity: 1;
6335
+ }
6294
6336
 
6295
6337
  .sd-progress-buttons__page-title {
6296
6338
  display: flex;
@@ -6345,11 +6387,11 @@ svg.sd-action--icon {
6345
6387
  right: calc(50% + 8px);
6346
6388
  width: calc(100% - 8px);
6347
6389
  }
6348
- .sd-progress-buttons--numbered .sd-progress-buttons__list li:after {
6390
+ .sd-progress-buttons--numbered .sd-progress-buttons__list li .sd-progress-buttons__button {
6349
6391
  width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6350
6392
  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6351
6393
  }
6352
- .sd-progress-buttons--numbered .sd-progress-buttons__list li:hover:after {
6394
+ .sd-progress-buttons--numbered .sd-progress-buttons__list li:hover .sd-progress-buttons__button {
6353
6395
  padding: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
6354
6396
  }
6355
6397