survey-react 1.11.4 → 1.11.5
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 +126 -39
- package/defaultV2.css.map +1 -1
- package/defaultV2.min.css +2 -2
- package/modern.css +26 -1
- package/modern.css.map +1 -1
- package/modern.min.css +2 -2
- package/package.json +1 -1
- package/survey.css +33 -1
- package/survey.css.map +1 -1
- package/survey.min.css +2 -2
- package/survey.react.d.ts +87 -16
- package/survey.react.js +203 -74
- package/survey.react.js.map +1 -1
- package/survey.react.min.js +3 -3
package/defaultV2.css
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
|
-
* surveyjs - Survey JavaScript library v1.11.
|
2
|
+
* surveyjs - Survey JavaScript library v1.11.5
|
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
|
*/
|
@@ -460,6 +460,22 @@ button.sv-action-bar-item {
|
|
460
460
|
visibility: hidden;
|
461
461
|
}
|
462
462
|
|
463
|
+
.sv-drag-drop-choices-shortcut {
|
464
|
+
cursor: grabbing;
|
465
|
+
position: absolute;
|
466
|
+
z-index: 10000;
|
467
|
+
font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
|
468
|
+
}
|
469
|
+
|
470
|
+
.sv-drag-drop-choices-shortcut__content.sv-drag-drop-choices-shortcut__content {
|
471
|
+
min-width: 100px;
|
472
|
+
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));
|
473
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
474
|
+
border-radius: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
475
|
+
padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
476
|
+
margin-left: 0;
|
477
|
+
}
|
478
|
+
|
463
479
|
:root {
|
464
480
|
--sjs-transition-duration: 150ms;
|
465
481
|
}
|
@@ -1875,6 +1891,15 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list-item__marker-icon use {
|
|
1875
1891
|
font-weight: 400;
|
1876
1892
|
}
|
1877
1893
|
|
1894
|
+
.sv-list__item.sv-list__item--selected.sv-list__item--group > .sv-list__item-body {
|
1895
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
1896
|
+
color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
|
1897
|
+
font-weight: 400;
|
1898
|
+
}
|
1899
|
+
.sv-list__item.sv-list__item--selected.sv-list__item--group > .sv-list__item-body use {
|
1900
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
1901
|
+
}
|
1902
|
+
|
1878
1903
|
.sv-list__item.sv-list__item--disabled .sv-list__item-body {
|
1879
1904
|
cursor: default;
|
1880
1905
|
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
@@ -4320,7 +4345,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
|
|
4320
4345
|
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4321
4346
|
font-size: var(--sjs-font-size, 16px);
|
4322
4347
|
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15)), inset 0 0 0 0px var(--sjs-general-backcolor, var(--background, #fff));
|
4323
|
-
transition:
|
4348
|
+
transition: box-shadow var(--sjs-transition-duration, 150ms), background-color var(--sjs-transition-duration, 150ms);
|
4324
4349
|
}
|
4325
4350
|
|
4326
4351
|
.sd-rating__item--fixed-size {
|
@@ -4377,6 +4402,9 @@ legend + sv-ng-rating-item + .sd-rating__item {
|
|
4377
4402
|
box-shadow: none;
|
4378
4403
|
transform: none;
|
4379
4404
|
}
|
4405
|
+
.sd-rating__item.sd-rating__item--preview:focus-within {
|
4406
|
+
box-shadow: none;
|
4407
|
+
}
|
4380
4408
|
.sd-rating__item.sd-rating__item--preview .sd-rating__item-text.sd-rating__item-text {
|
4381
4409
|
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4382
4410
|
}
|
@@ -4398,19 +4426,18 @@ legend + sv-ng-rating-item + .sd-rating__item {
|
|
4398
4426
|
}
|
4399
4427
|
|
4400
4428
|
.sd-rating__item:focus-within {
|
4401
|
-
|
4429
|
+
box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4402
4430
|
}
|
4403
4431
|
|
4404
4432
|
.sd-rating__item--selected {
|
4405
4433
|
background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4406
|
-
border: 2px solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4407
4434
|
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
4408
4435
|
font-weight: 600;
|
4409
|
-
box-shadow: 0px
|
4436
|
+
box-shadow: 0 0 0 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4410
4437
|
}
|
4411
4438
|
|
4412
4439
|
.sd-rating__item--selected:focus-within {
|
4413
|
-
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), inset 0 0 0
|
4440
|
+
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), inset 0 0 0 4px var(--sjs-general-backcolor, var(--background, #fff)), 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4414
4441
|
}
|
4415
4442
|
|
4416
4443
|
.sd-rating__item-smiley {
|
@@ -4420,12 +4447,16 @@ legend + sv-ng-rating-item + .sd-rating__item {
|
|
4420
4447
|
padding: calc(1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4421
4448
|
box-sizing: border-box;
|
4422
4449
|
min-width: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4450
|
+
min-height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4451
|
+
display: flex;
|
4452
|
+
justify-content: center;
|
4453
|
+
align-items: center;
|
4423
4454
|
text-align: center;
|
4424
4455
|
border: 2px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
4425
4456
|
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4426
4457
|
fill: var(--sjs-border-default, var(--border, #d6d6d6));
|
4427
4458
|
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), inset 0 0 0 0px var(--sjs-general-backcolor, var(--background, #fff));
|
4428
|
-
transition:
|
4459
|
+
transition: box-shadow var(--sjs-transition-duration, 150ms), background-color var(--sjs-transition-duration, 150ms);
|
4429
4460
|
}
|
4430
4461
|
.sd-rating__item-smiley svg {
|
4431
4462
|
display: block;
|
@@ -4436,6 +4467,7 @@ legend + sv-ng-rating-item + .sd-rating__item {
|
|
4436
4467
|
.sd-rating__item-smiley--small {
|
4437
4468
|
padding: calc(0.625 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4438
4469
|
min-width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4470
|
+
min-height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4439
4471
|
border-width: 1px;
|
4440
4472
|
}
|
4441
4473
|
.sd-rating__item-smiley--small svg {
|
@@ -4443,8 +4475,16 @@ legend + sv-ng-rating-item + .sd-rating__item {
|
|
4443
4475
|
height: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4444
4476
|
}
|
4445
4477
|
|
4478
|
+
.sd-rating__item-smiley--small:not(.sd-rating__item-smiley--selected):focus-within {
|
4479
|
+
box-shadow: 0 0 0 1px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4480
|
+
}
|
4481
|
+
|
4482
|
+
.sd-rating__item-smiley--colored.sd-rating__item-smiley--small:not(.sd-rating__item-smiley--selected):focus-within {
|
4483
|
+
box-shadow: 0 0 0 1px var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4484
|
+
}
|
4485
|
+
|
4446
4486
|
.sd-rating__item-smiley--small.sd-rating__item-smiley--selected:focus-within {
|
4447
|
-
box-shadow: inset 0 0 0
|
4487
|
+
box-shadow: inset 0 0 0 2px var(--sjs-general-backcolor, var(--background, #fff)), 0 0 0 1px var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4448
4488
|
}
|
4449
4489
|
|
4450
4490
|
legend + .sd-rating__item-smiley,
|
@@ -4453,7 +4493,9 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4453
4493
|
}
|
4454
4494
|
|
4455
4495
|
.sd-rating__item-smiley--scale-colored {
|
4456
|
-
|
4496
|
+
border-color: var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4497
|
+
fill: var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4498
|
+
transition: box-shadow var(--sjs-transition-duration, 150ms), opacity var(--sjs-transition-duration, 150ms), background-color var(--sjs-transition-duration, 150ms);
|
4457
4499
|
}
|
4458
4500
|
|
4459
4501
|
.sd-rating__item-smiley--error {
|
@@ -4461,6 +4503,9 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4461
4503
|
border-color: transparent;
|
4462
4504
|
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
4463
4505
|
}
|
4506
|
+
.sd-rating__item-smiley--error.sd-rating__item-smiley--scale-colored:hover {
|
4507
|
+
fill: var(--sd-rating-item-color, var(--sjs-general-forecolor-light, var(--foreground-light, #909090)));
|
4508
|
+
}
|
4464
4509
|
.sd-rating__item-smiley--error.sd-rating__item-smiley--scale-colored:not(.sd-rating__item-smiley--selected) {
|
4465
4510
|
opacity: initial;
|
4466
4511
|
}
|
@@ -4474,22 +4519,29 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4474
4519
|
fill: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
4475
4520
|
}
|
4476
4521
|
|
4522
|
+
.sd-rating__item-smiley.sd-rating__item-smiley--readonly {
|
4523
|
+
fill: var(--sjs-border-default, var(--border, #d6d6d6));
|
4524
|
+
border-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
4525
|
+
}
|
4526
|
+
|
4477
4527
|
.sd-rating__item-smiley.sd-rating__item-smiley--selected.sd-rating__item-smiley--readonly {
|
4478
4528
|
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4479
4529
|
border-color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4480
4530
|
background-color: unset;
|
4481
4531
|
}
|
4482
4532
|
|
4483
|
-
.sd-rating__item-smiley.sd-rating__item-smiley--preview {
|
4484
|
-
border
|
4485
|
-
border-width: 1px;
|
4533
|
+
.sd-rating__item-smiley.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview {
|
4534
|
+
border: 1px solid var(--sjs-general-forecolor, var(--foreground, #161616));
|
4486
4535
|
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4487
4536
|
}
|
4488
|
-
.sd-rating__item-smiley.sd-rating__item-smiley--preview
|
4537
|
+
.sd-rating__item-smiley.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview:focus-within {
|
4538
|
+
box-shadow: none;
|
4539
|
+
}
|
4540
|
+
.sd-rating__item-smiley.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview svg {
|
4489
4541
|
margin: 1px;
|
4490
4542
|
}
|
4491
4543
|
|
4492
|
-
.sd-rating__item-smiley.sd-rating__item-smiley--selected.sd-rating__item-smiley--preview {
|
4544
|
+
.sd-rating__item-smiley.sd-rating__item-smiley--selected.sd-rating__item-smiley--preview.sd-rating__item-smiley--preview {
|
4493
4545
|
fill: var(--sjs-general-backcolor, var(--background, #fff));
|
4494
4546
|
background-color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4495
4547
|
}
|
@@ -4500,24 +4552,33 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4500
4552
|
}
|
4501
4553
|
|
4502
4554
|
.sd-rating__item-smiley:focus-within {
|
4503
|
-
border
|
4555
|
+
border: none;
|
4556
|
+
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4557
|
+
}
|
4558
|
+
|
4559
|
+
.sd-rating__item-smiley:focus-within {
|
4560
|
+
border: none;
|
4561
|
+
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4504
4562
|
}
|
4505
4563
|
|
4506
4564
|
.sd-rating__item-smiley--selected {
|
4507
|
-
background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4508
|
-
border-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4565
|
+
background-color: var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4566
|
+
border-color: var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4509
4567
|
fill: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
4510
4568
|
font-weight: 600;
|
4511
4569
|
}
|
4512
4570
|
|
4513
4571
|
.sd-rating__item-smiley--selected:focus-within {
|
4514
|
-
|
4572
|
+
border: 0px solid var(--sjs-general-backcolor, var(--background, #fff));
|
4573
|
+
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), inset 0 0 0 4px var(--sjs-general-backcolor, var(--background, #fff)), 0 0 0 2px var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4515
4574
|
}
|
4516
4575
|
|
4517
4576
|
.sd-rating__item-smiley--scale-colored:not(.sd-rating__item-smiley--selected) {
|
4518
4577
|
opacity: 0.25;
|
4519
4578
|
}
|
4520
4579
|
.sd-rating__item-smiley--scale-colored:not(.sd-rating__item-smiley--selected).sd-rating__item-smiley--allowhover:hover {
|
4580
|
+
background-color: var(--sd-rating-item-color-light, var(--sjs-questionpanel-hovercolor, var(--sjs-general-backcolor-dark, rgb(248, 248, 248))));
|
4581
|
+
border-color: var(--sd-rating-item-color, var(--sjs-border-default, var(--border, #d6d6d6)));
|
4521
4582
|
opacity: 0.5;
|
4522
4583
|
}
|
4523
4584
|
|
@@ -4527,6 +4588,12 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4527
4588
|
|
4528
4589
|
.sd-rating__item-smiley--scale-colored:not(.sd-rating__item-smiley--selected):focus-within {
|
4529
4590
|
opacity: 1;
|
4591
|
+
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), 0 0 0 2px var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4592
|
+
}
|
4593
|
+
|
4594
|
+
.sd-rating__item-smiley--scale-colored.sd-rating__item-smiley--small:not(.sd-rating__item-smiley--selected):focus-within {
|
4595
|
+
opacity: 1;
|
4596
|
+
box-shadow: var(--sjs-shadow-small-reset, 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), 0 0 0 1px var(--sd-rating-item-color, var(--sjs-primary-backcolor, var(--primary, #19b394)));
|
4530
4597
|
}
|
4531
4598
|
|
4532
4599
|
.sd-rating__item-smiley--scale-colored.sd-rating__item-smiley--selected, .sd-rating__item-smiley--scale-colored.sd-rating__item-smiley--readonly, .sd-rating__item-smiley--scale-colored.sd-rating__item-smiley--preview {
|
@@ -4695,7 +4762,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4695
4762
|
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
4696
4763
|
}
|
4697
4764
|
|
4698
|
-
.sd-rating__item-star:focus-within svg {
|
4765
|
+
.sd-rating__item-star:not(.sd-rating__item-star--preview):focus-within svg {
|
4699
4766
|
stroke: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4700
4767
|
fill: transparent;
|
4701
4768
|
}
|
@@ -4710,19 +4777,19 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4710
4777
|
fill: var(--sjs-questionpanel-hovercolor, var(--sjs-general-backcolor-dark, rgb(248, 248, 248)));
|
4711
4778
|
}
|
4712
4779
|
|
4713
|
-
.sd-rating__item-star--selected.sd-rating__item-star--unhighlighted:focus-within svg {
|
4780
|
+
.sd-rating__item-star--selected:not(.sd-rating__item-star--preview).sd-rating__item-star--unhighlighted:focus-within svg {
|
4714
4781
|
stroke: var(--sjs-border-default, var(--border, #d6d6d6));
|
4715
4782
|
fill: var(--sjs-border-default, var(--border, #d6d6d6));
|
4716
4783
|
}
|
4717
4784
|
|
4718
|
-
.sd-rating__item-star--selected:focus-within svg {
|
4785
|
+
.sd-rating__item-star--selected:not(.sd-rating__item-star--preview):focus-within svg {
|
4719
4786
|
stroke: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4720
4787
|
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
4721
4788
|
}
|
4722
|
-
.sd-rating__item-star--selected:focus-within .sv-star {
|
4789
|
+
.sd-rating__item-star--selected:not(.sd-rating__item-star--preview):focus-within .sv-star {
|
4723
4790
|
opacity: 0;
|
4724
4791
|
}
|
4725
|
-
.sd-rating__item-star--selected:focus-within .sv-star-2 {
|
4792
|
+
.sd-rating__item-star--selected:not(.sd-rating__item-star--preview):focus-within .sv-star-2 {
|
4726
4793
|
opacity: 1;
|
4727
4794
|
}
|
4728
4795
|
|
@@ -4734,7 +4801,6 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4734
4801
|
font-size: var(--sjs-internal-font-editorfont-size);
|
4735
4802
|
line-height: calc(1.5 * (var(--sjs-internal-font-editorfont-size)));
|
4736
4803
|
display: inline-block;
|
4737
|
-
border: 2px solid transparent;
|
4738
4804
|
box-sizing: border-box;
|
4739
4805
|
transition: color var(--sjs-transition-duration, 150ms);
|
4740
4806
|
}
|
@@ -4742,6 +4808,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4742
4808
|
margin-top: calc(1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4743
4809
|
margin-bottom: calc(1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4744
4810
|
color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
|
4811
|
+
border: 2px solid rgba(0, 0, 0, 0);
|
4745
4812
|
}
|
4746
4813
|
.sd-rating__item-text.sd-rating__item-text.sd-rating__min-text {
|
4747
4814
|
margin-right: var(--sjs-base-unit, var(--base-unit, 8px));
|
@@ -4757,6 +4824,15 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
|
|
4757
4824
|
.sd-rating__item-text.sd-rating__item-text.sd-rating__item--fixed-size {
|
4758
4825
|
min-width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
4759
4826
|
}
|
4827
|
+
.sd-rating__item-text.sd-rating__item-text::after {
|
4828
|
+
display: block;
|
4829
|
+
content: attr(data-text);
|
4830
|
+
font-weight: 600;
|
4831
|
+
height: 0;
|
4832
|
+
color: transparent;
|
4833
|
+
overflow: hidden;
|
4834
|
+
visibility: hidden;
|
4835
|
+
}
|
4760
4836
|
|
4761
4837
|
.sd-rating--wrappable .sd-rating__item-text {
|
4762
4838
|
max-width: 100%;
|
@@ -7382,12 +7458,12 @@ svg.sd-action--icon {
|
|
7382
7458
|
padding: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7383
7459
|
display: flex;
|
7384
7460
|
flex-direction: column;
|
7385
|
-
transition: 0.25s padding ease-out;
|
7386
7461
|
}
|
7387
7462
|
|
7388
7463
|
.sd-progress-buttons__list-container {
|
7389
7464
|
display: flex;
|
7390
7465
|
overflow: hidden;
|
7466
|
+
margin: 0 calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7391
7467
|
}
|
7392
7468
|
|
7393
7469
|
.sd-progress-buttons__connector {
|
@@ -7443,14 +7519,12 @@ svg.sd-action--icon {
|
|
7443
7519
|
}
|
7444
7520
|
.sd-progress-buttons__list li .sd-progress-buttons__button .sd-progress-buttons__button-background {
|
7445
7521
|
position: absolute;
|
7446
|
-
width:
|
7447
|
-
height:
|
7522
|
+
width: calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7523
|
+
height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7448
7524
|
top: calc(-0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7449
|
-
left: calc(-
|
7525
|
+
left: calc(-1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7450
7526
|
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
7451
7527
|
z-index: -2;
|
7452
|
-
border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
7453
|
-
border-radius: 50%;
|
7454
7528
|
}
|
7455
7529
|
.sd-progress-buttons__list li .sd-progress-buttons__button .sd-progress-buttons__button-content {
|
7456
7530
|
position: absolute;
|
@@ -7467,11 +7541,14 @@ svg.sd-action--icon {
|
|
7467
7541
|
}
|
7468
7542
|
.sd-progress-buttons__list li:hover .sd-progress-buttons__button {
|
7469
7543
|
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
7470
|
-
padding: calc(0.
|
7544
|
+
padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7471
7545
|
margin: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7472
|
-
border: calc(0.
|
7546
|
+
border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
7473
7547
|
background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
7474
7548
|
}
|
7549
|
+
.sd-progress-buttons__list li:hover .sd-progress-buttons__button .sd-progress-buttons__button-background {
|
7550
|
+
left: calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7551
|
+
}
|
7475
7552
|
.sd-progress-buttons__list li:hover .sd-progress-buttons__button .sd-progress-buttons__button-content {
|
7476
7553
|
top: calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7477
7554
|
left: calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
@@ -7498,8 +7575,11 @@ svg.sd-action--icon {
|
|
7498
7575
|
border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
7499
7576
|
background-color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
7500
7577
|
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
7501
|
-
padding: calc(0.
|
7502
|
-
margin: calc(0.
|
7578
|
+
padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7579
|
+
margin: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7580
|
+
}
|
7581
|
+
.sd-progress-buttons__list .sd-progress-buttons__list-element--current .sd-progress-buttons__button .sd-progress-buttons__button-background {
|
7582
|
+
left: calc(-0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7503
7583
|
}
|
7504
7584
|
.sd-progress-buttons__list .sd-progress-buttons__list-element--current .sd-progress-buttons__button .sd-progress-buttons__button-content {
|
7505
7585
|
border: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
@@ -7555,6 +7635,9 @@ svg.sd-action--icon {
|
|
7555
7635
|
margin-bottom: var(--sjs-base-unit, var(--base-unit, 8px));
|
7556
7636
|
}
|
7557
7637
|
|
7638
|
+
.sd-progress-buttons--numbered .sd-progress-buttons__list-container {
|
7639
|
+
margin: 0 calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7640
|
+
}
|
7558
7641
|
.sd-progress-buttons--numbered .sd-progress-buttons__list li:not(:first-child) > .sd-progress-buttons__connector {
|
7559
7642
|
bottom: calc(2.175 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7560
7643
|
right: calc(50% + 8px);
|
@@ -7564,8 +7647,16 @@ svg.sd-action--icon {
|
|
7564
7647
|
width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7565
7648
|
height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7566
7649
|
}
|
7650
|
+
.sd-progress-buttons--numbered .sd-progress-buttons__list li .sd-progress-buttons__button .sd-progress-buttons__button-background {
|
7651
|
+
height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7652
|
+
width: calc(4.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7653
|
+
}
|
7567
7654
|
.sd-progress-buttons--numbered .sd-progress-buttons__list li:hover .sd-progress-buttons__button {
|
7568
|
-
padding: calc(0.
|
7655
|
+
padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7656
|
+
}
|
7657
|
+
|
7658
|
+
.sd-progress-buttons--with-titles .sd-progress-buttons__list-container {
|
7659
|
+
margin: 0;
|
7569
7660
|
}
|
7570
7661
|
|
7571
7662
|
.sd-root-modern--mobile .sd-progress-buttons__list,
|
@@ -7586,10 +7677,6 @@ svg.sd-action--icon {
|
|
7586
7677
|
padding: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7587
7678
|
}
|
7588
7679
|
|
7589
|
-
.sv-root--sticky-top .sd-progress-buttons {
|
7590
|
-
padding: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7591
|
-
}
|
7592
|
-
|
7593
7680
|
.sd-progress-buttons--fit-survey-width {
|
7594
7681
|
max-width: calc(90 * (var(--sjs-base-unit, var(--base-unit, 8px))));
|
7595
7682
|
box-sizing: border-box;
|