survey-react 1.9.105 → 1.9.106

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.105
2
+ * surveyjs - Survey JavaScript library v1.9.106
3
3
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ - http://surveyjs.io/
4
4
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
5
5
  */
@@ -1086,6 +1086,13 @@ sv-popup {
1086
1086
  height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
1087
1087
  }
1088
1088
 
1089
+ .sv-ranking-item--disabled.sv-ranking-item--disabled {
1090
+ cursor: initial;
1091
+ }
1092
+ .sv-ranking-item--disabled.sv-ranking-item--disabled .sv-ranking-item__icon-container.sv-ranking-item__icon-container .sv-ranking-item__icon.sv-ranking-item__icon {
1093
+ visibility: hidden;
1094
+ }
1095
+
1089
1096
  .sv-ranking-item__icon.sv-ranking-item__icon {
1090
1097
  visibility: hidden;
1091
1098
  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
@@ -2362,6 +2369,10 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2362
2369
  background-clip: padding-box;
2363
2370
  }
2364
2371
 
2372
+ .sd-root-modern:not(.sd-root-modern--mobile) .sd-table__cell:not(.sd-table__cell--actions):not(.sd-table__cell--action):not(.sd-table__cell--empty.sd-table__cell--error) {
2373
+ width: 10000px;
2374
+ }
2375
+
2365
2376
  .sd-table__row:first-of-type > .sd-table__cell {
2366
2377
  border-top: 0;
2367
2378
  }
@@ -2378,6 +2389,31 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2378
2389
  padding-top: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
2379
2390
  }
2380
2391
 
2392
+ .sd-panel__content .sd-table--no-header {
2393
+ padding-top: 0;
2394
+ }
2395
+ .sd-panel__content .sd-question--table .sd-question__content {
2396
+ padding-top: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
2397
+ }
2398
+ .sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content {
2399
+ padding-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2400
+ }
2401
+ .sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content .sd-table--no-header {
2402
+ padding-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
2403
+ }
2404
+ .sd-panel__content .sd-question--table > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
2405
+ margin-top: calc(-3 * var(--sjs-base-unit, var(--base-unit, 8px)));
2406
+ }
2407
+ .sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
2408
+ margin-top: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2409
+ }
2410
+ .sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
2411
+ margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2412
+ }
2413
+ .sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table > .sd-question__header + .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
2414
+ margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2415
+ }
2416
+
2381
2417
  .sd-table--alternate-rows {
2382
2418
  margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2383
2419
  margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
@@ -2423,7 +2459,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2423
2459
  text-align: center;
2424
2460
  }
2425
2461
  .sd-table__cell:not(.sd-table__cell--empty):not(.sd-table__cell--actions):not(:empty) {
2426
- min-width: calc(14 * var(--sjs-base-unit, var(--base-unit, 8px)));
2462
+ min-width: calc(15 * var(--sjs-base-unit, var(--base-unit, 8px)));
2427
2463
  }
2428
2464
 
2429
2465
  .sd-table__cell--error {
@@ -2477,30 +2513,26 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2477
2513
  padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2478
2514
  }
2479
2515
  .sd-table__cell--header:not(.sd-table__cell--empty) {
2480
- min-width: calc(14 * var(--sjs-base-unit, var(--base-unit, 8px)));
2516
+ min-width: calc(15 * var(--sjs-base-unit, var(--base-unit, 8px)));
2481
2517
  }
2482
2518
 
2483
2519
  .sd-matrixdropdown .sd-table__cell--header.sd-table__cell--empty {
2484
- min-width: calc(14 * var(--sjs-base-unit, var(--base-unit, 8px)));
2485
- width: calc(14 * var(--sjs-base-unit, var(--base-unit, 8px)));
2520
+ min-width: calc(15 * var(--sjs-base-unit, var(--base-unit, 8px)));
2486
2521
  }
2487
2522
 
2488
2523
  .sd-matrixdropdown .sd-table__cell--header.sd-table__cell--action {
2489
- min-width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2490
- width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2524
+ min-width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
2525
+ width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
2491
2526
  }
2492
2527
 
2493
2528
  .sd-matrixdropdown .sd-table__cell--header:not(.sd-table__cell--empty) {
2494
- min-width: calc(14 * var(--sjs-base-unit, var(--base-unit, 8px)));
2495
- width: calc(14 * var(--sjs-base-unit, var(--base-unit, 8px)));
2529
+ min-width: calc(15 * var(--sjs-base-unit, var(--base-unit, 8px)));
2496
2530
  }
2497
2531
  .sd-matrixdropdown .sd-table__cell--header:not(.sd-table__cell--empty).sd-table__cell--dropdown, .sd-matrixdropdown .sd-table__cell--header:not(.sd-table__cell--empty).sd-table__cell--rating {
2498
2532
  min-width: calc(22 * var(--sjs-base-unit, var(--base-unit, 8px)));
2499
- width: calc(22 * var(--sjs-base-unit, var(--base-unit, 8px)));
2500
2533
  }
2501
2534
  .sd-matrixdropdown .sd-table__cell--header:not(.sd-table__cell--empty).sd-table__cell--boolean {
2502
2535
  min-width: calc(18 * var(--sjs-base-unit, var(--base-unit, 8px)));
2503
- width: calc(18 * var(--sjs-base-unit, var(--base-unit, 8px)));
2504
2536
  }
2505
2537
 
2506
2538
  .sd-table__cell--detail-panel {
@@ -2519,6 +2551,8 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2519
2551
  }
2520
2552
  .sd-table__cell--actions:not(.sd-table__cell--vertical):not(.sd-table__cell--drag):first-of-type {
2521
2553
  padding-left: 0;
2554
+ width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
2555
+ min-width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
2522
2556
  }
2523
2557
 
2524
2558
  .sd-table__cell--detail-button {
@@ -2640,9 +2674,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2640
2674
  padding-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2641
2675
  min-width: min-content;
2642
2676
  }
2643
- .sd-question--table.sd-element--nested > .sd-question__header--location-top {
2644
- margin-top: calc(-0.25 * var(--sd-base-vertical-padding));
2645
- }
2646
2677
  .sd-question--table.sd-element--nested > .sd-question__erbox--above-question {
2647
2678
  margin-bottom: var(--sd-base-vertical-padding);
2648
2679
  }
@@ -2650,6 +2681,12 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2650
2681
  min-width: auto;
2651
2682
  overflow-x: auto;
2652
2683
  }
2684
+ .sd-question--table.sd-element--nested > .sd-question__content {
2685
+ padding-bottom: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px)));
2686
+ margin-bottom: calc(-0.25 * var(--sjs-base-unit, var(--base-unit, 8px)));
2687
+ padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2688
+ margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2689
+ }
2653
2690
  .sd-question--table.sd-element--nested > .sd-question__content, .sd-question--table:not(.sd-element--with-frame):not(.sd-element--nested) {
2654
2691
  padding-right: var(--sd-base-padding);
2655
2692
  margin-right: calc(-1 * var(--sd-base-padding));
@@ -2662,10 +2699,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2662
2699
  overflow-x: scroll;
2663
2700
  }
2664
2701
 
2665
- .sd-matrixdropdown.sd-table {
2666
- table-layout: fixed;
2667
- }
2668
-
2669
2702
  .sd-table__cell--detail-panel .sd-panel__content {
2670
2703
  padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
2671
2704
  }
@@ -2741,30 +2774,37 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
2741
2774
  }
2742
2775
 
2743
2776
  .sd-row--multiple {
2744
- row-gap: var(--sd-base-vertical-padding);
2777
+ row-gap: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2745
2778
  margin-left: calc(-1 * var(--sd-base-padding));
2746
2779
  width: calc(100% + var(--sd-base-padding));
2747
2780
  flex-wrap: wrap;
2748
2781
  }
2749
2782
  .sd-row--multiple > div {
2750
2783
  box-sizing: border-box;
2784
+ padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2785
+ display: flex;
2786
+ align-items: stretch;
2787
+ }
2788
+
2789
+ .sd-panel .sd-row--multiple {
2790
+ row-gap: var(--sd-base-vertical-padding);
2791
+ }
2792
+ .sd-panel .sd-row--multiple > div {
2751
2793
  padding-left: var(--sd-base-padding);
2752
2794
  }
2753
2795
 
2754
- .sd-page__row.sd-row--multiple {
2755
- padding: var(--sd-base-padding) var(--sd-base-padding) var(--sd-base-padding) 0;
2756
- margin-left: 0;
2757
- width: 100%;
2796
+ .sd-row--multiple.sd-row--compact > div {
2797
+ padding-left: var(--sd-base-padding);
2758
2798
  }
2759
- .sd-page__row.sd-row--multiple:not(.sd-row--compact) {
2760
- background: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
2761
- box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
2762
- border-radius: calc(1 * var(--sjs-corner-radius, 4px));
2799
+
2800
+ .sd-page__row.sd-row--multiple {
2801
+ margin-left: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2802
+ width: calc(100% + 2 * var(--sjs-base-unit, var(--base-unit, 8px)));
2763
2803
  }
2764
2804
  .sd-page__row.sd-row--multiple.sd-row--compact {
2765
2805
  padding: 0;
2766
- width: calc(100% + var(--sd-base-padding));
2767
2806
  margin-left: calc(-1 * var(--sd-base-padding));
2807
+ width: calc(100% + var(--sd-base-padding));
2768
2808
  }
2769
2809
 
2770
2810
  .sd-row__panel {
@@ -3883,7 +3923,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
3883
3923
  }
3884
3924
 
3885
3925
  .sd-html h1 {
3886
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
3926
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
3887
3927
  font-size: var(--sjs-article-font-xx-large-fontSize, 64px);
3888
3928
  text-decoration: var(--sjs-article-font-xx-large-textDecoration, "none");
3889
3929
  font-family: var(--font-family);
@@ -3896,7 +3936,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
3896
3936
  text-transform: var(--sjs-article-font-xx-large-textCase, "none");
3897
3937
  }
3898
3938
  .sd-html h2 {
3899
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
3939
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
3900
3940
  font-size: var(--sjs-article-font-x-large-fontSize, 48px);
3901
3941
  text-decoration: var(--sjs-article-font-x-large-textDecoration, "none");
3902
3942
  font-family: var(--font-family);
@@ -3909,7 +3949,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
3909
3949
  text-transform: var(--sjs-article-font-x-large-textCase, "none");
3910
3950
  }
3911
3951
  .sd-html h3 {
3912
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
3952
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
3913
3953
  font-size: var(--sjs-article-font-large-fontSize, 32px);
3914
3954
  text-decoration: var(--sjs-article-font-large-textDecoration, "none");
3915
3955
  font-family: var(--font-family);
@@ -3921,8 +3961,10 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
3921
3961
  text-indent: var(--sjs-article-font-large-paragraphIndent, 0px);
3922
3962
  text-transform: var(--sjs-article-font-large-textCase, "none");
3923
3963
  }
3924
- .sd-html h4 {
3925
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
3964
+ .sd-html h4,
3965
+ .sd-html h5,
3966
+ .sd-html h6 {
3967
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
3926
3968
  font-size: var(--sjs-article-font-medium-fontSize, 24px);
3927
3969
  text-decoration: var(--sjs-article-font-medium-textDecoration, "none");
3928
3970
  font-family: var(--font-family);
@@ -3934,14 +3976,11 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
3934
3976
  text-indent: var(--sjs-article-font-medium-paragraphIndent, 0px);
3935
3977
  text-transform: var(--sjs-article-font-medium-textCase, "none");
3936
3978
  }
3937
- .sd-html h5,
3938
- .sd-html h6 {
3939
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
3940
- }
3979
+ .sd-html td,
3941
3980
  .sd-html span,
3942
3981
  .sd-html div,
3943
3982
  .sd-html p {
3944
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
3983
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
3945
3984
  font-size: var(--sjs-article-font-default-fontSize, 16px);
3946
3985
  text-decoration: var(--sjs-article-font-default-textDecoration, "none");
3947
3986
  font-family: var(--font-family);
@@ -4027,6 +4066,17 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4027
4066
  }
4028
4067
  }
4029
4068
 
4069
+ .sd-body__progress--top {
4070
+ margin-bottom: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
4071
+ position: sticky;
4072
+ top: 0;
4073
+ z-index: 50;
4074
+ }
4075
+
4076
+ .sd-body__progress--bottom .sd-progress__text {
4077
+ margin-top: calc(-3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
4078
+ }
4079
+
4030
4080
  .sd-boolean {
4031
4081
  display: flex;
4032
4082
  width: max-content;
@@ -4430,6 +4480,10 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4430
4480
  cursor: pointer;
4431
4481
  }
4432
4482
 
4483
+ .sd-file__wrapper {
4484
+ width: max-content;
4485
+ }
4486
+
4433
4487
  .sd-question--answered .sd-file__drag-area-placeholder {
4434
4488
  display: none;
4435
4489
  }
@@ -4681,7 +4735,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4681
4735
  width: 100%;
4682
4736
  }
4683
4737
  .sd-body .sd-body__page {
4684
- min-width: calc(300px + 6 * var(--sjs-base-unit, var(--base-unit, 8px)));
4738
+ min-width: 300px;
4685
4739
  }
4686
4740
  .sd-body .sd-body__timer {
4687
4741
  padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
@@ -4752,16 +4806,6 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4752
4806
  gap: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
4753
4807
  }
4754
4808
 
4755
- .sd-body__progress {
4756
- margin-bottom: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
4757
- }
4758
-
4759
- .sd-body__progress--top {
4760
- position: sticky;
4761
- top: 0;
4762
- z-index: 50;
4763
- }
4764
-
4765
4809
  .sd-body--empty {
4766
4810
  min-height: 400px;
4767
4811
  text-align: center;
@@ -4769,6 +4813,127 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4769
4813
  box-sizing: border-box;
4770
4814
  }
4771
4815
 
4816
+ .sd-body--empty h1,
4817
+ .sd-body--loading h1 {
4818
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4819
+ font-size: var(--sjs-article-font-xx-large-fontSize, 64px);
4820
+ text-decoration: var(--sjs-article-font-xx-large-textDecoration, "none");
4821
+ font-family: var(--font-family);
4822
+ font-weight: var(--sjs-article-font-xx-large-fontWeight, 700);
4823
+ font-style: var(--sjs-article-font-xx-large-fontStyle, "normal");
4824
+ font-stretch: var(--sjs-article-font-xx-large-fontStretch, "normal");
4825
+ letter-spacing: var(--sjs-article-font-xx-large-letterSpacing, 0);
4826
+ line-height: var(--sjs-article-font-xx-large-lineHeight, 64px);
4827
+ text-indent: var(--sjs-article-font-xx-large-paragraphIndent, 0px);
4828
+ text-transform: var(--sjs-article-font-xx-large-textCase, "none");
4829
+ }
4830
+ .sd-body--empty h2,
4831
+ .sd-body--loading h2 {
4832
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4833
+ font-size: var(--sjs-article-font-x-large-fontSize, 48px);
4834
+ text-decoration: var(--sjs-article-font-x-large-textDecoration, "none");
4835
+ font-family: var(--font-family);
4836
+ font-weight: var(--sjs-article-font-x-large-fontWeight, 700);
4837
+ font-style: var(--sjs-article-font-x-large-fontStyle, "normal");
4838
+ font-stretch: var(--sjs-article-font-x-large-fontStretch, "normal");
4839
+ letter-spacing: var(--sjs-article-font-x-large-letterSpacing, 0);
4840
+ line-height: var(--sjs-article-font-x-large-lineHeight, 56px);
4841
+ text-indent: var(--sjs-article-font-x-large-paragraphIndent, 0px);
4842
+ text-transform: var(--sjs-article-font-x-large-textCase, "none");
4843
+ }
4844
+ .sd-body--empty h3,
4845
+ .sd-body--loading h3 {
4846
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4847
+ font-size: var(--sjs-article-font-large-fontSize, 32px);
4848
+ text-decoration: var(--sjs-article-font-large-textDecoration, "none");
4849
+ font-family: var(--font-family);
4850
+ font-weight: var(--sjs-article-font-large-fontWeight, 700);
4851
+ font-style: var(--sjs-article-font-large-fontStyle, "normal");
4852
+ font-stretch: var(--sjs-article-font-large-fontStretch, "normal");
4853
+ letter-spacing: var(--sjs-article-font-large-letterSpacing, 0);
4854
+ line-height: var(--sjs-article-font-large-lineHeight, 40px);
4855
+ text-indent: var(--sjs-article-font-large-paragraphIndent, 0px);
4856
+ text-transform: var(--sjs-article-font-large-textCase, "none");
4857
+ }
4858
+ .sd-body--empty h4,
4859
+ .sd-body--empty h5,
4860
+ .sd-body--empty h6,
4861
+ .sd-body--loading h4,
4862
+ .sd-body--loading h5,
4863
+ .sd-body--loading h6 {
4864
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4865
+ font-size: var(--sjs-article-font-medium-fontSize, 24px);
4866
+ text-decoration: var(--sjs-article-font-medium-textDecoration, "none");
4867
+ font-family: var(--font-family);
4868
+ font-weight: var(--sjs-article-font-medium-fontWeight, 700);
4869
+ font-style: var(--sjs-article-font-medium-fontStyle, "normal");
4870
+ font-stretch: var(--sjs-article-font-medium-fontStretch, "normal");
4871
+ letter-spacing: var(--sjs-article-font-medium-letterSpacing, 0);
4872
+ line-height: var(--sjs-article-font-medium-lineHeight, 32px);
4873
+ text-indent: var(--sjs-article-font-medium-paragraphIndent, 0px);
4874
+ text-transform: var(--sjs-article-font-medium-textCase, "none");
4875
+ }
4876
+ .sd-body--empty td,
4877
+ .sd-body--empty span,
4878
+ .sd-body--empty div,
4879
+ .sd-body--empty p,
4880
+ .sd-body--loading td,
4881
+ .sd-body--loading span,
4882
+ .sd-body--loading div,
4883
+ .sd-body--loading p {
4884
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4885
+ font-size: var(--sjs-article-font-default-fontSize, 16px);
4886
+ text-decoration: var(--sjs-article-font-default-textDecoration, "none");
4887
+ font-family: var(--font-family);
4888
+ font-weight: var(--sjs-article-font-default-fontWeight, 400);
4889
+ font-style: var(--sjs-article-font-default-fontStyle, "normal");
4890
+ font-stretch: var(--sjs-article-font-default-fontStretch, "normal");
4891
+ letter-spacing: var(--sjs-article-font-default-letterSpacing, 0);
4892
+ line-height: var(--sjs-article-font-default-lineHeight, 28px);
4893
+ text-indent: var(--sjs-article-font-default-paragraphIndent, 0px);
4894
+ text-transform: var(--sjs-article-font-default-textCase, "none");
4895
+ }
4896
+ .sd-body--empty a,
4897
+ .sd-body--loading a {
4898
+ color: var(--sjs-primary-backcolor, var(--primary, #19b394));
4899
+ }
4900
+ .sd-body--empty button,
4901
+ .sd-body--loading button {
4902
+ display: flex;
4903
+ align-items: center;
4904
+ padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
4905
+ vertical-align: baseline;
4906
+ text-align: center;
4907
+ background-color: var(--sjs-general-backcolor, var(--background, #fff));
4908
+ box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
4909
+ border: none;
4910
+ border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
4911
+ cursor: pointer;
4912
+ user-select: none;
4913
+ outline: solid calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) transparent;
4914
+ }
4915
+ .sd-body--empty button:hover,
4916
+ .sd-body--loading button:hover {
4917
+ background-color: var(--sjs-questionpanel-hovercolor, var(--sjs-general-backcolor-dark, rgb(248, 248, 248)));
4918
+ }
4919
+ .sd-body--empty button:focus,
4920
+ .sd-body--loading button:focus {
4921
+ box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
4922
+ }
4923
+ .sd-body--empty button span,
4924
+ .sd-body--loading button span {
4925
+ display: flex;
4926
+ align-items: center;
4927
+ flex-grow: 1;
4928
+ justify-content: center;
4929
+ color: var(--sjs-primary-backcolor, var(--primary, #19b394));
4930
+ font-weight: 600;
4931
+ font-style: normal;
4932
+ font-family: var(--font-family, var(--font-family));
4933
+ font-size: var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
4934
+ line-height: calc(1.5 * var(--sjs-font-questiontitle-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
4935
+ }
4936
+
4772
4937
  .sd-root_background-image {
4773
4938
  background-position-x: center;
4774
4939
  position: absolute;
@@ -4789,8 +4954,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4789
4954
  height: 100%;
4790
4955
  }
4791
4956
 
4792
- .sd-multipletext__cell:not(:last-child) {
4793
- padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
4957
+ .sd-multipletext__cell:not(:first-of-type) {
4958
+ padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
4794
4959
  }
4795
4960
 
4796
4961
  .sd-multipletext__item-container.sd-input:focus-within {
@@ -4818,6 +4983,15 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4818
4983
  margin-bottom: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
4819
4984
  }
4820
4985
 
4986
+ .sd-multipletext__item-title {
4987
+ font-size: 0;
4988
+ line-height: 0;
4989
+ }
4990
+ .sd-multipletext__item-title span {
4991
+ font-size: var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px))));
4992
+ line-height: calc(1.5 * var(--sjs-font-editorfont-size, calc(1 * var(--sjs-font-size, var(--sjs-font-size, 16px)))));
4993
+ }
4994
+
4821
4995
  .sd-multipletext__item-title {
4822
4996
  height: calc(100% - var(--sjs-base-unit, var(--base-unit, 8px)) * 3);
4823
4997
  max-width: 30%;
@@ -4847,8 +5021,25 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
4847
5021
  display: inline-block;
4848
5022
  }
4849
5023
 
4850
- .sd-multipletext tr:not(:last-child) .sd-multipletext__cell {
4851
- padding-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
5024
+ .sd-multipletext__cell {
5025
+ padding-left: 0;
5026
+ padding-right: 0;
5027
+ padding-bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
5028
+ padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
5029
+ }
5030
+
5031
+ .sd-multipletext__cell--error-bottom,
5032
+ .sd-multipletext__row:first-of-type .sd-multipletext__cell {
5033
+ padding-top: 0;
5034
+ }
5035
+
5036
+ .sd-multipletext__cell--error-top,
5037
+ .sd-multipletext__row:last-of-type .sd-multipletext__cell {
5038
+ padding-bottom: 0;
5039
+ }
5040
+
5041
+ .sd-multipletext__cell--error .sd-question__erbox--outside-question {
5042
+ margin: 0;
4852
5043
  }
4853
5044
 
4854
5045
  .sd-multipletext .sd-input .sd-input {
@@ -4974,8 +5165,10 @@ svg.sd-action--icon {
4974
5165
  text-align: center;
4975
5166
  height: auto;
4976
5167
  }
4977
- .sd-completedpage h1 {
4978
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
5168
+
5169
+ .sd-completedpage h1,
5170
+ .sd-completed-before-page h1 {
5171
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4979
5172
  font-size: var(--sjs-article-font-xx-large-fontSize, 64px);
4980
5173
  text-decoration: var(--sjs-article-font-xx-large-textDecoration, "none");
4981
5174
  font-family: var(--font-family);
@@ -4987,8 +5180,9 @@ svg.sd-action--icon {
4987
5180
  text-indent: var(--sjs-article-font-xx-large-paragraphIndent, 0px);
4988
5181
  text-transform: var(--sjs-article-font-xx-large-textCase, "none");
4989
5182
  }
4990
- .sd-completedpage h2 {
4991
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
5183
+ .sd-completedpage h2,
5184
+ .sd-completed-before-page h2 {
5185
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
4992
5186
  font-size: var(--sjs-article-font-x-large-fontSize, 48px);
4993
5187
  text-decoration: var(--sjs-article-font-x-large-textDecoration, "none");
4994
5188
  font-family: var(--font-family);
@@ -5000,8 +5194,9 @@ svg.sd-action--icon {
5000
5194
  text-indent: var(--sjs-article-font-x-large-paragraphIndent, 0px);
5001
5195
  text-transform: var(--sjs-article-font-x-large-textCase, "none");
5002
5196
  }
5003
- .sd-completedpage h3 {
5004
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
5197
+ .sd-completedpage h3,
5198
+ .sd-completed-before-page h3 {
5199
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
5005
5200
  font-size: var(--sjs-article-font-large-fontSize, 32px);
5006
5201
  text-decoration: var(--sjs-article-font-large-textDecoration, "none");
5007
5202
  font-family: var(--font-family);
@@ -5013,8 +5208,13 @@ svg.sd-action--icon {
5013
5208
  text-indent: var(--sjs-article-font-large-paragraphIndent, 0px);
5014
5209
  text-transform: var(--sjs-article-font-large-textCase, "none");
5015
5210
  }
5016
- .sd-completedpage h4 {
5017
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
5211
+ .sd-completedpage h4,
5212
+ .sd-completedpage h5,
5213
+ .sd-completedpage h6,
5214
+ .sd-completed-before-page h4,
5215
+ .sd-completed-before-page h5,
5216
+ .sd-completed-before-page h6 {
5217
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
5018
5218
  font-size: var(--sjs-article-font-medium-fontSize, 24px);
5019
5219
  text-decoration: var(--sjs-article-font-medium-textDecoration, "none");
5020
5220
  font-family: var(--font-family);
@@ -5026,14 +5226,15 @@ svg.sd-action--icon {
5026
5226
  text-indent: var(--sjs-article-font-medium-paragraphIndent, 0px);
5027
5227
  text-transform: var(--sjs-article-font-medium-textCase, "none");
5028
5228
  }
5029
- .sd-completedpage h5,
5030
- .sd-completedpage h6 {
5031
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
5032
- }
5229
+ .sd-completedpage td,
5033
5230
  .sd-completedpage span,
5034
5231
  .sd-completedpage div,
5035
- .sd-completedpage p {
5036
- color: var(--sjs-general-forecolor, var(--foreground, #161616));
5232
+ .sd-completedpage p,
5233
+ .sd-completed-before-page td,
5234
+ .sd-completed-before-page span,
5235
+ .sd-completed-before-page div,
5236
+ .sd-completed-before-page p {
5237
+ color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
5037
5238
  font-size: var(--sjs-article-font-default-fontSize, 16px);
5038
5239
  text-decoration: var(--sjs-article-font-default-textDecoration, "none");
5039
5240
  font-family: var(--font-family);
@@ -5045,10 +5246,12 @@ svg.sd-action--icon {
5045
5246
  text-indent: var(--sjs-article-font-default-paragraphIndent, 0px);
5046
5247
  text-transform: var(--sjs-article-font-default-textCase, "none");
5047
5248
  }
5048
- .sd-completedpage a {
5249
+ .sd-completedpage a,
5250
+ .sd-completed-before-page a {
5049
5251
  color: var(--sjs-primary-backcolor, var(--primary, #19b394));
5050
5252
  }
5051
- .sd-completedpage button {
5253
+ .sd-completedpage button,
5254
+ .sd-completed-before-page button {
5052
5255
  display: flex;
5053
5256
  align-items: center;
5054
5257
  padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
@@ -5062,13 +5265,16 @@ svg.sd-action--icon {
5062
5265
  user-select: none;
5063
5266
  outline: solid calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) transparent;
5064
5267
  }
5065
- .sd-completedpage button:hover {
5268
+ .sd-completedpage button:hover,
5269
+ .sd-completed-before-page button:hover {
5066
5270
  background-color: var(--sjs-questionpanel-hovercolor, var(--sjs-general-backcolor-dark, rgb(248, 248, 248)));
5067
5271
  }
5068
- .sd-completedpage button:focus {
5272
+ .sd-completedpage button:focus,
5273
+ .sd-completed-before-page button:focus {
5069
5274
  box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
5070
5275
  }
5071
- .sd-completedpage button span {
5276
+ .sd-completedpage button span,
5277
+ .sd-completed-before-page button span {
5072
5278
  display: flex;
5073
5279
  align-items: center;
5074
5280
  flex-grow: 1;
@@ -5395,16 +5601,17 @@ sv-components-container,
5395
5601
  .sd-root-modern.sd-root-modern--mobile .sd-multipletext__cell {
5396
5602
  display: block;
5397
5603
  }
5398
- .sd-root-modern.sd-root-modern--mobile .sd-multipletext__cell:not(:last-child) {
5399
- padding-right: 0;
5400
- padding-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
5604
+ .sd-root-modern.sd-root-modern--mobile .sd-multipletext__cell:not(:first-of-type) {
5605
+ padding-left: 0;
5606
+ padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
5607
+ }
5608
+ .sd-root-modern.sd-root-modern--mobile .sd-multipletext__cell :not(:last-of-type) {
5609
+ padding-bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
5401
5610
  }
5402
5611
  .sd-root-modern.sd-root-modern--mobile .sd-multipletext__item-container {
5403
5612
  flex-direction: column;
5404
5613
  }
5405
5614
  .sd-root-modern.sd-root-modern--mobile .sd-multipletext__item-title {
5406
- font-size: calc(0.75 * var(--sjs-font-size, 16px));
5407
- line-height: calc(1 * var(--sjs-font-size, 16px));
5408
5615
  height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
5409
5616
  padding-right: 0;
5410
5617
  border-right: none;
@@ -5413,6 +5620,10 @@ sv-components-container,
5413
5620
  width: 100%;
5414
5621
  max-width: none;
5415
5622
  }
5623
+ .sd-root-modern.sd-root-modern--mobile .sd-multipletext__item-title span {
5624
+ font-size: calc(0.75 * var(--sjs-font-size, 16px));
5625
+ line-height: calc(1 * var(--sjs-font-size, 16px));
5626
+ }
5416
5627
  .sd-root-modern.sd-root-modern--mobile .sd-multipletext__item {
5417
5628
  width: 100%;
5418
5629
  }
@@ -5594,6 +5805,35 @@ body {
5594
5805
  background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
5595
5806
  }
5596
5807
 
5808
+ .sd-root-modern.sd-root-modern--full-container {
5809
+ width: 100%;
5810
+ height: 100%;
5811
+ overflow: auto;
5812
+ position: static;
5813
+ }
5814
+ .sd-root-modern.sd-root-modern--full-container * {
5815
+ scrollbar-width: thin;
5816
+ scrollbar-color: var(--sjs-border-default, var(--border, #d6d6d6)) transparent;
5817
+ }
5818
+ .sd-root-modern.sd-root-modern--full-container::-webkit-scrollbar {
5819
+ width: 12px;
5820
+ height: 12px;
5821
+ background-color: transparent;
5822
+ }
5823
+ .sd-root-modern.sd-root-modern--full-container::-webkit-scrollbar-thumb {
5824
+ border: 4px solid rgba(0, 0, 0, 0);
5825
+ background-clip: padding-box;
5826
+ border-radius: 32px;
5827
+ background-color: var(--sjs-border-default, var(--border, #d6d6d6));
5828
+ }
5829
+ .sd-root-modern.sd-root-modern--full-container::-webkit-scrollbar-track {
5830
+ background: transparent;
5831
+ }
5832
+ .sd-root-modern.sd-root-modern--full-container::-webkit-scrollbar-thumb:hover {
5833
+ border: 2px solid rgba(0, 0, 0, 0);
5834
+ background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
5835
+ }
5836
+
5597
5837
  .sd-root-modern--mobile {
5598
5838
  --sd-timer-size: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
5599
5839
  }