survey-react 1.9.85 → 1.9.86

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.
Files changed (14) hide show
  1. package/defaultV2.css +102 -106
  2. package/defaultV2.css.map +1 -1
  3. package/defaultV2.min.css +2 -2
  4. package/modern.css +49 -51
  5. package/modern.css.map +1 -1
  6. package/modern.min.css +2 -2
  7. package/package.json +1 -1
  8. package/survey.css +19 -19
  9. package/survey.css.map +1 -1
  10. package/survey.min.css +2 -2
  11. package/survey.react.d.ts +59 -6
  12. package/survey.react.js +121 -59
  13. package/survey.react.js.map +1 -1
  14. package/survey.react.min.js +3 -3
package/modern.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * surveyjs - Survey JavaScript library v1.9.85
2
+ * surveyjs - Survey JavaScript library v1.9.86
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
  */
@@ -104,12 +104,12 @@ sv-popup {
104
104
  .sv-popup__shadow {
105
105
  width: 100%;
106
106
  height: 100%;
107
- border-radius: calc(1 * var(--base-unit, 8px));
107
+ border-radius: calc(2 * var(--sjs-corner-radius, 4px));
108
108
  }
109
109
 
110
110
  .sv-popup__body-content {
111
111
  background-color: var(--background, #fff);
112
- border-radius: calc(0.5 * var(--base-unit, 8px));
112
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
113
113
  width: 100%;
114
114
  height: 100%;
115
115
  box-sizing: border-box;
@@ -151,7 +151,7 @@ sv-popup {
151
151
  .sv-popup--overlay.sv-popup--overlay .sv-popup__body-content {
152
152
  max-height: var(--sv-popup-overlay-height, 100vh);
153
153
  max-width: 100vw;
154
- border-radius: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) 0px 0px;
154
+ border-radius: calc(4 * var(--sjs-corner-radius, 4px)) calc(4 * var(--sjs-corner-radius, 4px)) 0px 0px;
155
155
  background: var(--background, #fff);
156
156
  box-shadow: 0px calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) rgba(0, 0, 0, 0.1);
157
157
  padding: calc(3 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
@@ -247,7 +247,7 @@ sv-popup {
247
247
 
248
248
  .sv-popup__body-header {
249
249
  font-family: Open Sans;
250
- font-size: calc(3 * var(--base-unit, 8px));
250
+ font-size: calc(1.5 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
251
251
  line-height: calc(4 * var(--base-unit, 8px));
252
252
  font-style: normal;
253
253
  font-weight: 700;
@@ -268,13 +268,13 @@ sv-popup {
268
268
  padding: calc(2 * var(--base-unit, 8px)) calc(6 * var(--base-unit, 8px));
269
269
  background: var(--background, #fff);
270
270
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
271
- border-radius: 4px;
271
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
272
272
  margin: 2px;
273
273
  cursor: pointer;
274
274
  font-family: var(--font-family, var(--font-family));
275
275
  font-style: normal;
276
276
  font-weight: 600;
277
- font-size: calc(2 * var(--base-unit, 8px));
277
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
278
278
  line-height: calc(3 * var(--base-unit, 8px));
279
279
  text-align: center;
280
280
  color: var(--primary, #19b394);
@@ -404,7 +404,7 @@ sv-popup {
404
404
  }
405
405
  .sv-dropdown-popup.sv-popup--overlay .sv-list__input {
406
406
  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
407
- font-size: calc(2 * var(--base-unit, 8px));
407
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
408
408
  line-height: calc(3 * var(--base-unit, 8px));
409
409
  font-family: var(--font-family);
410
410
  padding: calc(0.5 * var(--base-unit, 8px)) 0 calc(0.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
@@ -441,10 +441,9 @@ sv-popup {
441
441
  width: auto;
442
442
  min-width: min(40 * var(--base-unit, 8px), var(--sv-popup-overlay-max-width));
443
443
  max-width: var(--sv-popup-overlay-max-width);
444
- border-radius: calc(0.5 * var(--base-unit, 8px));
444
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
445
445
  overflow: hidden;
446
446
  margin: 0;
447
- border-radius: 4px;
448
447
  }
449
448
  .sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__content,
450
449
  .sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__scrolling-content,
@@ -469,7 +468,7 @@ sv-popup {
469
468
  display: inline-block;
470
469
  vertical-align: top;
471
470
  margin-top: 22px;
472
- font-size: 14px;
471
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
473
472
  width: 16px;
474
473
  height: 16px;
475
474
  cursor: pointer;
@@ -480,7 +479,7 @@ sv-popup {
480
479
  display: inline-block;
481
480
  vertical-align: top;
482
481
  margin-top: 22px;
483
- font-size: 14px;
482
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
484
483
  width: 16px;
485
484
  height: 16px;
486
485
  cursor: pointer;
@@ -508,7 +507,7 @@ sv-popup {
508
507
 
509
508
  .sv_progress-buttons__list li {
510
509
  width: 138px;
511
- font-size: 14px;
510
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
512
511
  font-family: var(--font-family, var(--font-family));
513
512
  position: relative;
514
513
  text-align: center;
@@ -580,7 +579,7 @@ sv-popup {
580
579
  .sv_progress-toc .sv-list__item-body {
581
580
  padding-inline-start: 16px;
582
581
  padding-inline-end: 16px;
583
- border-radius: 3px;
582
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
584
583
  padding-top: 12px;
585
584
  padding-bottom: 12px;
586
585
  }
@@ -595,7 +594,7 @@ sv-popup {
595
594
 
596
595
  .sv-container-modern {
597
596
  color: var(--text-color, #404040);
598
- font-size: var(--font-size, 16px);
597
+ font-size: var(--font-size, var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
599
598
  font-family: var(--font-family, var(--font-family));
600
599
  margin-bottom: calc(10 * var(--base-unit, 8px));
601
600
  }
@@ -2503,7 +2502,7 @@ select.sv-dropdown {
2503
2502
  padding: calc(1 * var(--base-unit, 8px));
2504
2503
  box-sizing: border-box;
2505
2504
  border: none;
2506
- border-radius: 2px;
2505
+ border-radius: calc(0.5 * var(--sjs-corner-radius, 4px));
2507
2506
  background-color: transparent;
2508
2507
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
2509
2508
  cursor: pointer;
@@ -2518,14 +2517,14 @@ button.sv-action-bar-item {
2518
2517
 
2519
2518
  .sv-action-bar--default-size-mode .sv-action-bar-item {
2520
2519
  height: calc(5 * var(--base-unit, 8px));
2521
- font-size: calc(2 * var(--base-unit, 8px));
2520
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
2522
2521
  line-height: calc(3 * var(--base-unit, 8px));
2523
2522
  margin: 0 calc(1 * var(--base-unit, 8px));
2524
2523
  }
2525
2524
 
2526
2525
  .sv-action-bar--small-size-mode .sv-action-bar-item {
2527
2526
  height: calc(4 * var(--base-unit, 8px));
2528
- font-size: calc(1.5 * var(--base-unit, 8px));
2527
+ font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
2529
2528
  line-height: calc(2 * var(--base-unit, 8px));
2530
2529
  margin: 0 calc(0.5 * var(--base-unit, 8px));
2531
2530
  }
@@ -2595,11 +2594,11 @@ button.sv-action-bar-item {
2595
2594
  padding: calc(1 * var(--base-unit, 8px));
2596
2595
  box-sizing: border-box;
2597
2596
  border: none;
2598
- border-radius: 2px;
2597
+ border-radius: calc(0.5 * var(--sjs-corner-radius, 4px));
2599
2598
  background-color: transparent;
2600
2599
  cursor: pointer;
2601
2600
  line-height: calc(3 * var(--base-unit, 8px));
2602
- font-size: calc(2 * var(--base-unit, 8px));
2601
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
2603
2602
  font-family: var(--font-family, var(--font-family));
2604
2603
  }
2605
2604
 
@@ -2665,7 +2664,7 @@ button.sv-action-bar-item {
2665
2664
  z-index: 1000;
2666
2665
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
2667
2666
  font-family: var(--font-family, var(--font-family));
2668
- font-size: calc(2 * var(--base-unit, 8px));
2667
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
2669
2668
  padding-left: calc(2.5 * var(--base-unit, 8px));
2670
2669
  line-height: calc(3 * var(--base-unit, 8px));
2671
2670
  }
@@ -2723,12 +2722,12 @@ sv-popup {
2723
2722
  .sv-popup__shadow {
2724
2723
  width: 100%;
2725
2724
  height: 100%;
2726
- border-radius: calc(1 * var(--base-unit, 8px));
2725
+ border-radius: calc(2 * var(--sjs-corner-radius, 4px));
2727
2726
  }
2728
2727
 
2729
2728
  .sv-popup__body-content {
2730
2729
  background-color: var(--background, #fff);
2731
- border-radius: calc(0.5 * var(--base-unit, 8px));
2730
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
2732
2731
  width: 100%;
2733
2732
  height: 100%;
2734
2733
  box-sizing: border-box;
@@ -2770,7 +2769,7 @@ sv-popup {
2770
2769
  .sv-popup--overlay.sv-popup--overlay .sv-popup__body-content {
2771
2770
  max-height: var(--sv-popup-overlay-height, 100vh);
2772
2771
  max-width: 100vw;
2773
- border-radius: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) 0px 0px;
2772
+ border-radius: calc(4 * var(--sjs-corner-radius, 4px)) calc(4 * var(--sjs-corner-radius, 4px)) 0px 0px;
2774
2773
  background: var(--background, #fff);
2775
2774
  box-shadow: 0px calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) rgba(0, 0, 0, 0.1);
2776
2775
  padding: calc(3 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
@@ -2866,7 +2865,7 @@ sv-popup {
2866
2865
 
2867
2866
  .sv-popup__body-header {
2868
2867
  font-family: Open Sans;
2869
- font-size: calc(3 * var(--base-unit, 8px));
2868
+ font-size: calc(1.5 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
2870
2869
  line-height: calc(4 * var(--base-unit, 8px));
2871
2870
  font-style: normal;
2872
2871
  font-weight: 700;
@@ -2887,13 +2886,13 @@ sv-popup {
2887
2886
  padding: calc(2 * var(--base-unit, 8px)) calc(6 * var(--base-unit, 8px));
2888
2887
  background: var(--background, #fff);
2889
2888
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
2890
- border-radius: 4px;
2889
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
2891
2890
  margin: 2px;
2892
2891
  cursor: pointer;
2893
2892
  font-family: var(--font-family, var(--font-family));
2894
2893
  font-style: normal;
2895
2894
  font-weight: 600;
2896
- font-size: calc(2 * var(--base-unit, 8px));
2895
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
2897
2896
  line-height: calc(3 * var(--base-unit, 8px));
2898
2897
  text-align: center;
2899
2898
  color: var(--primary, #19b394);
@@ -3023,7 +3022,7 @@ sv-popup {
3023
3022
  }
3024
3023
  .sv-dropdown-popup.sv-popup--overlay .sv-list__input {
3025
3024
  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
3026
- font-size: calc(2 * var(--base-unit, 8px));
3025
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3027
3026
  line-height: calc(3 * var(--base-unit, 8px));
3028
3027
  font-family: var(--font-family);
3029
3028
  padding: calc(0.5 * var(--base-unit, 8px)) 0 calc(0.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
@@ -3060,10 +3059,9 @@ sv-popup {
3060
3059
  width: auto;
3061
3060
  min-width: min(40 * var(--base-unit, 8px), var(--sv-popup-overlay-max-width));
3062
3061
  max-width: var(--sv-popup-overlay-max-width);
3063
- border-radius: calc(0.5 * var(--base-unit, 8px));
3062
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
3064
3063
  overflow: hidden;
3065
3064
  margin: 0;
3066
- border-radius: 4px;
3067
3065
  }
3068
3066
  .sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__content,
3069
3067
  .sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__scrolling-content,
@@ -3075,7 +3073,7 @@ sv-popup {
3075
3073
  display: flex;
3076
3074
  align-items: center;
3077
3075
  flex-direction: row;
3078
- font-size: calc(2 * var(--base-unit, 8px));
3076
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3079
3077
  overflow: auto;
3080
3078
  border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
3081
3079
  }
@@ -3096,7 +3094,7 @@ sv-popup {
3096
3094
  padding: 11px calc(2 * var(--base-unit, 8px));
3097
3095
  line-height: calc(3 * var(--base-unit, 8px));
3098
3096
  outline: none;
3099
- font-size: calc(2 * var(--base-unit, 8px));
3097
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3100
3098
  font-weight: 400;
3101
3099
  background: var(--background, #fff);
3102
3100
  cursor: pointer;
@@ -3213,7 +3211,7 @@ sv-popup {
3213
3211
  background-color: cadetblue;
3214
3212
  padding: 1px;
3215
3213
  font-family: var(--font-family, var(--font-family));
3216
- font-size: 14px;
3214
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3217
3215
  font-style: normal;
3218
3216
  font-weight: 400;
3219
3217
  line-height: 1.42857143;
@@ -3232,7 +3230,7 @@ sv-popup {
3232
3230
  background-clip: padding-box;
3233
3231
  border: 1px solid #ccc;
3234
3232
  border: 1px solid rgba(0, 0, 0, 0.2);
3235
- border-radius: 6px;
3233
+ border-radius: calc(1.5 * var(--sjs-corner-radius, 4px));
3236
3234
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
3237
3235
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
3238
3236
  line-break: auto;
@@ -3242,10 +3240,10 @@ sv-popup {
3242
3240
  .sv_window_title {
3243
3241
  padding: 8px 14px;
3244
3242
  margin: 0;
3245
- font-size: 14px;
3243
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3246
3244
  background-color: #f7f7f7;
3247
3245
  border-bottom: 1px solid #ebebeb;
3248
- border-radius: 5px 5px 0 0;
3246
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px)) calc(1 * var(--sjs-corner-radius, 4px)) 0 0;
3249
3247
  }
3250
3248
 
3251
3249
  .sv_window_content {
@@ -3259,7 +3257,7 @@ sv-popup {
3259
3257
  .sv_window_title a:link,
3260
3258
  .sv_window_title a:visited {
3261
3259
  text-decoration: none;
3262
- font-size: 14px;
3260
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3263
3261
  font-style: normal;
3264
3262
  color: black;
3265
3263
  }
@@ -3280,8 +3278,8 @@ sv-popup {
3280
3278
 
3281
3279
  .sv-brand-info__text {
3282
3280
  font-weight: 600;
3283
- font-size: 16px;
3284
- line-height: 24px;
3281
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3282
+ line-height: calc(3 * var(--base-unit, 8px));
3285
3283
  color: #161616;
3286
3284
  }
3287
3285
 
@@ -3294,8 +3292,8 @@ sv-popup {
3294
3292
 
3295
3293
  .sv-brand-info__terms {
3296
3294
  font-weight: 400;
3297
- font-size: 12px;
3298
- line-height: 16px;
3295
+ font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3296
+ line-height: calc(2 * var(--base-unit, 8px));
3299
3297
  }
3300
3298
  .sv-brand-info__terms a {
3301
3299
  color: #909090;
@@ -3373,7 +3371,7 @@ sv-popup {
3373
3371
  justify-content: center;
3374
3372
  background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
3375
3373
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
3376
- font-size: calc(2 * var(--base-unit, 8px));
3374
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3377
3375
  border-radius: 100%;
3378
3376
  border: calc(0.25 * var(--base-unit, 8px)) solid transparent;
3379
3377
  width: calc(5 * var(--base-unit, 8px));
@@ -3395,7 +3393,7 @@ sv-popup {
3395
3393
  text-overflow: ellipsis;
3396
3394
  white-space: nowrap;
3397
3395
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
3398
- font-size: calc(2 * var(--base-unit, 8px));
3396
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3399
3397
  line-height: calc(3 * var(--base-unit, 8px));
3400
3398
  margin: 0 calc(2 * var(--base-unit, 8px));
3401
3399
  }
@@ -3518,7 +3516,7 @@ sv-popup {
3518
3516
 
3519
3517
  .sv-list__empty-text {
3520
3518
  line-height: calc(3 * var(--base-unit, 8px));
3521
- font-size: calc(2 * var(--base-unit, 8px));
3519
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3522
3520
  font-weight: 400;
3523
3521
  text-align: center;
3524
3522
  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
@@ -3543,7 +3541,7 @@ sv-popup {
3543
3541
  padding-inline-end: calc(8 * var(--base-unit, 8px));
3544
3542
  padding-inline-start: calc(2 * var(--base-unit, 8px));
3545
3543
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
3546
- font-size: calc(2 * var(--base-unit, 8px));
3544
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3547
3545
  line-height: calc(3 * var(--base-unit, 8px));
3548
3546
  cursor: pointer;
3549
3547
  overflow: hidden;
@@ -3556,7 +3554,7 @@ sv-popup {
3556
3554
  }
3557
3555
  .sv-list__item.sv-list__item--focused:not(.sv-list__item--selected) .sv-list__item-body {
3558
3556
  border: calc(0.25 * var(--base-unit, 8px)) solid var(--sjs-border-light, var(--border-light, #eaeaea));
3559
- border-radius: 3px;
3557
+ border-radius: calc(1 * var(--sjs-corner-radius, 4px));
3560
3558
  padding-block: calc(0.75 * var(--base-unit, 8px));
3561
3559
  padding-inline-end: calc(7.75 * var(--base-unit, 8px));
3562
3560
  padding-inline-start: calc(1.75 * var(--base-unit, 8px));
@@ -3679,7 +3677,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
3679
3677
  box-sizing: border-box;
3680
3678
  width: 100%;
3681
3679
  outline: none;
3682
- font-size: 1em;
3680
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3683
3681
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
3684
3682
  padding: calc(1.5 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
3685
3683
  padding-inline-start: calc(7 * var(--base-unit, 8px));
@@ -3712,13 +3710,13 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
3712
3710
  opacity: 0;
3713
3711
  padding: calc(3 * var(--base-unit, 8px)) calc(6 * var(--base-unit, 8px));
3714
3712
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
3715
- border-radius: calc(1 * var(--base-unit, 8px));
3713
+ border-radius: calc(2 * var(--sjs-corner-radius, 4px));
3716
3714
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
3717
3715
  min-width: calc(30 * var(--base-unit, 8px));
3718
3716
  text-align: center;
3719
3717
  z-index: 1600;
3720
3718
  font-family: var(--font-family, var(--font-family));
3721
- font-size: calc(2 * var(--base-unit, 8px));
3719
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3722
3720
  line-height: calc(3 * var(--base-unit, 8px));
3723
3721
  display: flex;
3724
3722
  flex-direction: row;
@@ -3764,13 +3762,13 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
3764
3762
 
3765
3763
  .sv-save-data_root.sv-save-data_error .sv-save-data_button {
3766
3764
  font-weight: 600;
3767
- font-size: calc(2 * var(--base-unit, 8px));
3765
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
3768
3766
  line-height: calc(3 * var(--base-unit, 8px));
3769
3767
  height: calc(5 * var(--base-unit, 8px));
3770
3768
  color: #ffffff;
3771
3769
  background-color: var(--red, #e60a3e);
3772
3770
  border: calc(0.25 * var(--base-unit, 8px)) solid #ffffff;
3773
- border-radius: calc(0.75 * var(--base-unit, 8px));
3771
+ border-radius: calc(1.5 * var(--sjs-corner-radius, 4px));
3774
3772
  padding: calc(1 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
3775
3773
  display: flex;
3776
3774
  align-items: center;