survey-creator-core 1.9.95 → 1.9.97
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/fonts.fontless.css +1 -1
- package/fonts.fontless.min.css +1 -1
- package/package.json +2 -2
- package/survey-creator-core.css +885 -875
- package/survey-creator-core.fontless.css +884 -874
- package/survey-creator-core.fontless.css.map +1 -1
- package/survey-creator-core.fontless.min.css +39 -39
- package/survey-creator-core.i18n.js +1 -1
- package/survey-creator-core.i18n.min.js +1 -1
- package/survey-creator-core.js +433 -159
- package/survey-creator-core.js.map +1 -1
- package/survey-creator-core.min.css +40 -40
- package/survey-creator-core.min.js +2 -2
- package/typings/components/matrix-cell.d.ts +1 -0
- package/typings/components/string-editor.d.ts +1 -1
- package/typings/components/tabs/logic-theme.d.ts +3 -0
- package/typings/components/tabs/test.d.ts +2 -0
- package/typings/components/tabs/theme.d.ts +8 -2
- package/typings/components/tabs/translation-theme.d.ts +0 -1
- package/typings/creator-base.d.ts +14 -3
- package/typings/creator-settings.d.ts +1 -0
- package/typings/custom-questions/question-color.d.ts +1 -0
- package/typings/custom-questions/question-spin-editor.d.ts +1 -0
- package/typings/editorLocalization.d.ts +4 -0
- package/typings/localization/english.d.ts +4 -0
- package/typings/plugins/undo-redo/undo-redo-controller.d.ts +1 -0
- package/typings/plugins/undo-redo/undo-redo-manager.d.ts +7 -0
- package/typings/property-grid/index.d.ts +2 -0
- package/typings/property-grid/matrices.d.ts +1 -0
- package/typings/property-grid-theme/property-grid.d.ts +4 -1
- package/typings/textWorker.d.ts +33 -6
package/survey-creator-core.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* SurveyJS Creator v1.9.
|
|
2
|
+
* SurveyJS Creator v1.9.97
|
|
3
3
|
* (c) 2015-2023 Devsoft Baltic OÜ - http://surveyjs.io/
|
|
4
4
|
* Github: https://github.com/surveyjs/survey-creator
|
|
5
5
|
* License: https://surveyjs.io/Licenses#SurveyCreator
|
|
@@ -225,41 +225,41 @@
|
|
|
225
225
|
}
|
|
226
226
|
|
|
227
227
|
/*# sourceMappingURL=fonts.fontless.css.map*//*!
|
|
228
|
-
* SurveyJS Creator v1.9.
|
|
228
|
+
* SurveyJS Creator v1.9.97
|
|
229
229
|
* (c) 2015-2023 Devsoft Baltic OÜ - http://surveyjs.io/
|
|
230
230
|
* Github: https://github.com/surveyjs/survey-creator
|
|
231
231
|
* License: https://surveyjs.io/Licenses#SurveyCreator
|
|
232
232
|
*/
|
|
233
233
|
.svc-context-container {
|
|
234
234
|
display: flex;
|
|
235
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
235
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
236
236
|
width: max-content;
|
|
237
237
|
}
|
|
238
238
|
|
|
239
239
|
.svc-context-button {
|
|
240
240
|
display: block;
|
|
241
241
|
box-sizing: border-box;
|
|
242
|
-
background-color: var(--background, #fff);
|
|
242
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
243
243
|
border-radius: 50%;
|
|
244
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
245
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
244
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
245
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
246
246
|
cursor: pointer;
|
|
247
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
247
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
248
248
|
outline: none;
|
|
249
249
|
}
|
|
250
250
|
.svc-context-button use {
|
|
251
|
-
fill: var(--foreground-light, #909090);
|
|
251
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
252
252
|
}
|
|
253
253
|
|
|
254
254
|
.svc-context-button:hover use, .svc-context-button:focus use {
|
|
255
|
-
fill: var(--primary, #19b394);
|
|
255
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
256
256
|
}
|
|
257
257
|
|
|
258
258
|
.svc-context-button--danger:hover use, .svc-context-button--danger:focus use {
|
|
259
|
-
fill: var(--red, #e60a3e);
|
|
259
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
260
260
|
}
|
|
261
261
|
.svc-embed-tab__content {
|
|
262
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
262
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
263
263
|
font-family: var(--font-family);
|
|
264
264
|
}
|
|
265
265
|
.svc-embed-tab__content .spg-row {
|
|
@@ -267,13 +267,13 @@
|
|
|
267
267
|
}
|
|
268
268
|
.svc-embed-tab__content .spg-row .spg-question__content .spg-comment:disabled,
|
|
269
269
|
.svc-embed-tab__content .spg-row .spg-question__content .spg-comment:disabled::placeholder {
|
|
270
|
-
color: var(--foreground, #161616);
|
|
270
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
271
271
|
}
|
|
272
272
|
.svc-embed-tab__content .spg-question__description {
|
|
273
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
274
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
275
|
-
color: var(--foreground, #161616);
|
|
276
|
-
padding: calc(2 * var(--base-unit, 8px)) 0 calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
273
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
274
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
275
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
276
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
277
277
|
}
|
|
278
278
|
|
|
279
279
|
.sv-question-embed__title {
|
|
@@ -287,7 +287,7 @@
|
|
|
287
287
|
svc-tab-json-editor-ace {
|
|
288
288
|
width: 100%;
|
|
289
289
|
height: 100%;
|
|
290
|
-
background: var(--background-dim, #f3f3f3);
|
|
290
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
291
291
|
}
|
|
292
292
|
|
|
293
293
|
.svc-json-editor-tab__content {
|
|
@@ -301,7 +301,7 @@ svc-tab-json-editor-ace {
|
|
|
301
301
|
svc-tab-json-editor-textarea {
|
|
302
302
|
width: 100%;
|
|
303
303
|
height: 100%;
|
|
304
|
-
background: var(--background-dim, #f3f3f3);
|
|
304
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
305
305
|
}
|
|
306
306
|
|
|
307
307
|
.svc-json-editor-tab__content {
|
|
@@ -317,33 +317,33 @@ svc-tab-json-editor-textarea {
|
|
|
317
317
|
.svc-json-editor-tab__errros_button {
|
|
318
318
|
position: absolute;
|
|
319
319
|
top: 0%;
|
|
320
|
-
right: calc(0% + (2 * var(--base-unit, 8px)));
|
|
321
|
-
min-height: calc(2.5 * var(--base-unit, 8px));
|
|
322
|
-
max-height: calc(2.5 * var(--base-unit, 8px));
|
|
320
|
+
right: calc(0% + (2 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
321
|
+
min-height: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
322
|
+
max-height: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
323
323
|
border: none;
|
|
324
|
-
background-color: var(--primary, #19b394);
|
|
325
|
-
color: var(--primary-foreground, #fff);
|
|
324
|
+
background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
325
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
326
326
|
font-weight: bold;
|
|
327
327
|
}
|
|
328
328
|
|
|
329
329
|
.svc-json-editor-tab__content-errors {
|
|
330
330
|
position: absolute;
|
|
331
331
|
right: 0%;
|
|
332
|
-
top: calc(0% + (3 * var(--base-unit, 8px)));
|
|
333
|
-
max-width: calc(100% - (2 * var(--base-unit, 8px)));
|
|
334
|
-
padding: var(--base-unit, 8px);
|
|
335
|
-
background-color: var(--background, #fff);
|
|
332
|
+
top: calc(0% + (3 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
333
|
+
max-width: calc(100% - (2 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
334
|
+
padding: var(--sjs-base-unit, var(--base-unit, 8px));
|
|
335
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
336
336
|
background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.1));
|
|
337
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
337
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
338
338
|
border-radius: 1px;
|
|
339
|
-
color: var(--foreground, #161616);
|
|
339
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
340
340
|
font-family: monospace;
|
|
341
341
|
}
|
|
342
342
|
.svc-json-editor-tab__content-errors span {
|
|
343
343
|
white-space: pre-line;
|
|
344
344
|
}
|
|
345
345
|
.svc-json-editor-tab__content-errors span > b {
|
|
346
|
-
color: var(--red, #e60a3e);
|
|
346
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
347
347
|
}
|
|
348
348
|
|
|
349
349
|
.svc-json-editor-tab__content-errors:empty {
|
|
@@ -476,7 +476,7 @@ svc-tab-json-editor-textarea {
|
|
|
476
476
|
svc-tab-test {
|
|
477
477
|
width: 100%;
|
|
478
478
|
height: 100%;
|
|
479
|
-
background: var(--background-dim, #f3f3f3);
|
|
479
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
480
480
|
}
|
|
481
481
|
|
|
482
482
|
.svc-test-tab__content .svc-plugin-tab__content {
|
|
@@ -486,13 +486,13 @@ svc-tab-test {
|
|
|
486
486
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_completed_page {
|
|
487
487
|
margin: 0;
|
|
488
488
|
border: 0;
|
|
489
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
489
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
490
490
|
}
|
|
491
491
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_body {
|
|
492
492
|
border: 0;
|
|
493
493
|
}
|
|
494
494
|
.svc-test-tab__content .svc-plugin-tab__content .svc-preview__test-again {
|
|
495
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
495
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
496
496
|
margin-left: auto;
|
|
497
497
|
margin-right: auto;
|
|
498
498
|
margin-bottom: 72px;
|
|
@@ -500,7 +500,7 @@ svc-tab-test {
|
|
|
500
500
|
}
|
|
501
501
|
|
|
502
502
|
.svc-creator-tab__content--with-toolbar.svc-test-tab__content .svc-plugin-tab__content {
|
|
503
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
503
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
504
504
|
}
|
|
505
505
|
|
|
506
506
|
.svc-test-tab__content-actions {
|
|
@@ -508,9 +508,9 @@ svc-tab-test {
|
|
|
508
508
|
}
|
|
509
509
|
.svc-test-tab__content-actions .sv-action-bar {
|
|
510
510
|
padding: 0;
|
|
511
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
512
|
-
background: var(--background, #fff);
|
|
513
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
511
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
512
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
513
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
514
514
|
width: 100%;
|
|
515
515
|
position: absolute;
|
|
516
516
|
}
|
|
@@ -518,7 +518,7 @@ svc-tab-test {
|
|
|
518
518
|
left: 0;
|
|
519
519
|
right: 0;
|
|
520
520
|
justify-content: center;
|
|
521
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
521
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
522
522
|
}
|
|
523
523
|
.svc-test-tab__content-actions .sv-action-bar.sv-action-bar--pages .sv-action__content {
|
|
524
524
|
padding: 0;
|
|
@@ -527,13 +527,13 @@ svc-tab-test {
|
|
|
527
527
|
margin: 0;
|
|
528
528
|
}
|
|
529
529
|
.svc-test-tab__content-actions .sv-action-bar-item {
|
|
530
|
-
font-family: var(--font-family);
|
|
530
|
+
font-family: var(--font-family, var(--font-family));
|
|
531
531
|
font-style: normal;
|
|
532
532
|
font-weight: 600;
|
|
533
|
-
font-size: calc(
|
|
534
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
533
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
534
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
535
535
|
width: 100%;
|
|
536
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
536
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
537
537
|
}
|
|
538
538
|
.svc-test-tab__content-actions .svc-page-selector {
|
|
539
539
|
max-width: 50%;
|
|
@@ -542,7 +542,7 @@ svc-tab-test {
|
|
|
542
542
|
overflow: hidden;
|
|
543
543
|
white-space: nowrap;
|
|
544
544
|
text-overflow: ellipsis;
|
|
545
|
-
color: var(--foreground, #161616);
|
|
545
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
546
546
|
display: inline-block;
|
|
547
547
|
}
|
|
548
548
|
|
|
@@ -550,8 +550,8 @@ svc-tab-test {
|
|
|
550
550
|
font-family: var(--font-family);
|
|
551
551
|
font-style: normal;
|
|
552
552
|
font-weight: 400;
|
|
553
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
554
|
-
color: var(--foreground, #161616);
|
|
553
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
554
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
555
555
|
width: 100%;
|
|
556
556
|
position: absolute;
|
|
557
557
|
top: 50%;
|
|
@@ -569,36 +569,36 @@ svc-tab-test {
|
|
|
569
569
|
}
|
|
570
570
|
|
|
571
571
|
.sl-table__cell.st-table__cell--actions:first-of-type .sv-action-bar {
|
|
572
|
-
margin-top: calc(-0.5 * var(--base-unit, 8px));
|
|
573
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
572
|
+
margin-top: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
573
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
574
574
|
}
|
|
575
575
|
|
|
576
576
|
.sl-table .sl-table__detail-button.sl-table__detail-button {
|
|
577
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
578
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
577
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
578
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
579
579
|
box-sizing: border-box;
|
|
580
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
580
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
581
581
|
padding: 0;
|
|
582
582
|
}
|
|
583
583
|
.sl-table .sl-table__detail-button.sl-table__detail-button:hover:enabled, .sl-table .sl-table__detail-button.sl-table__detail-button.sv-focused--by-key {
|
|
584
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
584
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
585
585
|
outline: none;
|
|
586
586
|
}
|
|
587
587
|
.sl-table .sl-table__detail-button.sl-table__detail-button:hover:enabled use, .sl-table .sl-table__detail-button.sl-table__detail-button.sv-focused--by-key use {
|
|
588
|
-
fill: var(--primary, #19b394);
|
|
588
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
589
589
|
}
|
|
590
590
|
|
|
591
591
|
.sl-table__remove-button .sv-action-bar-item {
|
|
592
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
593
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
592
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
593
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
594
594
|
cursor: pointer;
|
|
595
595
|
}
|
|
596
596
|
.sl-table__remove-button .sv-action-bar-item:hover:enabled, .sl-table__remove-button .sv-action-bar-item.sv-focused--by-key {
|
|
597
|
-
background-color: var(--red-light, rgba(
|
|
597
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
598
598
|
outline: none;
|
|
599
599
|
}
|
|
600
600
|
.sl-table__remove-button .sv-action-bar-item:hover:enabled use, .sl-table__remove-button .sv-action-bar-item.sv-focused--by-key use {
|
|
601
|
-
fill: var(--red, #e60a3e);
|
|
601
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
602
602
|
}
|
|
603
603
|
|
|
604
604
|
.sl-table__cell .sv-action-bar-item__icon {
|
|
@@ -612,15 +612,15 @@ svc-tab-test {
|
|
|
612
612
|
|
|
613
613
|
.sl-table__row #remove-row .sv-action-bar-item {
|
|
614
614
|
border: none;
|
|
615
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
616
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
615
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
616
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
617
617
|
}
|
|
618
618
|
.sl-table__row #remove-row .sv-action-bar-item__icon use {
|
|
619
|
-
fill: var(--red, #e60a3e);
|
|
619
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
620
620
|
}
|
|
621
621
|
|
|
622
622
|
.sl-table__row.sl-table__row--additional .sl-table__cell .svc-action-button {
|
|
623
|
-
color: var(--secondary, #ff9814);
|
|
623
|
+
color: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
624
624
|
}
|
|
625
625
|
|
|
626
626
|
.sl-table__cell .svc-action-button,
|
|
@@ -631,14 +631,14 @@ svc-tab-test {
|
|
|
631
631
|
font-family: var(--font-family);
|
|
632
632
|
font-style: normal;
|
|
633
633
|
font-weight: bold;
|
|
634
|
-
font-size: calc(3 * var(--base-unit, 8px));
|
|
635
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
634
|
+
font-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
635
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
636
636
|
background: transparent;
|
|
637
|
-
color: var(--foreground, #161616);
|
|
637
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
638
638
|
outline: none;
|
|
639
639
|
border: none;
|
|
640
640
|
box-shadow: none;
|
|
641
|
-
max-height: calc(13.5 * var(--base-unit, 8px));
|
|
641
|
+
max-height: calc(13.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
642
642
|
overflow: hidden;
|
|
643
643
|
display: -webkit-box;
|
|
644
644
|
-webkit-line-clamp: 3;
|
|
@@ -646,12 +646,12 @@ svc-tab-test {
|
|
|
646
646
|
}
|
|
647
647
|
|
|
648
648
|
.sl-table__cell {
|
|
649
|
-
color: var(--foreground, #161616);
|
|
649
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
650
650
|
font-weight: bold;
|
|
651
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
651
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
652
652
|
font-family: var(--font-family);
|
|
653
653
|
vertical-align: top;
|
|
654
|
-
padding: calc(2 * var(--base-unit, 8px)) 0;
|
|
654
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
655
655
|
width: 100%;
|
|
656
656
|
}
|
|
657
657
|
|
|
@@ -690,14 +690,14 @@ svc-tab-test {
|
|
|
690
690
|
text-align: left;
|
|
691
691
|
}
|
|
692
692
|
.sl-table tbody tr:last-of-type .sl-table__cell {
|
|
693
|
-
padding-bottom: calc(10 * var(--base-unit, 8px));
|
|
693
|
+
padding-bottom: calc(10 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
694
694
|
}
|
|
695
695
|
.sl-table tr:first-of-type .sl-table__cell {
|
|
696
|
-
padding-top: calc(4 * var(--base-unit, 8px));
|
|
696
|
+
padding-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
697
697
|
}
|
|
698
698
|
.sl-table td:first-of-type,
|
|
699
699
|
.sl-table th:first-of-type {
|
|
700
|
-
padding-left: calc(4 * var(--base-unit, 8px));
|
|
700
|
+
padding-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
701
701
|
}
|
|
702
702
|
.sl-table td:first-of-type .sv-action-bar,
|
|
703
703
|
.sl-table th:first-of-type .sv-action-bar {
|
|
@@ -705,7 +705,7 @@ svc-tab-test {
|
|
|
705
705
|
}
|
|
706
706
|
.sl-table td:last-of-type,
|
|
707
707
|
.sl-table th:last-of-type {
|
|
708
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
708
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
709
709
|
}
|
|
710
710
|
|
|
711
711
|
.sl-panel .sl-panel__footer {
|
|
@@ -719,12 +719,12 @@ svc-tab-test {
|
|
|
719
719
|
}
|
|
720
720
|
.sl-panel .sl-panel__footer button.sl-panel__done-button {
|
|
721
721
|
width: 100%;
|
|
722
|
-
margin: calc(2 * var(--base-unit, 8px)) 0 calc(10 * var(--base-unit, 8px)) 0;
|
|
723
|
-
color: var(--primary, #19b394);
|
|
724
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
722
|
+
margin: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(10 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
723
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
724
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
725
725
|
font-family: var(--font-family);
|
|
726
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
727
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
726
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
727
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
728
728
|
display: flex;
|
|
729
729
|
align-items: center;
|
|
730
730
|
vertical-align: baseline;
|
|
@@ -732,8 +732,8 @@ svc-tab-test {
|
|
|
732
732
|
user-select: none;
|
|
733
733
|
}
|
|
734
734
|
.sl-panel .sl-panel__footer button:hover:enabled {
|
|
735
|
-
background-color: var(--primary, #19b394);
|
|
736
|
-
color: var(--primary-foreground, #fff);
|
|
735
|
+
background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
736
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
737
737
|
}
|
|
738
738
|
.sl-panel .sl-panel__footer .sv-action-bar-item__title {
|
|
739
739
|
color: inherit;
|
|
@@ -751,7 +751,7 @@ svc-tab-test {
|
|
|
751
751
|
.sl-question {
|
|
752
752
|
display: flex;
|
|
753
753
|
align-items: center;
|
|
754
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
754
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
755
755
|
}
|
|
756
756
|
|
|
757
757
|
.sl-row {
|
|
@@ -765,7 +765,7 @@ svc-tab-test {
|
|
|
765
765
|
}
|
|
766
766
|
|
|
767
767
|
.sl-question__header--left {
|
|
768
|
-
margin-right: calc(1 * var(--base-unit, 8px));
|
|
768
|
+
margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
769
769
|
}
|
|
770
770
|
|
|
771
771
|
.sl-row .sd-scrollable-container:not(.sd-scrollable-container--compact) {
|
|
@@ -773,9 +773,9 @@ svc-tab-test {
|
|
|
773
773
|
}
|
|
774
774
|
|
|
775
775
|
.sl-question__title {
|
|
776
|
-
color: var(--foreground, #161616);
|
|
777
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
778
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
776
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
777
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
778
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
779
779
|
margin: 0;
|
|
780
780
|
font-weight: 600;
|
|
781
781
|
}
|
|
@@ -784,19 +784,19 @@ svc-tab-test {
|
|
|
784
784
|
}
|
|
785
785
|
|
|
786
786
|
.sl-row--multiple .sl-question {
|
|
787
|
-
padding-right: calc(1 * var(--base-unit, 8px));
|
|
787
|
+
padding-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
788
788
|
}
|
|
789
789
|
|
|
790
790
|
.svc-logic-question-value {
|
|
791
|
-
--sd-base-padding: calc(5 * var(--base-unit, 8px));
|
|
792
|
-
--sd-base-vertical-padding: calc(4 * var(--base-unit, 8px));
|
|
793
|
-
--sd-page-vertical-padding: calc(3 * var(--base-unit, 8px));
|
|
794
|
-
padding-right: calc(5 * var(--base-unit, 8px));
|
|
795
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
791
|
+
--sd-base-padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
792
|
+
--sd-base-vertical-padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
793
|
+
--sd-page-vertical-padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
794
|
+
padding-right: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
795
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
796
796
|
}
|
|
797
797
|
|
|
798
798
|
.svc-logic_trigger-editor {
|
|
799
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
799
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
800
800
|
}
|
|
801
801
|
|
|
802
802
|
.svc-logic_trigger-editor .svc-logic-question-value {
|
|
@@ -808,16 +808,16 @@ svc-tab-test {
|
|
|
808
808
|
}
|
|
809
809
|
|
|
810
810
|
.spg-comment.sl-comment {
|
|
811
|
-
height: calc(17 * var(--base-unit, 8px));
|
|
811
|
+
height: calc(17 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
812
812
|
}
|
|
813
813
|
.svc-tab-translation {
|
|
814
814
|
width: 100%;
|
|
815
815
|
height: 100%;
|
|
816
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
816
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
817
817
|
}
|
|
818
818
|
|
|
819
819
|
.st-properties .spg-item.spg-selectbase__label:focus-within {
|
|
820
|
-
outline: 1px dotted var(--primary, #19b394);
|
|
820
|
+
outline: 1px dotted var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
821
821
|
}
|
|
822
822
|
.st-properties .spg-selectbase__label:focus-within {
|
|
823
823
|
outline: none;
|
|
@@ -830,8 +830,8 @@ svc-tab-test {
|
|
|
830
830
|
font-family: var(--font-family);
|
|
831
831
|
font-style: normal;
|
|
832
832
|
font-weight: 400;
|
|
833
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
834
|
-
color: var(--foreground, #161616);
|
|
833
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
834
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
835
835
|
width: 100%;
|
|
836
836
|
position: absolute;
|
|
837
837
|
top: 50%;
|
|
@@ -846,7 +846,7 @@ svc-tab-test {
|
|
|
846
846
|
}
|
|
847
847
|
|
|
848
848
|
.st-strings {
|
|
849
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
849
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
850
850
|
overflow-y: auto;
|
|
851
851
|
overflow-x: hidden;
|
|
852
852
|
}
|
|
@@ -859,7 +859,7 @@ svc-tab-test {
|
|
|
859
859
|
flex-shrink: 0;
|
|
860
860
|
flex-grow: 0;
|
|
861
861
|
width: 450px;
|
|
862
|
-
border-left: 1px solid var(--border, #d6d6d6);
|
|
862
|
+
border-left: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
863
863
|
}
|
|
864
864
|
|
|
865
865
|
.st-property-panel .spg-panel__content .spg-row {
|
|
@@ -867,11 +867,11 @@ svc-tab-test {
|
|
|
867
867
|
}
|
|
868
868
|
|
|
869
869
|
.st-property-panel .spg-panel__content .spg-row:first-child {
|
|
870
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
870
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
871
871
|
}
|
|
872
872
|
|
|
873
873
|
.st-strings-header .st-table__cell {
|
|
874
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
874
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
875
875
|
height: auto;
|
|
876
876
|
}
|
|
877
877
|
|
|
@@ -881,22 +881,22 @@ svc-tab-test {
|
|
|
881
881
|
|
|
882
882
|
.st-title.st-panel__title,
|
|
883
883
|
.st-table__cell.st-table__cell--header {
|
|
884
|
-
font-family: var(--font-family);
|
|
884
|
+
font-family: var(--font-family, var(--font-family));
|
|
885
885
|
font-style: normal;
|
|
886
886
|
font-weight: 600;
|
|
887
|
-
font-size: calc(
|
|
888
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
889
|
-
color: var(--foreground-light, #909090);
|
|
887
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
888
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
889
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
890
890
|
text-align: left;
|
|
891
891
|
}
|
|
892
892
|
|
|
893
893
|
.st-title.st-panel__title {
|
|
894
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
895
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
896
|
-
padding-left: calc(3 * var(--base-unit, 8px));
|
|
894
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
895
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
896
|
+
padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
897
897
|
margin: 0;
|
|
898
|
-
background-color: var(--background-
|
|
899
|
-
border-bottom: 1px solid var(--border-light, #eaeaea);
|
|
898
|
+
background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
|
|
899
|
+
border-bottom: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
900
900
|
}
|
|
901
901
|
|
|
902
902
|
.st-table tr {
|
|
@@ -908,28 +908,28 @@ svc-tab-test {
|
|
|
908
908
|
display: block;
|
|
909
909
|
flex: 1 1;
|
|
910
910
|
box-sizing: border-box;
|
|
911
|
-
background-color: var(--background, #fff);
|
|
912
|
-
border-bottom: 1px solid var(--border-light, #eaeaea);
|
|
913
|
-
padding: calc(1 * var(--base-unit, 8px)) 0;
|
|
911
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
912
|
+
border-bottom: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
913
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
914
914
|
}
|
|
915
915
|
|
|
916
916
|
td.st-table__cell:first-of-type {
|
|
917
|
-
font-family: var(--font-family);
|
|
917
|
+
font-family: var(--font-family, var(--font-family));
|
|
918
918
|
font-style: normal;
|
|
919
919
|
font-weight: 600;
|
|
920
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
921
|
-
line-height: calc(
|
|
922
|
-
color: var(--foreground, #161616);
|
|
920
|
+
font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
921
|
+
line-height: calc(1.5 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
922
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
923
923
|
max-width: 300px;
|
|
924
|
-
padding-right: calc(3 * var(--base-unit, 8px));
|
|
924
|
+
padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
925
925
|
}
|
|
926
926
|
td.st-table__cell:first-of-type span {
|
|
927
927
|
display: inline-block;
|
|
928
|
-
padding-left: calc(3 * var(--base-unit, 8px));
|
|
928
|
+
padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
929
929
|
}
|
|
930
930
|
|
|
931
931
|
.st-panel-indent .st-table__cell:first-of-type span {
|
|
932
|
-
padding-left: calc(6 * var(--base-unit, 8px));
|
|
932
|
+
padding-left: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
933
933
|
}
|
|
934
934
|
|
|
935
935
|
.st-table {
|
|
@@ -940,32 +940,32 @@ td.st-table__cell:first-of-type span {
|
|
|
940
940
|
}
|
|
941
941
|
|
|
942
942
|
.st-comment {
|
|
943
|
-
font-family: var(--font-family);
|
|
943
|
+
font-family: var(--font-family, var(--font-family));
|
|
944
944
|
font-style: normal;
|
|
945
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
946
|
-
line-height: calc(
|
|
945
|
+
font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
946
|
+
line-height: calc(1.5 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
947
947
|
display: block;
|
|
948
|
-
width: calc(100% - 3 * var(--base-unit, 8px));
|
|
948
|
+
width: calc(100% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
949
949
|
border: unset;
|
|
950
950
|
outline: none;
|
|
951
|
-
background-color: var(--background, #fff);
|
|
952
|
-
color: var(--foreground, #161616);
|
|
951
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
952
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
953
953
|
resize: none;
|
|
954
954
|
padding: 0;
|
|
955
955
|
}
|
|
956
956
|
|
|
957
957
|
.sd-translation-line-skeleton {
|
|
958
|
-
min-height: calc(5 * var(--base-unit, 8px));
|
|
959
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
958
|
+
min-height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
959
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
960
960
|
}
|
|
961
961
|
.svc-tab-logic-edit {
|
|
962
962
|
width: 100%;
|
|
963
963
|
height: 100%;
|
|
964
|
-
background: var(--background-dim, #f3f3f3);
|
|
964
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
965
965
|
}
|
|
966
966
|
|
|
967
967
|
.svc-tab-logic-edit__content {
|
|
968
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
968
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
969
969
|
overflow-y: auto;
|
|
970
970
|
overflow-x: hidden;
|
|
971
971
|
padding-left: 16%;
|
|
@@ -982,43 +982,43 @@ td.st-table__cell:first-of-type span {
|
|
|
982
982
|
|
|
983
983
|
.svc-tab-logic-edit__content-actions .sv-action-bar {
|
|
984
984
|
padding: 0;
|
|
985
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
986
|
-
background: var(--background, #fff);
|
|
987
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
985
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
986
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
987
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
988
988
|
width: 100%;
|
|
989
989
|
}
|
|
990
990
|
|
|
991
991
|
.svc-logic-paneldynamic div.svc-logic-operator {
|
|
992
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
992
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
993
993
|
box-sizing: content-box;
|
|
994
994
|
}
|
|
995
995
|
|
|
996
996
|
.svc-logic-paneldynamic .svc-logic-operator {
|
|
997
997
|
-webkit-appearance: none;
|
|
998
998
|
appearance: none;
|
|
999
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1000
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
999
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1000
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1001
1001
|
border: none;
|
|
1002
1002
|
outline: none;
|
|
1003
1003
|
font-weight: 600;
|
|
1004
1004
|
font-family: var(--font-family);
|
|
1005
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1006
|
-
color: var(--foreground-light, #909090);
|
|
1007
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
1008
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
1005
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1006
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1007
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1008
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1009
1009
|
cursor: pointer;
|
|
1010
1010
|
}
|
|
1011
1011
|
.svc-logic-paneldynamic .svc-logic-operator option {
|
|
1012
|
-
background: var(--background, #fff);
|
|
1013
|
-
color: var(--foreground, #161616);
|
|
1012
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1013
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1014
1014
|
}
|
|
1015
1015
|
|
|
1016
1016
|
.svc-logic-operator:focus {
|
|
1017
|
-
outline: 1px dotted var(--primary, #19b394);
|
|
1017
|
+
outline: 1px dotted var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1018
1018
|
}
|
|
1019
1019
|
|
|
1020
1020
|
.sl-question.svc-logic-question--answered .svc-logic-operator {
|
|
1021
|
-
color: var(--foreground, #161616);
|
|
1021
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1022
1022
|
}
|
|
1023
1023
|
|
|
1024
1024
|
.svc-logic-operator.svc-logic-operator:hover, .svc-logic-operator.svc-logic-operator:focus {
|
|
@@ -1028,33 +1028,33 @@ td.st-table__cell:first-of-type span {
|
|
|
1028
1028
|
}
|
|
1029
1029
|
|
|
1030
1030
|
.svc-logic-operator.svc-logic-operator--question {
|
|
1031
|
-
background-color: var(--blue-light, rgba(67, 127, 217, 0.1));
|
|
1031
|
+
background-color: var(--sjs-special-blue-light, var(--blue-light, rgba(67, 127, 217, 0.1)));
|
|
1032
1032
|
}
|
|
1033
1033
|
.svc-logic-operator.svc-logic-operator--question:hover, .svc-logic-operator.svc-logic-operator--question:focus {
|
|
1034
|
-
background-color: var(--blue, #437fd9);
|
|
1034
|
+
background-color: var(--sjs-special-blue, #437fd9);
|
|
1035
1035
|
}
|
|
1036
1036
|
|
|
1037
1037
|
.svc-logic-operator.svc-logic-operator--conjunction,
|
|
1038
1038
|
.svc-logic-operator.svc-logic-operator--operator {
|
|
1039
|
-
background-color: var(--yellow-light, rgba(255, 152, 20, 0.1));
|
|
1039
|
+
background-color: var(--sjs-special-yellow-light, var(--yellow-light, rgba(255, 152, 20, 0.1)));
|
|
1040
1040
|
}
|
|
1041
1041
|
.svc-logic-operator.svc-logic-operator--conjunction:hover, .svc-logic-operator.svc-logic-operator--conjunction:focus,
|
|
1042
1042
|
.svc-logic-operator.svc-logic-operator--operator:hover,
|
|
1043
1043
|
.svc-logic-operator.svc-logic-operator--operator:focus {
|
|
1044
|
-
background-color: var(--yellow, #ff9814);
|
|
1044
|
+
background-color: var(--sjs-special-yellow, var(--yellow, #ff9814));
|
|
1045
1045
|
}
|
|
1046
1046
|
|
|
1047
1047
|
.svc-logic-operator.svc-logic-operator--action {
|
|
1048
|
-
background-color: var(--red-light, rgba(
|
|
1048
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
1049
1049
|
}
|
|
1050
1050
|
.svc-logic-operator.svc-logic-operator--action:hover, .svc-logic-operator.svc-logic-operator--action:focus {
|
|
1051
|
-
background-color: var(--red, #e60a3e);
|
|
1051
|
+
background-color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
1052
1052
|
}
|
|
1053
1053
|
|
|
1054
1054
|
.svc-logic-operator.svc-logic-operator--error {
|
|
1055
|
-
background-color: var(--background, #fff);
|
|
1056
|
-
color: var(--red, #e60a3e);
|
|
1057
|
-
box-shadow: inset 0 0 0 2px var(--red, #e60a3e);
|
|
1055
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1056
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
1057
|
+
box-shadow: inset 0 0 0 2px var(--sjs-special-red, var(--red, #e60a3e));
|
|
1058
1058
|
}
|
|
1059
1059
|
|
|
1060
1060
|
.svc-logic-operator__error {
|
|
@@ -1071,11 +1071,11 @@ td.st-table__cell:first-of-type span {
|
|
|
1071
1071
|
|
|
1072
1072
|
.svc-logic-condition-remove.svc-icon-remove {
|
|
1073
1073
|
display: none;
|
|
1074
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
1075
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
1074
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1075
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1076
1076
|
background-repeat: no-repeat;
|
|
1077
1077
|
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M22 4H20H16V2C16 0.9 15.1 0 14 0H10C8.9 0 8 0.9 8 2V4H4H2V6H4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V6H22V4ZM10 2H14V4H10V2ZM18 20H6V6H8H16H18V20ZM14 8H16V18H14V8ZM11 8H13V18H11V8ZM8 8H10V18H8V8Z' fill='%23E60A3E'/%3E%3C/svg%3E%0A");
|
|
1078
|
-
background-size: calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
1078
|
+
background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1079
1079
|
background-position: center;
|
|
1080
1080
|
}
|
|
1081
1081
|
|
|
@@ -1086,11 +1086,11 @@ td.st-table__cell:first-of-type span {
|
|
|
1086
1086
|
|
|
1087
1087
|
.svc-logic-condition-remove.svc-icon-remove:hover,
|
|
1088
1088
|
.svc-logic-condition-remove.svc-icon-remove:focus {
|
|
1089
|
-
background-color: var(--red-light, rgba(
|
|
1089
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
1090
1090
|
}
|
|
1091
1091
|
|
|
1092
1092
|
.svc-logic-condition-remove-question {
|
|
1093
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
1093
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1094
1094
|
}
|
|
1095
1095
|
|
|
1096
1096
|
.svc-logic-paneldynamic__button.svc-logic-paneldynamic__remove-btn {
|
|
@@ -1103,13 +1103,13 @@ td.st-table__cell:first-of-type span {
|
|
|
1103
1103
|
|
|
1104
1104
|
.svc-logic-operator--action.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn,
|
|
1105
1105
|
.svc-logic-operator--operator.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn {
|
|
1106
|
-
color: var(--foreground-light, #909090);
|
|
1107
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
1106
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1107
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1108
1108
|
}
|
|
1109
1109
|
.svc-logic-operator--action.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn:hover, .svc-logic-operator--action.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn:focus,
|
|
1110
1110
|
.svc-logic-operator--operator.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn:hover,
|
|
1111
1111
|
.svc-logic-operator--operator.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn:focus {
|
|
1112
|
-
color: var(--primary-foreground, #fff);
|
|
1112
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
1113
1113
|
}
|
|
1114
1114
|
|
|
1115
1115
|
.svc-logic-tab__content.svc-logic-tab__empty {
|
|
@@ -1120,24 +1120,24 @@ td.st-table__cell:first-of-type span {
|
|
|
1120
1120
|
top: 35%;
|
|
1121
1121
|
}
|
|
1122
1122
|
.svc-logic-tab__content.svc-logic-tab__empty .svc-logic-tab__content-action {
|
|
1123
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
1124
|
-
margin-top: calc(4 * var(--base-unit, 8px));
|
|
1123
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1124
|
+
margin-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1125
1125
|
}
|
|
1126
1126
|
.svc-logic-tab__content .svc-logic-tab__content-action {
|
|
1127
1127
|
margin-left: 25%;
|
|
1128
1128
|
margin-right: 25%;
|
|
1129
|
-
margin-bottom: calc(8 * var(--base-unit, 8px));
|
|
1129
|
+
margin-bottom: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1130
1130
|
}
|
|
1131
1131
|
.svc-logic-tab__content .svc-logic-tab__content-action--disabled {
|
|
1132
1132
|
cursor: default;
|
|
1133
|
-
outline: solid calc(0.25 * var(--base-unit, 8px)) transparent;
|
|
1133
|
+
outline: solid calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) transparent;
|
|
1134
1134
|
}
|
|
1135
1135
|
.svc-logic-tab__content .svc-logic-tab__content-action--disabled:focus, .svc-logic-tab__content .svc-logic-tab__content-action--disabled:hover {
|
|
1136
|
-
background-color: var(--background, #fff);
|
|
1137
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
1136
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1137
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
1138
1138
|
}
|
|
1139
1139
|
.svc-logic-tab__content .svc-logic-tab__content-action--disabled .svc-text {
|
|
1140
|
-
color: var(--foreground, #161616);
|
|
1140
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1141
1141
|
opacity: 0.25;
|
|
1142
1142
|
}
|
|
1143
1143
|
.svc-logic-tab__content .sd-paneldynamic__panel-wrapper--in-row {
|
|
@@ -1159,7 +1159,7 @@ td.st-table__cell:first-of-type span {
|
|
|
1159
1159
|
margin-top: 0;
|
|
1160
1160
|
}
|
|
1161
1161
|
.svc-logic-paneldynamic .sd-row__panel {
|
|
1162
|
-
width: calc(100% - 5 * var(--base-unit, 8px));
|
|
1162
|
+
width: calc(100% - 5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1163
1163
|
}
|
|
1164
1164
|
|
|
1165
1165
|
.svc-logic-tab__content .svc-logic-paneldynamic .sd-row {
|
|
@@ -1190,36 +1190,36 @@ td.st-table__cell:first-of-type span {
|
|
|
1190
1190
|
}
|
|
1191
1191
|
|
|
1192
1192
|
.svc-logic-placeholder {
|
|
1193
|
-
width: calc(78 * var(--base-unit, 8px));
|
|
1193
|
+
width: calc(78 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1194
1194
|
min-width: 100%;
|
|
1195
1195
|
max-width: 100%;
|
|
1196
1196
|
box-sizing: border-box;
|
|
1197
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
1198
|
-
background: var(--background, #fff);
|
|
1199
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
1200
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1201
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px));
|
|
1197
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1198
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1199
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
1200
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1201
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1202
1202
|
}
|
|
1203
1203
|
|
|
1204
1204
|
.svc-logic-placeholder__text {
|
|
1205
1205
|
font-family: var(--font-family);
|
|
1206
1206
|
font-style: normal;
|
|
1207
1207
|
font-weight: 400;
|
|
1208
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1209
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
1208
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1209
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1210
1210
|
text-align: center;
|
|
1211
|
-
color: var(--foreground-light, #909090);
|
|
1211
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1212
1212
|
display: block;
|
|
1213
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
1213
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1214
1214
|
}
|
|
1215
1215
|
|
|
1216
1216
|
.svc-logic-tab__leave-apply-button {
|
|
1217
|
-
background-color: var(--red, #e60a3e);
|
|
1217
|
+
background-color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
1218
1218
|
}
|
|
1219
1219
|
svc-tab-designer {
|
|
1220
1220
|
width: 100%;
|
|
1221
1221
|
height: 100%;
|
|
1222
|
-
background: var(--background-dim, #f3f3f3);
|
|
1222
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
1223
1223
|
}
|
|
1224
1224
|
|
|
1225
1225
|
.svc-tab-designer {
|
|
@@ -1227,6 +1227,7 @@ svc-tab-designer {
|
|
|
1227
1227
|
flex-grow: 1;
|
|
1228
1228
|
height: 100%;
|
|
1229
1229
|
overflow-y: scroll;
|
|
1230
|
+
position: static;
|
|
1230
1231
|
}
|
|
1231
1232
|
|
|
1232
1233
|
.svc-tab-designer--with-place-holder .svc-tab-designer_content {
|
|
@@ -1236,7 +1237,7 @@ svc-tab-designer {
|
|
|
1236
1237
|
}
|
|
1237
1238
|
|
|
1238
1239
|
.svc-tab-designer--with-place-holder .svc-designer-header {
|
|
1239
|
-
min-width: calc(84 * var(--base-unit, 8px));
|
|
1240
|
+
min-width: calc(84 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1240
1241
|
}
|
|
1241
1242
|
|
|
1242
1243
|
.svc-tab-designer .svc-designer-header .sd-container-modern__title {
|
|
@@ -1249,18 +1250,18 @@ svc-tab-designer {
|
|
|
1249
1250
|
display: flex;
|
|
1250
1251
|
}
|
|
1251
1252
|
.svc-tab-designer .sd-container-modern {
|
|
1252
|
-
min-width: calc(70 * var(--base-unit, 8px));
|
|
1253
|
+
min-width: calc(70 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1253
1254
|
width: 100%;
|
|
1254
1255
|
box-sizing: border-box;
|
|
1255
1256
|
margin-left: auto;
|
|
1256
1257
|
margin-right: auto;
|
|
1257
1258
|
}
|
|
1258
1259
|
.svc-tab-designer .sd-container-modern.sd-container-modern--static {
|
|
1259
|
-
max-width: calc(84 * var(--base-unit, 8px));
|
|
1260
|
+
max-width: calc(84 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1260
1261
|
}
|
|
1261
1262
|
.svc-tab-designer .sd-container-modern.sd-container-modern--responsive {
|
|
1262
1263
|
max-width: initial;
|
|
1263
|
-
padding: 0 calc(1 * var(--base-unit, 8px));
|
|
1264
|
+
padding: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1264
1265
|
}
|
|
1265
1266
|
.svc-tab-designer .sd-question.sd-question--image {
|
|
1266
1267
|
width: 100%;
|
|
@@ -1281,16 +1282,16 @@ svc-tab-designer {
|
|
|
1281
1282
|
flex-direction: column;
|
|
1282
1283
|
align-items: center;
|
|
1283
1284
|
justify-content: center;
|
|
1284
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
1285
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1285
1286
|
box-sizing: border-box;
|
|
1286
1287
|
}
|
|
1287
1288
|
|
|
1288
1289
|
.svc-designer-placeholder-page {
|
|
1289
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
1290
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1290
1291
|
}
|
|
1291
1292
|
|
|
1292
1293
|
.svc-designer-placeholder-page .svc-page__footer {
|
|
1293
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
1294
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1294
1295
|
margin: auto;
|
|
1295
1296
|
}
|
|
1296
1297
|
|
|
@@ -1298,9 +1299,9 @@ svc-tab-designer {
|
|
|
1298
1299
|
display: none;
|
|
1299
1300
|
}
|
|
1300
1301
|
.svc-creator--mobile .sd-root-modern {
|
|
1301
|
-
--sd-base-padding: calc(3 * var(--base-unit, 8px));
|
|
1302
|
-
--sd-base-vertical-padding: calc(2 * var(--base-unit, 8px));
|
|
1303
|
-
--sd-page-vertical-padding: calc(2 * var(--base-unit, 8px));
|
|
1302
|
+
--sd-base-padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1303
|
+
--sd-base-vertical-padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1304
|
+
--sd-page-vertical-padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1304
1305
|
}
|
|
1305
1306
|
.svc-creator--mobile .svc-question__content .sd-question__content .sd-selectbase__column {
|
|
1306
1307
|
max-width: initial;
|
|
@@ -1308,10 +1309,10 @@ svc-tab-designer {
|
|
|
1308
1309
|
margin-left: 0;
|
|
1309
1310
|
}
|
|
1310
1311
|
.svc-creator--mobile .svc-question__content--selected .svc-rating-question-controls {
|
|
1311
|
-
bottom: calc(10 * var(--base-unit, 8px));
|
|
1312
|
+
bottom: calc(10 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1312
1313
|
}
|
|
1313
1314
|
.svc-creator--mobile .svc-page {
|
|
1314
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
1315
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1315
1316
|
}
|
|
1316
1317
|
.svc-creator--mobile .svc-page__content {
|
|
1317
1318
|
padding-left: 0;
|
|
@@ -1319,23 +1320,23 @@ svc-tab-designer {
|
|
|
1319
1320
|
border: 0;
|
|
1320
1321
|
}
|
|
1321
1322
|
.svc-creator--mobile .svc-page__content .sd-page {
|
|
1322
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1323
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1323
1324
|
}
|
|
1324
1325
|
.svc-creator--mobile .svc-page__content .svc-page__footer {
|
|
1325
|
-
margin-left: calc(2 * var(--base-unit, 8px));
|
|
1326
|
-
margin-right: calc(2 * var(--base-unit, 8px));
|
|
1326
|
+
margin-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1327
|
+
margin-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1327
1328
|
}
|
|
1328
1329
|
.svc-creator--mobile .svc-question__content {
|
|
1329
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
1330
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1330
1331
|
}
|
|
1331
1332
|
.svc-creator--mobile .svc-question__content.svc-question__content--selected {
|
|
1332
|
-
padding-bottom: calc(8 * var(--base-unit, 8px));
|
|
1333
|
+
padding-bottom: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1333
1334
|
}
|
|
1334
1335
|
.svc-creator--mobile .svc-tab-designer {
|
|
1335
1336
|
justify-content: initial;
|
|
1336
1337
|
}
|
|
1337
1338
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title {
|
|
1338
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
1339
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1339
1340
|
flex-direction: column-reverse;
|
|
1340
1341
|
align-items: flex-start;
|
|
1341
1342
|
}
|
|
@@ -1343,31 +1344,31 @@ svc-tab-designer {
|
|
|
1343
1344
|
margin-top: 0;
|
|
1344
1345
|
}
|
|
1345
1346
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title .svc-logo-image-placeholder {
|
|
1346
|
-
margin-left: calc(-2 * var(--base-unit, 8px));
|
|
1347
|
+
margin-left: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1347
1348
|
}
|
|
1348
1349
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title h3 {
|
|
1349
1350
|
margin: 0;
|
|
1350
|
-
font-size: calc(3 * var(--base-unit, 8px));
|
|
1351
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1351
|
+
font-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1352
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1352
1353
|
}
|
|
1353
1354
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title h5 {
|
|
1354
1355
|
margin: 0;
|
|
1355
1356
|
}
|
|
1356
1357
|
.svc-creator--mobile .svc-tab-designer .sd-container-modern {
|
|
1357
|
-
min-width: calc(46 * var(--base-unit, 8px));
|
|
1358
|
+
min-width: calc(46 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1358
1359
|
}
|
|
1359
1360
|
.svc-creator--mobile .svc-properties-wrapper {
|
|
1360
1361
|
width: 100%;
|
|
1361
1362
|
}
|
|
1362
1363
|
.svc-creator--mobile .svc-question__content-actions {
|
|
1363
|
-
width: calc(100% - 3 * var(--base-unit, 8px));
|
|
1364
|
-
left: calc(2 * var(--base-unit, 8px));
|
|
1364
|
+
width: calc(100% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1365
|
+
left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1365
1366
|
}
|
|
1366
1367
|
.svc-creator--mobile .svc-question__content-actions .sv-action-bar-item {
|
|
1367
1368
|
border: 0;
|
|
1368
1369
|
}
|
|
1369
1370
|
.svc-creator--mobile .svc-page__content-actions .sv-action-bar {
|
|
1370
|
-
padding-right: calc(1 * var(--base-unit, 8px));
|
|
1371
|
+
padding-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1371
1372
|
}
|
|
1372
1373
|
.svc-creator--mobile .svc-page__content-actions .sv-action-bar .sv-action .sv-action__content {
|
|
1373
1374
|
padding-right: 0;
|
|
@@ -1378,7 +1379,7 @@ svc-tab-designer {
|
|
|
1378
1379
|
svc-tab-test {
|
|
1379
1380
|
width: 100%;
|
|
1380
1381
|
height: 100%;
|
|
1381
|
-
background: var(--background-dim, #f3f3f3);
|
|
1382
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
1382
1383
|
}
|
|
1383
1384
|
|
|
1384
1385
|
.svc-test-tab__content .svc-plugin-tab__content {
|
|
@@ -1388,13 +1389,13 @@ svc-tab-test {
|
|
|
1388
1389
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_completed_page {
|
|
1389
1390
|
margin: 0;
|
|
1390
1391
|
border: 0;
|
|
1391
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
1392
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
1392
1393
|
}
|
|
1393
1394
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_body {
|
|
1394
1395
|
border: 0;
|
|
1395
1396
|
}
|
|
1396
1397
|
.svc-test-tab__content .svc-plugin-tab__content .svc-preview__test-again {
|
|
1397
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
1398
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1398
1399
|
margin-left: auto;
|
|
1399
1400
|
margin-right: auto;
|
|
1400
1401
|
margin-bottom: 72px;
|
|
@@ -1402,7 +1403,7 @@ svc-tab-test {
|
|
|
1402
1403
|
}
|
|
1403
1404
|
|
|
1404
1405
|
.svc-creator-tab__content--with-toolbar.svc-test-tab__content .svc-plugin-tab__content {
|
|
1405
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
1406
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1406
1407
|
}
|
|
1407
1408
|
|
|
1408
1409
|
.svc-test-tab__content-actions {
|
|
@@ -1410,9 +1411,9 @@ svc-tab-test {
|
|
|
1410
1411
|
}
|
|
1411
1412
|
.svc-test-tab__content-actions .sv-action-bar {
|
|
1412
1413
|
padding: 0;
|
|
1413
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
1414
|
-
background: var(--background, #fff);
|
|
1415
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
1414
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1415
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1416
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1416
1417
|
width: 100%;
|
|
1417
1418
|
position: absolute;
|
|
1418
1419
|
}
|
|
@@ -1420,7 +1421,7 @@ svc-tab-test {
|
|
|
1420
1421
|
left: 0;
|
|
1421
1422
|
right: 0;
|
|
1422
1423
|
justify-content: center;
|
|
1423
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
1424
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1424
1425
|
}
|
|
1425
1426
|
.svc-test-tab__content-actions .sv-action-bar.sv-action-bar--pages .sv-action__content {
|
|
1426
1427
|
padding: 0;
|
|
@@ -1429,13 +1430,13 @@ svc-tab-test {
|
|
|
1429
1430
|
margin: 0;
|
|
1430
1431
|
}
|
|
1431
1432
|
.svc-test-tab__content-actions .sv-action-bar-item {
|
|
1432
|
-
font-family: var(--font-family);
|
|
1433
|
+
font-family: var(--font-family, var(--font-family));
|
|
1433
1434
|
font-style: normal;
|
|
1434
1435
|
font-weight: 600;
|
|
1435
|
-
font-size: calc(
|
|
1436
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
1436
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1437
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1437
1438
|
width: 100%;
|
|
1438
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
1439
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1439
1440
|
}
|
|
1440
1441
|
.svc-test-tab__content-actions .svc-page-selector {
|
|
1441
1442
|
max-width: 50%;
|
|
@@ -1444,7 +1445,7 @@ svc-tab-test {
|
|
|
1444
1445
|
overflow: hidden;
|
|
1445
1446
|
white-space: nowrap;
|
|
1446
1447
|
text-overflow: ellipsis;
|
|
1447
|
-
color: var(--foreground, #161616);
|
|
1448
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1448
1449
|
display: inline-block;
|
|
1449
1450
|
}
|
|
1450
1451
|
|
|
@@ -1452,8 +1453,8 @@ svc-tab-test {
|
|
|
1452
1453
|
font-family: var(--font-family);
|
|
1453
1454
|
font-style: normal;
|
|
1454
1455
|
font-weight: 400;
|
|
1455
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1456
|
-
color: var(--foreground, #161616);
|
|
1456
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1457
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1457
1458
|
width: 100%;
|
|
1458
1459
|
position: absolute;
|
|
1459
1460
|
top: 50%;
|
|
@@ -1468,34 +1469,34 @@ svc-tab-test {
|
|
|
1468
1469
|
|
|
1469
1470
|
.svc-notifier {
|
|
1470
1471
|
position: absolute;
|
|
1471
|
-
bottom: calc(1 * var(--base-unit, 8px));
|
|
1472
|
-
left: calc(1 * var(--base-unit, 8px));
|
|
1473
|
-
background: var(--background, #fff);
|
|
1472
|
+
bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1473
|
+
left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1474
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1474
1475
|
opacity: 0;
|
|
1475
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1476
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
|
|
1477
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1478
|
-
color: var(--foreground, #161616);
|
|
1479
|
-
min-width: calc(30 * var(--base-unit, 8px));
|
|
1476
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1477
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
|
|
1478
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1479
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1480
|
+
min-width: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1480
1481
|
text-align: center;
|
|
1481
1482
|
z-index: 1600;
|
|
1482
1483
|
visibility: hidden;
|
|
1483
|
-
font-family: var(--font-family);
|
|
1484
|
+
font-family: var(--font-family, var(--font-family));
|
|
1484
1485
|
font-style: normal;
|
|
1485
1486
|
font-weight: 600;
|
|
1486
|
-
font-size: calc(
|
|
1487
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
1487
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1488
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1488
1489
|
}
|
|
1489
1490
|
|
|
1490
1491
|
.svc-notifier.svc-notifier--error {
|
|
1491
|
-
background-color: var(--red, #e60a3e);
|
|
1492
|
+
background-color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
1492
1493
|
color: #ffffff;
|
|
1493
1494
|
opacity: 1;
|
|
1494
1495
|
}
|
|
1495
1496
|
|
|
1496
1497
|
.svc-creator--mobile .svc-notifier {
|
|
1497
1498
|
left: 0;
|
|
1498
|
-
bottom: calc(6 * var(--base-unit, 8px));
|
|
1499
|
+
bottom: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1499
1500
|
width: 100%;
|
|
1500
1501
|
box-sizing: border-box;
|
|
1501
1502
|
opacity: 1;
|
|
@@ -1514,7 +1515,7 @@ survey-creator,
|
|
|
1514
1515
|
survey-creator *,
|
|
1515
1516
|
.svc-creator * {
|
|
1516
1517
|
scrollbar-width: thin;
|
|
1517
|
-
scrollbar-color: var(--border, #d6d6d6) transparent;
|
|
1518
|
+
scrollbar-color: var(--sjs-border-default, var(--border, #d6d6d6)) transparent;
|
|
1518
1519
|
}
|
|
1519
1520
|
survey-creator ::-webkit-scrollbar,
|
|
1520
1521
|
.svc-creator ::-webkit-scrollbar {
|
|
@@ -1527,7 +1528,7 @@ survey-creator ::-webkit-scrollbar-thumb,
|
|
|
1527
1528
|
border: 4px solid rgba(0, 0, 0, 0);
|
|
1528
1529
|
background-clip: padding-box;
|
|
1529
1530
|
border-radius: 32px;
|
|
1530
|
-
background-color: var(--border, #d6d6d6);
|
|
1531
|
+
background-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1531
1532
|
}
|
|
1532
1533
|
survey-creator ::-webkit-scrollbar-track,
|
|
1533
1534
|
.svc-creator ::-webkit-scrollbar-track {
|
|
@@ -1536,7 +1537,7 @@ survey-creator ::-webkit-scrollbar-track,
|
|
|
1536
1537
|
survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
1537
1538
|
.svc-creator ::-webkit-scrollbar-thumb:hover {
|
|
1538
1539
|
border: 2px solid rgba(0, 0, 0, 0);
|
|
1539
|
-
background-color: var(--foreground-light, #909090);
|
|
1540
|
+
background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1540
1541
|
}
|
|
1541
1542
|
|
|
1542
1543
|
.svc-creator__area {
|
|
@@ -1548,16 +1549,16 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1548
1549
|
}
|
|
1549
1550
|
|
|
1550
1551
|
.svc-creator__area.svc-creator__area--with-banner {
|
|
1551
|
-
height: calc(100% - (4 * var(--base-unit, 8px)));
|
|
1552
|
+
height: calc(100% - (4 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1552
1553
|
}
|
|
1553
1554
|
|
|
1554
1555
|
.svc-creator__content-wrapper {
|
|
1555
1556
|
width: 100%;
|
|
1556
|
-
height: calc(100% - (8 * var(--base-unit, 8px)));
|
|
1557
|
+
height: calc(100% - (8 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1557
1558
|
}
|
|
1558
1559
|
|
|
1559
1560
|
.svc-creator__content-wrapper--footer-toolbar {
|
|
1560
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
1561
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1561
1562
|
}
|
|
1562
1563
|
|
|
1563
1564
|
.svc-creator__content-holder {
|
|
@@ -1592,18 +1593,18 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1592
1593
|
|
|
1593
1594
|
.svc-plugin-tab__content-actions sv-action-bar {
|
|
1594
1595
|
padding: 0;
|
|
1595
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
1596
|
-
background: var(--background, #fff);
|
|
1597
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
1596
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1597
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1598
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1598
1599
|
}
|
|
1599
1600
|
|
|
1600
1601
|
.svc-creator__banner {
|
|
1601
1602
|
position: absolute;
|
|
1602
|
-
bottom: calc(-4 * var(--base-unit, 8px));
|
|
1603
|
+
bottom: calc(-4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1603
1604
|
width: 100%;
|
|
1604
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
1605
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1606
|
-
background-color: var(--secondary, #ff9814);
|
|
1605
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1606
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1607
|
+
background-color: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
1607
1608
|
text-align: center;
|
|
1608
1609
|
overflow: hidden;
|
|
1609
1610
|
}
|
|
@@ -1614,31 +1615,31 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1614
1615
|
max-width: 0;
|
|
1615
1616
|
overflow: hidden;
|
|
1616
1617
|
height: 100%;
|
|
1617
|
-
background-color: var(--background, #fff);
|
|
1618
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1618
1619
|
/* Shadow / Medium */
|
|
1619
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
1620
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
|
|
1620
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1621
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
|
|
1621
1622
|
transition: max-width 0.1s ease-in-out, padding 0.2s ease-in-out;
|
|
1622
1623
|
}
|
|
1623
1624
|
|
|
1624
1625
|
.svc-creator__non-commercial-text {
|
|
1625
|
-
color: var(--primary-foreground, #fff);
|
|
1626
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
1626
1627
|
font-family: var(--font-family);
|
|
1627
1628
|
font-weight: bold;
|
|
1628
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1629
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1629
1630
|
text-transform: uppercase;
|
|
1630
1631
|
vertical-align: middle;
|
|
1631
1632
|
}
|
|
1632
1633
|
.svc-creator__non-commercial-text a {
|
|
1633
|
-
color: var(--primary-foreground, #fff);
|
|
1634
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
1634
1635
|
text-decoration: none;
|
|
1635
1636
|
}
|
|
1636
1637
|
|
|
1637
1638
|
.sv-drag-drop-ghost {
|
|
1638
|
-
top: calc(0.75 * var(--base-unit, 8px));
|
|
1639
|
+
top: calc(0.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1639
1640
|
width: 100%;
|
|
1640
|
-
height: calc(0.5 * var(--base-unit, 8px));
|
|
1641
|
-
background: var(--secondary, #ff9814);
|
|
1641
|
+
height: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1642
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
1642
1643
|
position: absolute;
|
|
1643
1644
|
}
|
|
1644
1645
|
|
|
@@ -1649,7 +1650,7 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1649
1650
|
|
|
1650
1651
|
.sv-drag-drop-ghost--item-value-bottom {
|
|
1651
1652
|
top: initial;
|
|
1652
|
-
bottom: calc(-0.5 * var(--base-unit, 8px));
|
|
1653
|
+
bottom: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1653
1654
|
}
|
|
1654
1655
|
.sd-element__title .svc-string-editor {
|
|
1655
1656
|
display: inline-block;
|
|
@@ -1671,7 +1672,7 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1671
1672
|
}
|
|
1672
1673
|
.svc-string-editor .sv-string-editor[aria-placeholder]:empty:before {
|
|
1673
1674
|
content: attr(aria-placeholder);
|
|
1674
|
-
color: var(--foreground-light, #909090);
|
|
1675
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1675
1676
|
}
|
|
1676
1677
|
.svc-string-editor .sv-string-editor--html,
|
|
1677
1678
|
.svc-string-editor .sv-string-editor:focus-within {
|
|
@@ -1702,12 +1703,12 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1702
1703
|
z-index: 20;
|
|
1703
1704
|
padding: 0px;
|
|
1704
1705
|
vertical-align: top;
|
|
1705
|
-
margin-inline-start: calc(2 * var(--base-unit, 8px));
|
|
1706
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
1706
|
+
margin-inline-start: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1707
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1707
1708
|
font-family: var(--font-family);
|
|
1708
1709
|
font-weight: 400;
|
|
1709
|
-
color: var(--foreground-light, #909090);
|
|
1710
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
1710
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1711
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1711
1712
|
}
|
|
1712
1713
|
|
|
1713
1714
|
.svc-string-editor__border {
|
|
@@ -1721,9 +1722,9 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1721
1722
|
}
|
|
1722
1723
|
|
|
1723
1724
|
.svc-string-editor__error {
|
|
1724
|
-
margin-left: calc(1 * var(--base-unit, 8px));
|
|
1725
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1726
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1725
|
+
margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1726
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1727
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1727
1728
|
color: red;
|
|
1728
1729
|
display: none;
|
|
1729
1730
|
}
|
|
@@ -1732,9 +1733,9 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1732
1733
|
position: absolute;
|
|
1733
1734
|
left: 100%;
|
|
1734
1735
|
height: 100%;
|
|
1735
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
1736
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1736
1737
|
top: 0;
|
|
1737
|
-
padding-left: calc(2 * var(--base-unit, 8px));
|
|
1738
|
+
padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1738
1739
|
z-index: 12;
|
|
1739
1740
|
display: none;
|
|
1740
1741
|
align-items: center;
|
|
@@ -1747,13 +1748,13 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1747
1748
|
position: relative;
|
|
1748
1749
|
}
|
|
1749
1750
|
.svc-string-editor__button use {
|
|
1750
|
-
fill: var(--primary, #19b394);
|
|
1751
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1751
1752
|
}
|
|
1752
1753
|
|
|
1753
1754
|
.svc-string-editor__button--edit {
|
|
1754
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
1755
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
1756
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
1755
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1756
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1757
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1757
1758
|
}
|
|
1758
1759
|
.svc-string-editor__button--edit .sv-svg-icon {
|
|
1759
1760
|
vertical-align: bottom;
|
|
@@ -1770,26 +1771,26 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1770
1771
|
display: flex;
|
|
1771
1772
|
top: 0;
|
|
1772
1773
|
bottom: 0;
|
|
1773
|
-
left: calc(-0.5 * var(--base-unit, 8px));
|
|
1774
|
-
right: calc(-0.5 * var(--base-unit, 8px));
|
|
1774
|
+
left: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1775
|
+
right: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1775
1776
|
border-radius: 3px;
|
|
1776
|
-
box-shadow: 0px 0px 0px calc(0.25 * var(--base-unit, 8px)) rgba(0, 0, 0, 0.16);
|
|
1777
|
+
box-shadow: 0px 0px 0px calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) rgba(0, 0, 0, 0.16);
|
|
1777
1778
|
}
|
|
1778
1779
|
|
|
1779
1780
|
.svc-string-editor:focus-within .svc-string-editor__border {
|
|
1780
1781
|
display: flex;
|
|
1781
|
-
top: calc(-0.5 * var(--base-unit, 8px));
|
|
1782
|
-
bottom: calc(-0.5 * var(--base-unit, 8px));
|
|
1783
|
-
left: calc(-1 * var(--base-unit, 8px));
|
|
1784
|
-
right: calc(-1 * var(--base-unit, 8px));
|
|
1782
|
+
top: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1783
|
+
bottom: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1784
|
+
left: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1785
|
+
right: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1785
1786
|
border-radius: 3px;
|
|
1786
1787
|
box-sizing: content-box;
|
|
1787
|
-
background-color: var(--background, #fff);
|
|
1788
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1), 0px 0px 0px calc(0.25 * var(--base-unit, 8px)) var(--primary, #19b394);
|
|
1788
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1789
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1)), 0px 0px 0px calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1789
1790
|
}
|
|
1790
1791
|
|
|
1791
1792
|
.svc-string-editor.svc-string-editor--error:focus-within .svc-string-editor__border {
|
|
1792
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1), 0px 0px 0px calc(0.25 * var(--base-unit, 8px)) var(--red, #e60a3e);
|
|
1793
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1)), 0px 0px 0px calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) var(--sjs-special-red, var(--red, #e60a3e));
|
|
1793
1794
|
}
|
|
1794
1795
|
|
|
1795
1796
|
.sd-boolean .sv-string-editor:focus-within {
|
|
@@ -1797,7 +1798,7 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1797
1798
|
}
|
|
1798
1799
|
|
|
1799
1800
|
.sd-rating .sd-rating__item:focus-within {
|
|
1800
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--primary, #19b394);
|
|
1801
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1801
1802
|
}
|
|
1802
1803
|
.sd-rating:not(.sd-rating__min-text) .svc-string-editor:focus-within .svc-string-editor__border {
|
|
1803
1804
|
display: none;
|
|
@@ -1805,12 +1806,12 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1805
1806
|
|
|
1806
1807
|
.sd-table__cell--actions .svc-string-editor__button--done,
|
|
1807
1808
|
.sd-matrixdynamic__add-btn .svc-string-editor__button--done {
|
|
1808
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
1809
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1809
1810
|
}
|
|
1810
1811
|
|
|
1811
1812
|
.sd-table__cell--header .svc-matrix-cell:not(:focus):focus-within .svc-matrix-cell--selected {
|
|
1812
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--primary, #19b394);
|
|
1813
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1813
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1814
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1814
1815
|
display: block;
|
|
1815
1816
|
}
|
|
1816
1817
|
.sd-table__cell--header .svc-string-editor:focus-within .svc-string-editor__border {
|
|
@@ -1818,8 +1819,8 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1818
1819
|
}
|
|
1819
1820
|
|
|
1820
1821
|
.sd-item__control-label .svc-string-editor:focus-within .svc-string-editor__border {
|
|
1821
|
-
left: calc(-0.7 * var(--base-unit, 8px));
|
|
1822
|
-
right: calc(-0.7 * var(--base-unit, 8px));
|
|
1822
|
+
left: calc(-0.7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1823
|
+
right: calc(-0.7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1823
1824
|
}
|
|
1824
1825
|
|
|
1825
1826
|
.svc-string-editor:hover ~ .sd-question__required-text, .svc-string-editor:focus-within ~ .sd-question__required-text {
|
|
@@ -1828,56 +1829,56 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1828
1829
|
.svc-btn {
|
|
1829
1830
|
display: flex;
|
|
1830
1831
|
align-items: center;
|
|
1831
|
-
height: calc(7 * var(--base-unit, 8px));
|
|
1832
|
-
line-height: calc(7 * var(--base-unit, 8px));
|
|
1832
|
+
height: calc(7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1833
|
+
line-height: calc(7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1833
1834
|
vertical-align: baseline;
|
|
1834
1835
|
text-align: center;
|
|
1835
|
-
background-color: var(--background, #fff);
|
|
1836
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
1837
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1836
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1837
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
1838
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1838
1839
|
cursor: pointer;
|
|
1839
1840
|
user-select: none;
|
|
1840
|
-
outline: solid calc(0.25 * var(--base-unit, 8px)) transparent;
|
|
1841
|
+
outline: solid calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) transparent;
|
|
1841
1842
|
}
|
|
1842
1843
|
.svc-btn .svc-text {
|
|
1843
1844
|
display: flex;
|
|
1844
1845
|
align-items: center;
|
|
1845
1846
|
flex-grow: 1;
|
|
1846
1847
|
justify-content: center;
|
|
1847
|
-
color: var(--primary, #19b394);
|
|
1848
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1848
1849
|
}
|
|
1849
1850
|
|
|
1850
1851
|
.svc-btn:hover {
|
|
1851
|
-
background-color: var(--sjs-general-backcolor-dark, rgb(248, 248, 248));
|
|
1852
|
+
background-color: var(--sjs-questionpanel-hovercolor, var(--sjs-general-backcolor-dark, rgb(248, 248, 248)));
|
|
1852
1853
|
}
|
|
1853
1854
|
|
|
1854
1855
|
.svc-btn:focus {
|
|
1855
|
-
box-shadow: 0 0 0 2px var(--primary, #19b394);
|
|
1856
|
+
box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1856
1857
|
}
|
|
1857
1858
|
|
|
1858
1859
|
.svc-action-button {
|
|
1859
1860
|
display: inline-block;
|
|
1860
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1861
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1861
1862
|
box-sizing: border-box;
|
|
1862
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
1863
|
-
color: var(--primary, #19b394);
|
|
1863
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1864
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1864
1865
|
font-weight: 600;
|
|
1865
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1866
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
1867
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid transparent;
|
|
1866
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1867
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1868
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid transparent;
|
|
1868
1869
|
}
|
|
1869
1870
|
.svc-action-button:focus, .svc-action-button:hover {
|
|
1870
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
1871
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1871
1872
|
outline: none;
|
|
1872
1873
|
}
|
|
1873
1874
|
|
|
1874
1875
|
.svc-action-button--selected {
|
|
1875
|
-
border-color: var(--primary, #19b394);
|
|
1876
|
+
border-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1876
1877
|
}
|
|
1877
1878
|
|
|
1878
1879
|
.svc-action-button--disabled {
|
|
1879
1880
|
opacity: 0.25;
|
|
1880
|
-
color: var(--foreground, #161616);
|
|
1881
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1881
1882
|
}
|
|
1882
1883
|
svc-page-navigator,
|
|
1883
1884
|
.svc-page-navigator {
|
|
@@ -1887,20 +1888,20 @@ svc-page-navigator,
|
|
|
1887
1888
|
|
|
1888
1889
|
.svc-page-navigator__navigator-icon {
|
|
1889
1890
|
display: block;
|
|
1890
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
1891
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
1892
|
-
padding: calc(1.25 * var(--base-unit, 8px));
|
|
1891
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1892
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1893
|
+
padding: calc(1.25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1893
1894
|
border-radius: 50%;
|
|
1894
1895
|
cursor: pointer;
|
|
1895
1896
|
}
|
|
1896
1897
|
.svc-page-navigator__navigator-icon use {
|
|
1897
|
-
fill: var(--foreground-light, #909090);
|
|
1898
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1898
1899
|
}
|
|
1899
1900
|
|
|
1900
1901
|
.svc-page-navigator__selector {
|
|
1901
|
-
width: calc(5.5 * var(--base-unit, 8px));
|
|
1902
|
-
height: calc(5.5 * var(--base-unit, 8px));
|
|
1903
|
-
min-height: calc(5.5 * var(--base-unit, 8px));
|
|
1902
|
+
width: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1903
|
+
height: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1904
|
+
min-height: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1904
1905
|
}
|
|
1905
1906
|
|
|
1906
1907
|
survey-creator .svc-page-navigator__selector:hover, survey-creator .svc-page-navigator__selector:focus,
|
|
@@ -1911,39 +1912,39 @@ survey-creator .svc-page-navigator__selector:hover, survey-creator .svc-page-nav
|
|
|
1911
1912
|
survey-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon, survey-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon,
|
|
1912
1913
|
.svc-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon,
|
|
1913
1914
|
.svc-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon {
|
|
1914
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
1915
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1915
1916
|
}
|
|
1916
1917
|
survey-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon use, survey-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon use,
|
|
1917
1918
|
.svc-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon use,
|
|
1918
1919
|
.svc-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon use {
|
|
1919
|
-
fill: var(--primary, #19b394);
|
|
1920
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1920
1921
|
}
|
|
1921
1922
|
|
|
1922
1923
|
.svc-page-navigator__selector--opened {
|
|
1923
1924
|
opacity: 0.5;
|
|
1924
1925
|
}
|
|
1925
1926
|
.svc-page-navigator__selector--opened .svc-page-navigator__navigator-icon {
|
|
1926
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
1927
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1927
1928
|
}
|
|
1928
1929
|
.svc-page-navigator__selector--opened .svc-page-navigator__navigator-icon use {
|
|
1929
|
-
fill: var(--primary, #19b394);
|
|
1930
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1930
1931
|
}
|
|
1931
1932
|
|
|
1932
1933
|
.svc-page-navigator__popup {
|
|
1933
|
-
min-width: calc(12.5 * var(--base-unit, 8px));
|
|
1934
|
+
min-width: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1934
1935
|
}
|
|
1935
1936
|
|
|
1936
1937
|
.svc-tab-designer--with-page-navigator .svc-tab-designer_content {
|
|
1937
|
-
margin-right: calc(6.5 * var(--base-unit, 8px));
|
|
1938
|
+
margin-right: calc(6.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1938
1939
|
}
|
|
1939
1940
|
|
|
1940
1941
|
.svc-tab-designer__page-navigator {
|
|
1941
|
-
width: calc(5.5 * var(--base-unit, 8px));
|
|
1942
|
+
width: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1942
1943
|
position: absolute;
|
|
1943
|
-
padding: calc(16.5 * var(--base-unit, 8px)) 0;
|
|
1944
|
+
padding: calc(16.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
1944
1945
|
top: 0;
|
|
1945
1946
|
bottom: 0;
|
|
1946
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
1947
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1947
1948
|
}
|
|
1948
1949
|
|
|
1949
1950
|
.svc-creator__toolbox--right .svc-tab-designer--with-page-navigator .svc-tab-designer_content,
|
|
@@ -1951,21 +1952,21 @@ survey-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigato
|
|
|
1951
1952
|
[style*="direction:rtl"] .svc-tab-designer--with-page-navigator .svc-tab-designer_content,
|
|
1952
1953
|
[style*="direction: rtl"] .svc-tab-designer--with-page-navigator .svc-tab-designer_content {
|
|
1953
1954
|
margin-right: 0;
|
|
1954
|
-
margin-left: calc(6.5 * var(--base-unit, 8px));
|
|
1955
|
+
margin-left: calc(6.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1955
1956
|
}
|
|
1956
1957
|
.svc-creator__toolbox--right .svc-tab-designer__page-navigator,
|
|
1957
1958
|
[dir=rtl] .svc-tab-designer__page-navigator,
|
|
1958
1959
|
[style*="direction:rtl"] .svc-tab-designer__page-navigator,
|
|
1959
1960
|
[style*="direction: rtl"] .svc-tab-designer__page-navigator {
|
|
1960
1961
|
right: unset;
|
|
1961
|
-
left: calc(1 * var(--base-unit, 8px));
|
|
1962
|
+
left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1962
1963
|
}
|
|
1963
1964
|
svc-page-navigator-item,
|
|
1964
1965
|
.svc-page-navigator-item {
|
|
1965
1966
|
display: block;
|
|
1966
|
-
width: calc(5.5 * var(--base-unit, 8px));
|
|
1967
|
-
height: calc(4.5 * var(--base-unit, 8px));
|
|
1968
|
-
min-height: calc(4.5 * var(--base-unit, 8px));
|
|
1967
|
+
width: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1968
|
+
height: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1969
|
+
min-height: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1969
1970
|
cursor: pointer;
|
|
1970
1971
|
position: relative;
|
|
1971
1972
|
}
|
|
@@ -2002,26 +2003,26 @@ svc-page-navigator-item,
|
|
|
2002
2003
|
height: 6px;
|
|
2003
2004
|
right: calc(50% - 3px);
|
|
2004
2005
|
top: calc(50% - 3px);
|
|
2005
|
-
background: var(--border, #d6d6d6);
|
|
2006
|
+
background: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2006
2007
|
}
|
|
2007
2008
|
|
|
2008
2009
|
.svc-page-navigator-item--selected .svc-page-navigator-item__dot {
|
|
2009
|
-
width: calc(1 * var(--base-unit, 8px));
|
|
2010
|
-
height: calc(1 * var(--base-unit, 8px));
|
|
2011
|
-
right: calc(50% - 1.5 * var(--base-unit, 8px) / 2);
|
|
2012
|
-
top: calc(50% - 1.5 * var(--base-unit, 8px) / 2);
|
|
2013
|
-
background: var(--background, #fff);
|
|
2014
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--primary, #19b394);
|
|
2010
|
+
width: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2011
|
+
height: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2012
|
+
right: calc(50% - 1.5 * var(--sjs-base-unit, var(--base-unit, 8px)) / 2);
|
|
2013
|
+
top: calc(50% - 1.5 * var(--sjs-base-unit, var(--base-unit, 8px)) / 2);
|
|
2014
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2015
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2015
2016
|
}
|
|
2016
2017
|
|
|
2017
2018
|
.svc-page-navigator-item__banner {
|
|
2018
2019
|
overflow: hidden;
|
|
2019
2020
|
white-space: nowrap;
|
|
2020
2021
|
text-overflow: ellipsis;
|
|
2021
|
-
right: calc(0.5 * var(--base-unit, 8px));
|
|
2022
|
+
right: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2022
2023
|
display: flex;
|
|
2023
2024
|
align-items: center;
|
|
2024
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
2025
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2025
2026
|
animation: 0.5s ease-in;
|
|
2026
2027
|
padding: 0;
|
|
2027
2028
|
opacity: 0;
|
|
@@ -2030,8 +2031,8 @@ svc-page-navigator-item,
|
|
|
2030
2031
|
.svc-page-navigator-item__banner .svc-page-navigator-item__dot {
|
|
2031
2032
|
position: absolute;
|
|
2032
2033
|
display: inline-block;
|
|
2033
|
-
top: calc(1.75 * var(--base-unit, 8px));
|
|
2034
|
-
right: calc(1.75 * var(--base-unit, 8px));
|
|
2034
|
+
top: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2035
|
+
right: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2035
2036
|
}
|
|
2036
2037
|
|
|
2037
2038
|
.svc-creator__toolbox--right .svc-page-navigator-item__banner,
|
|
@@ -2046,20 +2047,20 @@ svc-page-navigator-item,
|
|
|
2046
2047
|
[style*="direction:rtl"] .svc-page-navigator-item__banner .svc-page-navigator-item__dot,
|
|
2047
2048
|
[style*="direction: rtl"] .svc-page-navigator-item__banner .svc-page-navigator-item__dot {
|
|
2048
2049
|
right: unset;
|
|
2049
|
-
left: calc(1.75 * var(--base-unit, 8px));
|
|
2050
|
+
left: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2050
2051
|
}
|
|
2051
2052
|
|
|
2052
2053
|
.svc-page-navigator-item-content:not(.svc-page-navigator-item--disabled) .svc-page-navigator-item__banner .svc-page-navigator-item__dot {
|
|
2053
|
-
width: calc(1 * var(--base-unit, 8px));
|
|
2054
|
-
height: calc(1 * var(--base-unit, 8px));
|
|
2054
|
+
width: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2055
|
+
height: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2055
2056
|
border: none;
|
|
2056
|
-
background: var(--primary, #19b394);
|
|
2057
|
+
background: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2057
2058
|
}
|
|
2058
2059
|
|
|
2059
2060
|
.svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):hover .svc-page-navigator-item__banner,
|
|
2060
2061
|
.svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):focus .svc-page-navigator-item__banner {
|
|
2061
|
-
padding: 0 calc(4.5 * var(--base-unit, 8px)) 0 calc(2.5 * var(--base-unit, 8px));
|
|
2062
|
-
max-width: calc(25 * var(--base-unit, 8px));
|
|
2062
|
+
padding: 0 calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2063
|
+
max-width: calc(25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2063
2064
|
opacity: 1;
|
|
2064
2065
|
}
|
|
2065
2066
|
|
|
@@ -2071,11 +2072,11 @@ svc-page-navigator-item,
|
|
|
2071
2072
|
[style*="direction:rtl"] .svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):focus .svc-page-navigator-item__banner,
|
|
2072
2073
|
[style*="direction: rtl"] .svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):hover .svc-page-navigator-item__banner,
|
|
2073
2074
|
[style*="direction: rtl"] .svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):focus .svc-page-navigator-item__banner {
|
|
2074
|
-
padding: 0 calc(2.5 * var(--base-unit, 8px)) 0 calc(4.5 * var(--base-unit, 8px));
|
|
2075
|
+
padding: 0 calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2075
2076
|
}
|
|
2076
2077
|
|
|
2077
2078
|
.svc-page-navigator-item--disabled .svc-page-navigator-item__banner {
|
|
2078
|
-
color: var(--foreground, #161616);
|
|
2079
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2079
2080
|
opacity: 0.25;
|
|
2080
2081
|
}
|
|
2081
2082
|
svc-page {
|
|
@@ -2083,48 +2084,48 @@ svc-page {
|
|
|
2083
2084
|
}
|
|
2084
2085
|
|
|
2085
2086
|
.svc-page {
|
|
2086
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2087
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2087
2088
|
}
|
|
2088
2089
|
.svc-page .sd-page__title {
|
|
2089
|
-
margin: calc(2.5 * var(--base-unit, 8px)) 0 0 0;
|
|
2090
|
+
margin: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 0 0;
|
|
2090
2091
|
}
|
|
2091
2092
|
|
|
2092
2093
|
.svc-page__content {
|
|
2093
2094
|
position: relative;
|
|
2094
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(0 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
2095
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(0 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2095
2096
|
box-sizing: border-box;
|
|
2096
2097
|
width: 100%;
|
|
2097
2098
|
outline: none;
|
|
2098
2099
|
}
|
|
2099
2100
|
.svc-page__content .sd-page {
|
|
2100
2101
|
margin: 0;
|
|
2101
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
2102
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2102
2103
|
}
|
|
2103
2104
|
|
|
2104
2105
|
.svc-page__content-actions {
|
|
2105
2106
|
position: absolute;
|
|
2106
2107
|
display: none;
|
|
2107
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
2108
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2108
2109
|
inset-inline-end: 0;
|
|
2109
|
-
padding: 0 calc(1.5 * var(--base-unit, 8px));
|
|
2110
|
+
padding: 0 calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2110
2111
|
z-index: 1;
|
|
2111
2112
|
}
|
|
2112
2113
|
|
|
2113
2114
|
.svc-page__content:not(.svc-page__content--new):focus,
|
|
2114
2115
|
.svc-hovered.svc-page__content:not(.svc-page__content--new) {
|
|
2115
|
-
background: var(--secondary-
|
|
2116
|
+
background: var(--sjs-secondary-backcolor-semi-light, rgba(255, 152, 20, 0.1));
|
|
2116
2117
|
}
|
|
2117
2118
|
|
|
2118
2119
|
.svc-creator .svc-page .svc-page__content--selected,
|
|
2119
2120
|
.svc-creator .svc-page .svc-page__content--selected:focus,
|
|
2120
2121
|
.svc-hovered {
|
|
2121
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
2122
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2122
2123
|
}
|
|
2123
2124
|
.svc-creator .svc-page .svc-page__content--selected.svc-page__content--selected,
|
|
2124
2125
|
.svc-creator .svc-page .svc-page__content--selected:focus.svc-page__content--selected,
|
|
2125
2126
|
.svc-hovered.svc-page__content--selected {
|
|
2126
|
-
box-shadow: 0 0 0 2px var(--secondary, #ff9814) inset;
|
|
2127
|
-
background: var(--secondary-
|
|
2127
|
+
box-shadow: 0 0 0 2px var(--sjs-secondary-backcolor, var(--secondary, #ff9814)) inset;
|
|
2128
|
+
background: var(--sjs-secondary-backcolor-semi-light, rgba(255, 152, 20, 0.1));
|
|
2128
2129
|
}
|
|
2129
2130
|
.svc-creator .svc-page .svc-page__content--selected.svc-page__content--selected .svc-page__content-actions,
|
|
2130
2131
|
.svc-creator .svc-page .svc-page__content--selected:focus.svc-page__content--selected .svc-page__content-actions,
|
|
@@ -2134,9 +2135,9 @@ svc-page {
|
|
|
2134
2135
|
|
|
2135
2136
|
.svc-page__footer {
|
|
2136
2137
|
overflow: visible;
|
|
2137
|
-
margin-left: calc(3 * var(--base-unit, 8px));
|
|
2138
|
-
margin-right: calc(3 * var(--base-unit, 8px));
|
|
2139
|
-
gap: calc(2 * var(--base-unit, 8px));
|
|
2138
|
+
margin-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2139
|
+
margin-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2140
|
+
gap: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2140
2141
|
}
|
|
2141
2142
|
.svc-page__footer .sv-action {
|
|
2142
2143
|
flex: 1 1 0;
|
|
@@ -2147,38 +2148,38 @@ svc-page {
|
|
|
2147
2148
|
}
|
|
2148
2149
|
|
|
2149
2150
|
.svc-page__add-new-question .svc-text {
|
|
2150
|
-
margin-left: calc(6 * var(--base-unit, 8px));
|
|
2151
|
+
margin-left: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2151
2152
|
}
|
|
2152
2153
|
|
|
2153
2154
|
.svc-page__question-type-selector {
|
|
2154
2155
|
appearance: none;
|
|
2155
2156
|
display: flex;
|
|
2156
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
2157
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
2157
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2158
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2158
2159
|
box-sizing: border-box;
|
|
2159
2160
|
border: none;
|
|
2160
2161
|
border-radius: 2px;
|
|
2161
2162
|
background-color: transparent;
|
|
2162
2163
|
cursor: pointer;
|
|
2163
|
-
margin-inline-end: calc(1 * var(--base-unit, 8px));
|
|
2164
|
+
margin-inline-end: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2164
2165
|
outline: none;
|
|
2165
2166
|
}
|
|
2166
2167
|
.svc-page__question-type-selector use {
|
|
2167
|
-
fill: var(--foreground-light, #909090);
|
|
2168
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2168
2169
|
}
|
|
2169
2170
|
.svc-page__question-type-selector:hover {
|
|
2170
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
2171
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2171
2172
|
}
|
|
2172
2173
|
.svc-page__question-type-selector:focus {
|
|
2173
|
-
background-color: var(--sjs-primary-backcolor-light, rgba(25, 179, 148, 0.1));
|
|
2174
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2174
2175
|
}
|
|
2175
2176
|
|
|
2176
2177
|
.svc-page--drag-over-empty:after {
|
|
2177
2178
|
content: " ";
|
|
2178
2179
|
position: absolute;
|
|
2179
|
-
background: var(--secondary, #ff9814);
|
|
2180
|
-
left: calc(3 * var(--base-unit, 8px));
|
|
2181
|
-
bottom: calc(11 * var(--base-unit, 8px));
|
|
2180
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2181
|
+
left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2182
|
+
bottom: calc(11 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2182
2183
|
width: calc(100% - 48px);
|
|
2183
2184
|
height: 4px;
|
|
2184
2185
|
}
|
|
@@ -2193,15 +2194,15 @@ svc-page {
|
|
|
2193
2194
|
|
|
2194
2195
|
.svc-row .sd-row--multiple {
|
|
2195
2196
|
overflow: auto;
|
|
2196
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
2197
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
2198
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2197
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2198
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2199
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2199
2200
|
margin-left: 0;
|
|
2200
2201
|
width: 100%;
|
|
2201
2202
|
flex-wrap: nowrap;
|
|
2202
|
-
background: var(--background, #fff);
|
|
2203
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
2204
|
-
border-radius:
|
|
2203
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2204
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
2205
|
+
border-radius: calc(1 * var(--sjs-corner-radius, 4px));
|
|
2205
2206
|
}
|
|
2206
2207
|
.svc-row .sd-row--multiple > div {
|
|
2207
2208
|
padding-left: 0;
|
|
@@ -2211,7 +2212,7 @@ svc-page {
|
|
|
2211
2212
|
}
|
|
2212
2213
|
|
|
2213
2214
|
.sd-panel .svc-row .sd-row--multiple {
|
|
2214
|
-
padding: calc(0 * var(--base-unit, 8px));
|
|
2215
|
+
padding: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2215
2216
|
box-shadow: none;
|
|
2216
2217
|
border-radius: 0;
|
|
2217
2218
|
padding: 2px;
|
|
@@ -2224,12 +2225,12 @@ svc-page {
|
|
|
2224
2225
|
box-shadow: none;
|
|
2225
2226
|
}
|
|
2226
2227
|
.svc-row.svc-row--ghost .sd-row {
|
|
2227
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
2228
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2228
2229
|
}
|
|
2229
2230
|
.svc-row.svc-row--ghost:last-child .sd-row {
|
|
2230
2231
|
height: initial;
|
|
2231
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2232
|
-
margin-bottom: calc(2 * var(--base-unit, 8px));
|
|
2232
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2233
|
+
margin-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2233
2234
|
}
|
|
2234
2235
|
.svc-row.svc-row--ghost + .svc-row .sd-page__row {
|
|
2235
2236
|
margin-top: 0;
|
|
@@ -2237,15 +2238,15 @@ svc-page {
|
|
|
2237
2238
|
|
|
2238
2239
|
.svc-panel .svc-row.svc-row--ghost.svc-row.svc-row--ghost .sd-row {
|
|
2239
2240
|
height: initial;
|
|
2240
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2241
|
-
margin-bottom: calc(2 * var(--base-unit, 8px));
|
|
2241
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2242
|
+
margin-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2242
2243
|
}
|
|
2243
2244
|
|
|
2244
2245
|
.svc-row--drag-over-top:before {
|
|
2245
2246
|
content: " ";
|
|
2246
2247
|
position: absolute;
|
|
2247
2248
|
left: 0;
|
|
2248
|
-
background: var(--secondary, #ff9814);
|
|
2249
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2249
2250
|
top: 6px;
|
|
2250
2251
|
width: 100%;
|
|
2251
2252
|
height: 4px;
|
|
@@ -2255,7 +2256,7 @@ svc-page {
|
|
|
2255
2256
|
content: " ";
|
|
2256
2257
|
position: absolute;
|
|
2257
2258
|
left: 0;
|
|
2258
|
-
background: var(--secondary, #ff9814);
|
|
2259
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2259
2260
|
bottom: -10px;
|
|
2260
2261
|
width: 100%;
|
|
2261
2262
|
height: 4px;
|
|
@@ -2272,13 +2273,13 @@ svc-page {
|
|
|
2272
2273
|
.svc-carry-forward-panel {
|
|
2273
2274
|
box-sizing: border-box;
|
|
2274
2275
|
width: 100%;
|
|
2275
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
2276
|
-
border-radius: calc(1 * var(--base-unit, 8px));
|
|
2276
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2277
|
+
border-radius: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2277
2278
|
background-color: #F8F8F8;
|
|
2278
2279
|
text-align: center;
|
|
2279
2280
|
font-weight: 400;
|
|
2280
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
2281
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
2281
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2282
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2282
2283
|
color: rgba(0, 0, 0, 0.45);
|
|
2283
2284
|
}
|
|
2284
2285
|
|
|
@@ -2326,19 +2327,19 @@ svc-question {
|
|
|
2326
2327
|
position: relative;
|
|
2327
2328
|
width: 100%;
|
|
2328
2329
|
height: 100%;
|
|
2329
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
2330
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2330
2331
|
box-sizing: border-box;
|
|
2331
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
2332
|
-
background: var(--background, #fff);
|
|
2333
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
2332
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2333
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2334
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
2334
2335
|
border: 2px solid transparent;
|
|
2335
2336
|
outline: none;
|
|
2336
2337
|
}
|
|
2337
2338
|
|
|
2338
2339
|
.svc-question__content .sd-selectbase:not(.sd-imagepicker) {
|
|
2339
2340
|
overflow-x: auto;
|
|
2340
|
-
padding-left: calc(5 * var(--base-unit, 8px));
|
|
2341
|
-
margin-left: calc(-5 * var(--base-unit, 8px));
|
|
2341
|
+
padding-left: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2342
|
+
margin-left: calc(-5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2342
2343
|
}
|
|
2343
2344
|
.svc-question__content .sd-table .sd-selectbase:not(.sd-imagepicker) {
|
|
2344
2345
|
overflow-x: visible;
|
|
@@ -2346,13 +2347,13 @@ svc-question {
|
|
|
2346
2347
|
margin-left: 0;
|
|
2347
2348
|
}
|
|
2348
2349
|
.svc-question__content .sd-multipletext__item-title {
|
|
2349
|
-
color: var(--foreground, #161616);
|
|
2350
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2350
2351
|
}
|
|
2351
2352
|
.svc-question__content .sd-multipletext__item-container.sd-input:focus-within {
|
|
2352
|
-
box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
2353
|
+
box-shadow: var(--sjs-shadow-inner, inset 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
2353
2354
|
}
|
|
2354
2355
|
.svc-question__content .sd-matrixdynamic__btn.sd-matrixdynamic__add-btn {
|
|
2355
|
-
color: var(--foreground, #161616);
|
|
2356
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2356
2357
|
opacity: 0.25;
|
|
2357
2358
|
}
|
|
2358
2359
|
|
|
@@ -2361,18 +2362,18 @@ svc-question {
|
|
|
2361
2362
|
}
|
|
2362
2363
|
|
|
2363
2364
|
.svc-panel__placeholder {
|
|
2364
|
-
color: var(--foreground-light, #909090);
|
|
2365
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2365
2366
|
}
|
|
2366
2367
|
|
|
2367
2368
|
.svc-question__content-actions {
|
|
2368
2369
|
position: absolute;
|
|
2369
2370
|
display: none;
|
|
2370
|
-
bottom: calc(2 * var(--base-unit, 8px));
|
|
2371
|
-
inset-inline-start: calc(4 * var(--base-unit, 8px));
|
|
2372
|
-
inset-inline-end: calc(3.5 * var(--base-unit, 8px));
|
|
2371
|
+
bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2372
|
+
inset-inline-start: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2373
|
+
inset-inline-end: calc(3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2373
2374
|
}
|
|
2374
2375
|
.svc-question__content-actions .sv-action--convertTo {
|
|
2375
|
-
min-width: calc(13 * var(--base-unit, 8px));
|
|
2376
|
+
min-width: calc(13 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2376
2377
|
max-width: max-content;
|
|
2377
2378
|
}
|
|
2378
2379
|
.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item {
|
|
@@ -2388,7 +2389,7 @@ svc-question {
|
|
|
2388
2389
|
}
|
|
2389
2390
|
.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__title--with-icon {
|
|
2390
2391
|
margin-inline-start: 0;
|
|
2391
|
-
margin-inline-end: calc(0.5 * var(--base-unit, 8px));
|
|
2392
|
+
margin-inline-end: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2392
2393
|
}
|
|
2393
2394
|
.svc-question__content-actions .sv-action--convertTo.sv-action--hidden {
|
|
2394
2395
|
min-width: 0;
|
|
@@ -2399,12 +2400,12 @@ svc-question {
|
|
|
2399
2400
|
|
|
2400
2401
|
.svc-question__content:focus,
|
|
2401
2402
|
.svc-creator .svc-page .svc-hovered > .svc-question__content {
|
|
2402
|
-
box-shadow: 0 0 0 2px var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2403
|
+
box-shadow: 0 0 0 2px var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
2403
2404
|
}
|
|
2404
2405
|
|
|
2405
2406
|
.svc-creator .svc-page .svc-question__content--selected:not(.svc-question__content--dragged).svc-question__content--selected,
|
|
2406
2407
|
.svc-creator:not(.svc-creator--mobile) .svc-page .svc-hovered > .svc-question__content:not(.svc-question__content--dragged).svc-question__content--selected {
|
|
2407
|
-
box-shadow: 0 0 0 2px var(--secondary, #ff9814);
|
|
2408
|
+
box-shadow: 0 0 0 2px var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2408
2409
|
}
|
|
2409
2410
|
.svc-creator .svc-page .svc-question__content--selected:not(.svc-question__content--dragged) > .svc-question__content-actions,
|
|
2410
2411
|
.svc-creator:not(.svc-creator--mobile) .svc-page .svc-hovered > .svc-question__content:not(.svc-question__content--dragged) > .svc-question__content-actions {
|
|
@@ -2412,31 +2413,31 @@ svc-question {
|
|
|
2412
2413
|
}
|
|
2413
2414
|
|
|
2414
2415
|
.svc-question__content--dragged {
|
|
2415
|
-
background: var(--background-
|
|
2416
|
+
background: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
|
|
2416
2417
|
}
|
|
2417
2418
|
.svc-question__content--dragged .sd-question__title {
|
|
2418
|
-
color: var(--foreground-light, #909090);
|
|
2419
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2419
2420
|
}
|
|
2420
2421
|
.svc-question__content--dragged.svc-question__content--selected .svc-question__content-actions {
|
|
2421
2422
|
display: none;
|
|
2422
2423
|
}
|
|
2423
2424
|
|
|
2424
2425
|
.svc-question__content .sd-question.sd-question--table {
|
|
2425
|
-
margin-top: calc(-1 * var(--base-unit, 8px));
|
|
2426
|
-
padding-top: calc(1 * var(--base-unit, 8px));
|
|
2426
|
+
margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2427
|
+
padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2427
2428
|
}
|
|
2428
2429
|
|
|
2429
2430
|
.svc-dragged-element-shortcut {
|
|
2430
2431
|
min-width: 100px;
|
|
2431
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
2432
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
2433
|
-
background-color: var(--background, #fff);
|
|
2434
|
-
color: var(--foreground, #161616);
|
|
2435
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
2432
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2433
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2434
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2435
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2436
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2436
2437
|
cursor: grabbing;
|
|
2437
2438
|
position: absolute;
|
|
2438
2439
|
z-index: 1000;
|
|
2439
|
-
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
|
|
2440
|
+
box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
|
|
2440
2441
|
-moz-user-select: none;
|
|
2441
2442
|
-webkit-user-select: none;
|
|
2442
2443
|
-ms-user-select: none;
|
|
@@ -2448,33 +2449,33 @@ svc-question {
|
|
|
2448
2449
|
}
|
|
2449
2450
|
|
|
2450
2451
|
.svc-dragged-element-shortcut .sv-svg-icon use {
|
|
2451
|
-
fill: var(--primary, #19b394);
|
|
2452
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2452
2453
|
}
|
|
2453
2454
|
|
|
2454
2455
|
.svc-dragged-element-shortcut--selected {
|
|
2455
|
-
border: 2px solid var(--secondary, #ff9814);
|
|
2456
|
+
border: 2px solid var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2456
2457
|
}
|
|
2457
2458
|
|
|
2458
2459
|
.svc-dragged-element-shortcut__text {
|
|
2459
|
-
font-family: var(--font-family);
|
|
2460
|
+
font-family: var(--font-family, var(--font-family));
|
|
2460
2461
|
font-style: normal;
|
|
2461
2462
|
font-weight: 600;
|
|
2462
|
-
font-size: calc(
|
|
2463
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
2464
|
-
margin-left: calc(4 * var(--base-unit, 8px));
|
|
2465
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
2463
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
2464
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
2465
|
+
margin-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2466
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2466
2467
|
}
|
|
2467
2468
|
|
|
2468
2469
|
.svc-dragged-element-shortcut__icon {
|
|
2469
2470
|
position: absolute;
|
|
2470
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
2471
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
2471
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2472
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2472
2473
|
}
|
|
2473
2474
|
|
|
2474
2475
|
.svc-question__content--drag-over-inside .svc-panel__placeholder_frame,
|
|
2475
2476
|
.svc-hovered > .svc-question__content--drag-over-inside .svc-panel__placeholder_frame {
|
|
2476
|
-
box-shadow: 0 0 0 2px var(--primary, #19b394);
|
|
2477
|
-
background: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
2477
|
+
box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2478
|
+
background: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2478
2479
|
}
|
|
2479
2480
|
.svc-question__content--drag-over-inside .svc-panel__placeholder_frame > .svc-question__content-actions,
|
|
2480
2481
|
.svc-hovered > .svc-question__content--drag-over-inside .svc-panel__placeholder_frame > .svc-question__content-actions {
|
|
@@ -2485,7 +2486,7 @@ svc-question {
|
|
|
2485
2486
|
content: " ";
|
|
2486
2487
|
position: absolute;
|
|
2487
2488
|
left: -7px;
|
|
2488
|
-
background: var(--secondary, #ff9814);
|
|
2489
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2489
2490
|
top: 0;
|
|
2490
2491
|
height: 100%;
|
|
2491
2492
|
width: 4px;
|
|
@@ -2495,7 +2496,7 @@ svc-question {
|
|
|
2495
2496
|
content: " ";
|
|
2496
2497
|
position: absolute;
|
|
2497
2498
|
right: -7px;
|
|
2498
|
-
background: var(--secondary, #ff9814);
|
|
2499
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2499
2500
|
top: 0;
|
|
2500
2501
|
height: 100%;
|
|
2501
2502
|
width: 4px;
|
|
@@ -2505,7 +2506,7 @@ svc-question {
|
|
|
2505
2506
|
content: " ";
|
|
2506
2507
|
position: absolute;
|
|
2507
2508
|
left: 0;
|
|
2508
|
-
background: var(--secondary, #ff9814);
|
|
2509
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2509
2510
|
top: -12px;
|
|
2510
2511
|
width: 100%;
|
|
2511
2512
|
height: 4px;
|
|
@@ -2515,7 +2516,7 @@ svc-question {
|
|
|
2515
2516
|
content: " ";
|
|
2516
2517
|
position: absolute;
|
|
2517
2518
|
left: 0;
|
|
2518
|
-
background: var(--secondary, #ff9814);
|
|
2519
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2519
2520
|
bottom: -12px;
|
|
2520
2521
|
width: 100%;
|
|
2521
2522
|
height: 4px;
|
|
@@ -2600,7 +2601,7 @@ svc-question .sv-action-bar,
|
|
|
2600
2601
|
top: 0;
|
|
2601
2602
|
left: 0;
|
|
2602
2603
|
visibility: hidden;
|
|
2603
|
-
height: calc(3.5 * var(--base-unit, 8px));
|
|
2604
|
+
height: calc(3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2604
2605
|
width: 100%;
|
|
2605
2606
|
display: flex;
|
|
2606
2607
|
align-items: center;
|
|
@@ -2609,16 +2610,16 @@ svc-question .sv-action-bar,
|
|
|
2609
2610
|
|
|
2610
2611
|
.svc-question__drag-element {
|
|
2611
2612
|
width: 100%;
|
|
2612
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
2613
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2613
2614
|
opacity: 0.5;
|
|
2614
2615
|
}
|
|
2615
2616
|
.svc-question__drag-element use {
|
|
2616
|
-
fill: var(--foreground-light, #909090);
|
|
2617
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2617
2618
|
}
|
|
2618
2619
|
|
|
2619
2620
|
.sd-panel :not(.svc-hovered) > .svc-question__content:not(.svc-question__content--selected),
|
|
2620
2621
|
.sd-row--multiple :not(.svc-hovered) > .svc-question__content:not(.svc-question__content--selected) {
|
|
2621
|
-
border: 1px dashed var(--border, #d6d6d6);
|
|
2622
|
+
border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2622
2623
|
box-shadow: none;
|
|
2623
2624
|
}
|
|
2624
2625
|
.sd-panel .svc-question__content,
|
|
@@ -2636,8 +2637,8 @@ svc-question .sv-action-bar,
|
|
|
2636
2637
|
box-shadow: none;
|
|
2637
2638
|
}
|
|
2638
2639
|
.sd-row--multiple .svc-hovered > .svc-question__content:not(.svc-question__content--selected) {
|
|
2639
|
-
border: 1px solid var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2640
|
-
box-shadow: 0 0 0 1px var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2640
|
+
border: 1px solid var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
2641
|
+
box-shadow: 0 0 0 1px var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
2641
2642
|
}
|
|
2642
2643
|
|
|
2643
2644
|
.sd-panel .svc-row--ghost.svc-row--ghost .svc-question__content.svc-question__content {
|
|
@@ -2657,15 +2658,15 @@ svc-question .sv-action-bar,
|
|
|
2657
2658
|
}
|
|
2658
2659
|
|
|
2659
2660
|
.svc-panel__placeholder_frame {
|
|
2660
|
-
border: 1px dashed var(--border, #d6d6d6);
|
|
2661
|
+
border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2661
2662
|
width: 100%;
|
|
2662
2663
|
box-sizing: border-box;
|
|
2663
|
-
height: calc(30 * var(--base-unit, 8px));
|
|
2664
|
+
height: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2664
2665
|
display: flex;
|
|
2665
2666
|
align-items: center;
|
|
2666
2667
|
justify-content: center;
|
|
2667
2668
|
flex-direction: column;
|
|
2668
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
2669
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2669
2670
|
}
|
|
2670
2671
|
|
|
2671
2672
|
.svc-panel__add-new-question-container {
|
|
@@ -2677,15 +2678,15 @@ svc-question .sv-action-bar,
|
|
|
2677
2678
|
|
|
2678
2679
|
.svc-panel__add-new-question {
|
|
2679
2680
|
align-items: center;
|
|
2680
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2681
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2681
2682
|
margin-left: 0;
|
|
2682
2683
|
margin-right: 0;
|
|
2683
2684
|
width: auto;
|
|
2684
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
2685
|
-
line-height: calc(5 * var(--base-unit, 8px));
|
|
2685
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2686
|
+
line-height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2686
2687
|
vertical-align: baseline;
|
|
2687
2688
|
text-align: center;
|
|
2688
|
-
background-color: var(--background, #fff);
|
|
2689
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2689
2690
|
cursor: pointer;
|
|
2690
2691
|
user-select: none;
|
|
2691
2692
|
border: none;
|
|
@@ -2699,40 +2700,40 @@ svc-question .sv-action-bar,
|
|
|
2699
2700
|
align-items: center;
|
|
2700
2701
|
flex-grow: 1;
|
|
2701
2702
|
justify-content: center;
|
|
2702
|
-
margin: calc(1 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
2703
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
2704
|
-
color: var(--primary, #19b394);
|
|
2703
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2704
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2705
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2705
2706
|
}
|
|
2706
2707
|
|
|
2707
2708
|
.svc-panel__question-type-selector {
|
|
2708
2709
|
appearance: none;
|
|
2709
2710
|
display: flex;
|
|
2710
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
2711
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
2711
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2712
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2712
2713
|
box-sizing: border-box;
|
|
2713
2714
|
border: none;
|
|
2714
2715
|
border-radius: 2px;
|
|
2715
2716
|
background-color: transparent;
|
|
2716
2717
|
cursor: pointer;
|
|
2717
|
-
margin-right: calc(1 * var(--base-unit, 8px));
|
|
2718
|
+
margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2718
2719
|
outline: none;
|
|
2719
|
-
top: calc(2 * var(--base-unit, 8px));
|
|
2720
|
+
top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2720
2721
|
margin: 0;
|
|
2721
2722
|
position: absolute;
|
|
2722
2723
|
right: 0;
|
|
2723
2724
|
}
|
|
2724
2725
|
.svc-panel__question-type-selector use {
|
|
2725
|
-
fill: var(--foreground-light, #909090);
|
|
2726
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2726
2727
|
}
|
|
2727
2728
|
.svc-panel__question-type-selector:hover {
|
|
2728
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
2729
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2729
2730
|
}
|
|
2730
2731
|
.svc-panel__question-type-selector:focus {
|
|
2731
|
-
background-color: var(--sjs-primary-backcolor-light, rgba(25, 179, 148, 0.1));
|
|
2732
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2732
2733
|
}
|
|
2733
2734
|
|
|
2734
2735
|
.sd-panel .svc-row {
|
|
2735
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
2736
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2736
2737
|
}
|
|
2737
2738
|
.sd-panel .svc-row:first-of-type {
|
|
2738
2739
|
margin-top: 0;
|
|
@@ -2754,28 +2755,28 @@ svc-question .sv-action-bar,
|
|
|
2754
2755
|
padding-top: 0;
|
|
2755
2756
|
}
|
|
2756
2757
|
.svc-question__content .sd-table__cell--detail-panel .sd-panel__content {
|
|
2757
|
-
padding-top: calc(1 * var(--base-unit, 8px));
|
|
2758
|
+
padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2758
2759
|
}
|
|
2759
2760
|
.svc-question__content .sd-paneldynamic__panel-wrapper {
|
|
2760
2761
|
padding: 0;
|
|
2761
2762
|
}
|
|
2762
2763
|
.svc-question__content .sd-table__cell--actions .sv-action-bar-item:disabled {
|
|
2763
|
-
background: var(--background, #fff);
|
|
2764
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2764
2765
|
opacity: 1;
|
|
2765
2766
|
}
|
|
2766
2767
|
.svc-question__content .sd-table__cell--actions .sv-action-bar-item:disabled use {
|
|
2767
|
-
fill: var(--foreground-light, #909090);
|
|
2768
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2768
2769
|
}
|
|
2769
2770
|
|
|
2770
2771
|
.svc-question__content .svc-carry-forward-panel {
|
|
2771
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2772
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2772
2773
|
}
|
|
2773
2774
|
|
|
2774
2775
|
.svc-question__content--ranking .svc-carry-forward-panel {
|
|
2775
2776
|
margin-top: 0;
|
|
2776
2777
|
}
|
|
2777
2778
|
.svc-question__dropdown-choices {
|
|
2778
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2779
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2779
2780
|
}
|
|
2780
2781
|
|
|
2781
2782
|
.svc-question__dropdown-choice--collapsed:nth-last-child(1) {
|
|
@@ -2791,14 +2792,14 @@ svc-question .sv-action-bar,
|
|
|
2791
2792
|
}
|
|
2792
2793
|
|
|
2793
2794
|
.svc-question__dropdown-choices--wrapper .svc-action-button {
|
|
2794
|
-
margin-left: calc(6.75 * var(--base-unit, 8px));
|
|
2795
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
2795
|
+
margin-left: calc(6.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2796
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2796
2797
|
cursor: pointer;
|
|
2797
2798
|
}
|
|
2798
2799
|
.svc-image-question-controls {
|
|
2799
2800
|
position: absolute;
|
|
2800
|
-
top: calc(5 * var(--base-unit, 8px));
|
|
2801
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
2801
|
+
top: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2802
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2802
2803
|
display: none;
|
|
2803
2804
|
}
|
|
2804
2805
|
|
|
@@ -2807,7 +2808,7 @@ svc-question .sv-action-bar,
|
|
|
2807
2808
|
}
|
|
2808
2809
|
|
|
2809
2810
|
.svc-question__content--image:not(.svc-question__content--empty) {
|
|
2810
|
-
padding: calc(4 * var(--base-unit, 8px)) 0 calc(8 * var(--base-unit, 8px)) 0;
|
|
2811
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(8 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
2811
2812
|
}
|
|
2812
2813
|
|
|
2813
2814
|
.svc-question__content--image.svc-question__content--empty .sd-file,
|
|
@@ -2831,8 +2832,8 @@ svc-question .sv-action-bar,
|
|
|
2831
2832
|
}
|
|
2832
2833
|
|
|
2833
2834
|
.svc-question__content .sd-rating {
|
|
2834
|
-
margin-inline-start: calc(9 * var(--base-unit, 8px));
|
|
2835
|
-
width: calc(100% - 9 * var(--base-unit, 8px));
|
|
2835
|
+
margin-inline-start: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2836
|
+
width: calc(100% - 9 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2836
2837
|
}
|
|
2837
2838
|
.svc-question__content .sd-question--table .sd-rating {
|
|
2838
2839
|
margin-inline-start: 0;
|
|
@@ -2841,45 +2842,45 @@ svc-question .sv-action-bar,
|
|
|
2841
2842
|
}
|
|
2842
2843
|
.svc-question__content .svc-rating-question-controls {
|
|
2843
2844
|
display: flex;
|
|
2844
|
-
width: calc(8 * var(--base-unit, 8px));
|
|
2845
|
+
width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2845
2846
|
min-width: auto;
|
|
2846
2847
|
justify-content: flex-start;
|
|
2847
2848
|
}
|
|
2848
2849
|
.svc-question__content .sd-rating__item--fixed-size:focus-within {
|
|
2849
2850
|
width: unset;
|
|
2850
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2.5 * var(--base-unit, 8px));
|
|
2851
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2851
2852
|
}
|
|
2852
2853
|
.svc-item-value-wrapper {
|
|
2853
2854
|
position: relative;
|
|
2854
2855
|
display: flex;
|
|
2855
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
2856
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2856
2857
|
align-items: center;
|
|
2857
|
-
margin-left: calc(-5 * var(--base-unit, 8px));
|
|
2858
|
+
margin-left: calc(-5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2858
2859
|
}
|
|
2859
2860
|
|
|
2860
2861
|
.svc-question__dropdown-choice .svc-item-value-wrapper,
|
|
2861
2862
|
.sd-selectbase .svc-item-value-wrapper {
|
|
2862
2863
|
align-items: flex-start;
|
|
2863
|
-
min-width: calc(28 * var(--base-unit, 8px));
|
|
2864
|
+
min-width: calc(28 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2864
2865
|
}
|
|
2865
2866
|
.svc-question__dropdown-choice .svc-item-value__item,
|
|
2866
2867
|
.sd-selectbase .svc-item-value__item {
|
|
2867
|
-
padding-right: calc(1 * var(--base-unit, 8px));
|
|
2868
|
+
padding-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2868
2869
|
}
|
|
2869
2870
|
|
|
2870
2871
|
.svc-question__content .sd-selectbase__column:not(.sd-imagepicker__column):not(:first-of-type) {
|
|
2871
|
-
margin-left: calc(5 * var(--base-unit, 8px));
|
|
2872
|
+
margin-left: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2872
2873
|
}
|
|
2873
2874
|
.svc-question__content .sd-selectbase__column:not(:last-child) {
|
|
2874
2875
|
padding-right: 0;
|
|
2875
2876
|
}
|
|
2876
2877
|
|
|
2877
2878
|
.svc-item-value--dragging {
|
|
2878
|
-
background: var(--background, #fff);
|
|
2879
|
-
box-shadow:
|
|
2880
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
2881
|
-
padding-right: calc(3 * var(--base-unit, 8px));
|
|
2882
|
-
padding-left: calc(0.5 * var(--base-unit, 8px));
|
|
2879
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2880
|
+
box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
|
|
2881
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2882
|
+
padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2883
|
+
padding-left: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2883
2884
|
-moz-user-select: none;
|
|
2884
2885
|
-webkit-user-select: none;
|
|
2885
2886
|
-ms-user-select: none;
|
|
@@ -2888,8 +2889,8 @@ svc-question .sv-action-bar,
|
|
|
2888
2889
|
|
|
2889
2890
|
.svc-item-value-controls {
|
|
2890
2891
|
display: flex;
|
|
2891
|
-
margin: calc(1 * var(--base-unit, 8px)) 0;
|
|
2892
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
2892
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
2893
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2893
2894
|
box-sizing: border-box;
|
|
2894
2895
|
flex-shrink: 0;
|
|
2895
2896
|
min-width: 72px;
|
|
@@ -2898,11 +2899,11 @@ svc-question .sv-action-bar,
|
|
|
2898
2899
|
|
|
2899
2900
|
.svc-item-value-controls__button {
|
|
2900
2901
|
border-radius: 50%;
|
|
2901
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
2902
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2902
2903
|
cursor: pointer;
|
|
2903
2904
|
display: inline-block;
|
|
2904
2905
|
outline: none;
|
|
2905
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
2906
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2906
2907
|
box-sizing: content-box;
|
|
2907
2908
|
}
|
|
2908
2909
|
.svc-item-value-controls__button .sv-svg-icon {
|
|
@@ -2923,7 +2924,7 @@ svc-question .sv-action-bar,
|
|
|
2923
2924
|
}
|
|
2924
2925
|
|
|
2925
2926
|
.svc-item-value-controls__drag {
|
|
2926
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
2927
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2927
2928
|
cursor: move;
|
|
2928
2929
|
opacity: 0.25;
|
|
2929
2930
|
}
|
|
@@ -2931,29 +2932,29 @@ svc-question .sv-action-bar,
|
|
|
2931
2932
|
visibility: hidden;
|
|
2932
2933
|
}
|
|
2933
2934
|
.svc-item-value-controls__drag use {
|
|
2934
|
-
fill: var(--foreground, #161616);
|
|
2935
|
+
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2935
2936
|
}
|
|
2936
2937
|
|
|
2937
2938
|
.svc-item-value-controls__button--disabled {
|
|
2938
|
-
fill: var(--foreground-light, #909090);
|
|
2939
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2939
2940
|
opacity: 0.25;
|
|
2940
2941
|
cursor: default;
|
|
2941
2942
|
}
|
|
2942
2943
|
|
|
2943
2944
|
.svc-item-value-controls__remove:not(.svc-item-value-controls__button--disabled) use {
|
|
2944
|
-
fill: var(--red, #e60a3e);
|
|
2945
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
2945
2946
|
}
|
|
2946
2947
|
|
|
2947
2948
|
.svc-item-value-controls__add:not(.svc-item-value-controls__button--disabled) use {
|
|
2948
|
-
fill: var(--primary, #19b394);
|
|
2949
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2949
2950
|
}
|
|
2950
2951
|
|
|
2951
2952
|
.svc-item-value-controls__add:not(.svc-item-value-controls__button--disabled):hover, .svc-item-value-controls__add:not(.svc-item-value-controls__button--disabled):focus {
|
|
2952
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
2953
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2953
2954
|
}
|
|
2954
2955
|
|
|
2955
2956
|
.svc-item-value-controls__remove:not(.svc-item-value-controls__button--disabled):hover, .svc-item-value-controls__remove:not(.svc-item-value-controls__button--disabled):focus {
|
|
2956
|
-
background-color: var(--red-light, rgba(
|
|
2957
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
2957
2958
|
}
|
|
2958
2959
|
|
|
2959
2960
|
.sv-string-editor {
|
|
@@ -2962,13 +2963,13 @@ svc-question .sv-action-bar,
|
|
|
2962
2963
|
|
|
2963
2964
|
.svc-item-value--new .svc-item-value__item .sd-item__control-label,
|
|
2964
2965
|
.svc-item-value--new .svc-item-value__item .sv-ranking-item__text {
|
|
2965
|
-
color: var(--foreground-light, #909090);
|
|
2966
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2966
2967
|
}
|
|
2967
2968
|
.svc-item-value--new .svc-item-value__item .sd-item__decorator {
|
|
2968
2969
|
opacity: 0.35;
|
|
2969
2970
|
}
|
|
2970
2971
|
.svc-item-value--new .sv-ranking-item__index {
|
|
2971
|
-
background: var(--background-dim, #f3f3f3);
|
|
2972
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2972
2973
|
}
|
|
2973
2974
|
.svc-item-value--new .sv-ranking-item__index.sv-ranking-item__index--empty:empty {
|
|
2974
2975
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAACCAYAAABhYU3QAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAaSURBVHgBjcABDQAACAKwa2X6b1Tghxi8UQEkAAB3NR3N2gAAAABJRU5ErkJggg==);
|
|
@@ -2976,7 +2977,7 @@ svc-question .sv-action-bar,
|
|
|
2976
2977
|
|
|
2977
2978
|
.sv-ranking .svc-item-value-wrapper {
|
|
2978
2979
|
align-items: center;
|
|
2979
|
-
min-width: calc(27 * var(--base-unit, 8px));
|
|
2980
|
+
min-width: calc(27 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2980
2981
|
}
|
|
2981
2982
|
.sv-ranking .svc-item-value__item {
|
|
2982
2983
|
padding-right: 0;
|
|
@@ -3029,9 +3030,9 @@ svc-question .sv-action-bar,
|
|
|
3029
3030
|
}
|
|
3030
3031
|
.svc-item-value__ghost {
|
|
3031
3032
|
display: none;
|
|
3032
|
-
background: var(--background-dim, #f3f3f3);
|
|
3033
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3034
|
-
width: calc(25 * var(--base-unit, 8px));
|
|
3033
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3034
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3035
|
+
width: calc(25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3035
3036
|
height: 40px;
|
|
3036
3037
|
z-index: 11;
|
|
3037
3038
|
position: absolute;
|
|
@@ -3048,12 +3049,12 @@ svc-question .sv-action-bar,
|
|
|
3048
3049
|
}
|
|
3049
3050
|
.svc-image-item-value--new .sd-imagepicker__image {
|
|
3050
3051
|
box-sizing: border-box;
|
|
3051
|
-
border: 1px dashed var(--border, #d6d6d6);
|
|
3052
|
+
border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3052
3053
|
}
|
|
3053
3054
|
|
|
3054
3055
|
.svc-image-item-value--file-dragging .sd-imagepicker__image {
|
|
3055
|
-
border: 2px solid var(--primary, #19b394);
|
|
3056
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3056
|
+
border: 2px solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3057
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3057
3058
|
}
|
|
3058
3059
|
.svc-image-item-value--file-dragging .svc-image-item-value__item {
|
|
3059
3060
|
position: relative;
|
|
@@ -3066,13 +3067,13 @@ svc-question .sv-action-bar,
|
|
|
3066
3067
|
|
|
3067
3068
|
.svc-image-item-value-controls {
|
|
3068
3069
|
position: absolute;
|
|
3069
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
3070
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
3070
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3071
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3071
3072
|
}
|
|
3072
3073
|
|
|
3073
3074
|
.svc-image-item-value--new .svc-image-item-value-controls {
|
|
3074
|
-
top: calc(50% - 3 * var(--base-unit, 8px));
|
|
3075
|
-
left: calc(50% - 3 * var(--base-unit, 8px));
|
|
3075
|
+
top: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3076
|
+
left: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3076
3077
|
}
|
|
3077
3078
|
|
|
3078
3079
|
.svc-image-item-value--new .svc-image-item-value-controls__button {
|
|
@@ -3080,11 +3081,11 @@ svc-question .sv-action-bar,
|
|
|
3080
3081
|
}
|
|
3081
3082
|
|
|
3082
3083
|
.svc-image-item-value-controls__add use {
|
|
3083
|
-
fill: var(--primary, #19b394);
|
|
3084
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3084
3085
|
}
|
|
3085
3086
|
|
|
3086
3087
|
.svc-image-item-value-controls__add:hover, .svc-image-item-value-controls__add:focus {
|
|
3087
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3088
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3088
3089
|
}
|
|
3089
3090
|
|
|
3090
3091
|
.svc-choose-file-input {
|
|
@@ -3103,8 +3104,8 @@ svc-question .sv-action-bar,
|
|
|
3103
3104
|
display: none;
|
|
3104
3105
|
cursor: move;
|
|
3105
3106
|
position: absolute;
|
|
3106
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
3107
|
-
left: calc(1 * var(--base-unit, 8px));
|
|
3107
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3108
|
+
left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3108
3109
|
}
|
|
3109
3110
|
|
|
3110
3111
|
.svc-question__content--selected .svc-image-item-value-wrapper:hover .svc-image-item-value-controls__drag-area-indicator {
|
|
@@ -3120,31 +3121,31 @@ svc-question .sv-action-bar,
|
|
|
3120
3121
|
|
|
3121
3122
|
.svc-image-item-value-wrapper__ghost {
|
|
3122
3123
|
display: none;
|
|
3123
|
-
background: var(--background-dim, #f3f3f3);
|
|
3124
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3124
3125
|
}
|
|
3125
3126
|
|
|
3126
3127
|
.svc-image-item-value--single {
|
|
3127
3128
|
width: 100%;
|
|
3128
3129
|
}
|
|
3129
3130
|
.svc-image-item-value--single .sd-imagepicker__image {
|
|
3130
|
-
height: calc(30 * var(--base-unit, 8px));
|
|
3131
|
+
height: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3131
3132
|
}
|
|
3132
3133
|
.svc-matrix-cell {
|
|
3133
3134
|
position: relative;
|
|
3134
3135
|
}
|
|
3135
3136
|
|
|
3136
3137
|
.sd-table thead tr th .svc-matrix-cell {
|
|
3137
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
3138
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3138
3139
|
}
|
|
3139
3140
|
|
|
3140
3141
|
.svc-matrix-cell--selected {
|
|
3141
3142
|
position: absolute;
|
|
3142
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--secondary, #ff9814);
|
|
3143
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
3144
|
-
top: calc(0 * var(--base-unit, 8px));
|
|
3145
|
-
left: calc(0 * var(--base-unit, 8px));
|
|
3146
|
-
right: calc(0 * var(--base-unit, 8px));
|
|
3147
|
-
bottom: calc(0 * var(--base-unit, 8px));
|
|
3143
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
3144
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3145
|
+
top: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3146
|
+
left: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3147
|
+
right: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3148
|
+
bottom: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3148
3149
|
display: none;
|
|
3149
3150
|
}
|
|
3150
3151
|
.svc-matrix-cell--selected.svc-visible {
|
|
@@ -3152,32 +3153,32 @@ svc-question .sv-action-bar,
|
|
|
3152
3153
|
}
|
|
3153
3154
|
|
|
3154
3155
|
.svc-hovered > .svc-matrix-cell--selected:not(.svc-visible) {
|
|
3155
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
3156
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
3156
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
3157
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3157
3158
|
display: block;
|
|
3158
3159
|
}
|
|
3159
3160
|
|
|
3160
3161
|
.svc-matrix-cell__question-controls {
|
|
3161
3162
|
display: none;
|
|
3162
3163
|
position: absolute;
|
|
3163
|
-
top: calc(50% - 3 * var(--base-unit, 8px));
|
|
3164
|
-
left: calc(50% - 3 * var(--base-unit, 8px));
|
|
3164
|
+
top: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3165
|
+
left: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3165
3166
|
z-index: 2;
|
|
3166
3167
|
}
|
|
3167
3168
|
|
|
3168
3169
|
.svc-matrix-cell__question-controls-button {
|
|
3169
3170
|
display: block;
|
|
3170
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
3171
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
3172
|
-
background: var(--background, #fff);
|
|
3173
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
3171
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3172
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3173
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3174
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3174
3175
|
box-sizing: border-box;
|
|
3175
3176
|
border-radius: 50%;
|
|
3176
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
3177
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3177
3178
|
cursor: pointer;
|
|
3178
3179
|
}
|
|
3179
3180
|
.svc-matrix-cell__question-controls-button use {
|
|
3180
|
-
fill: var(--foreground-light, #909090);
|
|
3181
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3181
3182
|
}
|
|
3182
3183
|
|
|
3183
3184
|
.svc-matrix-cell:hover .svc-matrix-cell__question-controls {
|
|
@@ -3185,13 +3186,13 @@ svc-question .sv-action-bar,
|
|
|
3185
3186
|
}
|
|
3186
3187
|
|
|
3187
3188
|
.svc-question__content--in-popup {
|
|
3188
|
-
width: calc(100% - 25 * var(--base-unit, 8px));
|
|
3189
|
-
min-width: calc(70 * var(--base-unit, 8px));
|
|
3190
|
-
padding: calc(5 * var(--base-unit, 8px));
|
|
3189
|
+
width: calc(100% - 25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3190
|
+
min-width: calc(70 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3191
|
+
padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3191
3192
|
}
|
|
3192
3193
|
|
|
3193
3194
|
.svc-matrix-cell__popup .sv-popup__scrolling-content {
|
|
3194
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
3195
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3195
3196
|
padding-top: 0;
|
|
3196
3197
|
}
|
|
3197
3198
|
.svc-matrix-cell__popup .svc-question__content {
|
|
@@ -3208,31 +3209,31 @@ svc-question .sv-action-bar,
|
|
|
3208
3209
|
font-family: var(--font-family);
|
|
3209
3210
|
width: 80%;
|
|
3210
3211
|
margin: auto;
|
|
3211
|
-
margin-bottom: calc(5 * var(--base-unit, 8px));
|
|
3212
|
-
background-color: var(--background, #fff);
|
|
3213
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
3212
|
+
margin-bottom: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3213
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3214
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
3214
3215
|
border-radius: 4px;
|
|
3215
3216
|
}
|
|
3216
3217
|
.svd-test-results .svd-test-results__header {
|
|
3217
3218
|
display: flex;
|
|
3218
3219
|
justify-content: space-between;
|
|
3219
3220
|
align-items: center;
|
|
3220
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3221
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3222
|
-
color: var(--foreground-light, #909090);
|
|
3223
|
-
border-bottom: 2px solid var(--border-light, #eaeaea);
|
|
3221
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3222
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3223
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3224
|
+
border-bottom: 2px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
3224
3225
|
}
|
|
3225
3226
|
.svd-test-results .svd-test-results__header .svd-test-results__header-text {
|
|
3226
3227
|
margin: 0;
|
|
3227
3228
|
}
|
|
3228
3229
|
.svd-test-results .svd-test-results__header .svd-test-results__header-types {
|
|
3229
3230
|
display: flex;
|
|
3230
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
3231
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3231
3232
|
}
|
|
3232
3233
|
.svd-test-results .svd-test-results__text {
|
|
3233
3234
|
display: flex;
|
|
3234
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3235
|
-
width: calc(100% - (6 * var(--base-unit, 8px)));
|
|
3235
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3236
|
+
width: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
3236
3237
|
overflow: auto;
|
|
3237
3238
|
user-select: text;
|
|
3238
3239
|
white-space: pre-wrap;
|
|
@@ -3246,34 +3247,34 @@ svc-question .sv-action-bar,
|
|
|
3246
3247
|
}
|
|
3247
3248
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker {
|
|
3248
3249
|
position: absolute;
|
|
3249
|
-
top: calc(1.5 * var(--base-unit, 8px));
|
|
3250
|
+
top: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3250
3251
|
}
|
|
3251
3252
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker .sv-svg-icon {
|
|
3252
3253
|
transition: transform 0.2s ease-in-out;
|
|
3253
3254
|
}
|
|
3254
3255
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker .sv-svg-icon use {
|
|
3255
|
-
fill: var(--foreground-light, #909090);
|
|
3256
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3256
3257
|
}
|
|
3257
3258
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker.svd-test-results__marker--expanded .sv-svg-icon {
|
|
3258
3259
|
transform-origin: center;
|
|
3259
3260
|
transform: rotate(90deg);
|
|
3260
3261
|
}
|
|
3261
3262
|
.svd-test-results .svd-test-results__table table th {
|
|
3262
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
3263
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3263
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3264
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3264
3265
|
text-align: left;
|
|
3265
3266
|
font-weight: 600;
|
|
3266
3267
|
font-size: 12px;
|
|
3267
|
-
color: var(--foreground-light, #909090);
|
|
3268
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3268
3269
|
}
|
|
3269
3270
|
.svd-test-results .svd-test-results__table table th:nth-child(1) {
|
|
3270
|
-
padding-left: calc(3 * var(--base-unit, 8px));
|
|
3271
|
+
padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3271
3272
|
}
|
|
3272
3273
|
.svd-test-results .svd-test-results__table table td {
|
|
3273
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
3274
|
-
max-width: calc(50 * var(--base-unit, 8px));
|
|
3274
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3275
|
+
max-width: calc(50 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3275
3276
|
overflow: auto;
|
|
3276
|
-
border-top: 2px solid var(--border-light, #eaeaea);
|
|
3277
|
+
border-top: 2px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
3277
3278
|
user-select: text;
|
|
3278
3279
|
}
|
|
3279
3280
|
.svd-test-results .svd-test-results__table table td:nth-child(1) {
|
|
@@ -3283,7 +3284,7 @@ svc-question .sv-action-bar,
|
|
|
3283
3284
|
}
|
|
3284
3285
|
.svd-test-results .svd-test-results__table table td:nth-child(2) {
|
|
3285
3286
|
width: 50%;
|
|
3286
|
-
padding-right: calc(3 * var(--base-unit, 8px));
|
|
3287
|
+
padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3287
3288
|
}
|
|
3288
3289
|
.svd-test-results .svd-test-results__table table .survey-result-value {
|
|
3289
3290
|
word-break: break-all;
|
|
@@ -3292,11 +3293,11 @@ svc-question .sv-action-bar,
|
|
|
3292
3293
|
vertical-align: top;
|
|
3293
3294
|
}
|
|
3294
3295
|
.svd-test-results .svd-test-results__table table tr .svd-test-results__node-value {
|
|
3295
|
-
color: var(--foreground-light, #909090);
|
|
3296
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3296
3297
|
}
|
|
3297
3298
|
.svc-designer-header .sd-container-modern__title {
|
|
3298
3299
|
gap: 0;
|
|
3299
|
-
column-gap: calc(6 * var(--base-unit, 8px));
|
|
3300
|
+
column-gap: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3300
3301
|
}
|
|
3301
3302
|
|
|
3302
3303
|
.svc-logo-image {
|
|
@@ -3309,39 +3310,39 @@ svc-question .sv-action-bar,
|
|
|
3309
3310
|
}
|
|
3310
3311
|
.svc-logo-image .svc-image-item-value-controls {
|
|
3311
3312
|
display: block;
|
|
3312
|
-
top: calc(2.5 * var(--base-unit, 8px));
|
|
3313
|
-
right: calc(1.5 * var(--base-unit, 8px));
|
|
3313
|
+
top: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3314
|
+
right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3314
3315
|
}
|
|
3315
3316
|
|
|
3316
3317
|
.svc-logo-image-placeholder {
|
|
3317
|
-
font-size: calc(4 * var(--base-unit, 8px));
|
|
3318
|
-
color: var(--foreground-light, #909090);
|
|
3318
|
+
font-size: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3319
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3319
3320
|
opacity: 0.25;
|
|
3320
3321
|
white-space: nowrap;
|
|
3321
3322
|
word-break: keep-all;
|
|
3322
3323
|
padding: 0;
|
|
3323
|
-
width: calc(8 * var(--base-unit, 8px));
|
|
3324
|
-
height: calc(8 * var(--base-unit, 8px));
|
|
3324
|
+
width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3325
|
+
height: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3325
3326
|
display: flex;
|
|
3326
3327
|
justify-content: center;
|
|
3327
3328
|
align-items: center;
|
|
3328
|
-
margin-right: calc(-2 * var(--base-unit, 8px));
|
|
3329
|
-
border-radius: calc(4 * var(--base-unit, 8px));
|
|
3329
|
+
margin-right: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3330
|
+
border-radius: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3330
3331
|
}
|
|
3331
3332
|
.svc-logo-image-placeholder:hover {
|
|
3332
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3333
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3333
3334
|
opacity: unset;
|
|
3334
3335
|
}
|
|
3335
3336
|
.svc-logo-image-placeholder:hover use {
|
|
3336
|
-
fill: var(--primary, #19b394);
|
|
3337
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3337
3338
|
}
|
|
3338
3339
|
.svc-logo-image-placeholder svg {
|
|
3339
|
-
width: calc(4 * var(--base-unit, 8px));
|
|
3340
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
3340
|
+
width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3341
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3341
3342
|
}
|
|
3342
3343
|
|
|
3343
3344
|
.svc-logo-image-placeholder use {
|
|
3344
|
-
fill: var(--foreground-light, #909090);
|
|
3345
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3345
3346
|
}
|
|
3346
3347
|
|
|
3347
3348
|
.svc-logo-image-container {
|
|
@@ -3378,21 +3379,21 @@ svc-question .sv-action-bar,
|
|
|
3378
3379
|
}
|
|
3379
3380
|
|
|
3380
3381
|
.svc-link-value-button {
|
|
3381
|
-
margin-left: calc(-2 * var(--base-unit, 8px));
|
|
3382
|
+
margin-left: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3382
3383
|
}
|
|
3383
3384
|
|
|
3384
3385
|
.svc-question-link__clear-button {
|
|
3385
|
-
color: var(--red, #e60a3e);
|
|
3386
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
3386
3387
|
font-weight: 600;
|
|
3387
3388
|
cursor: pointer;
|
|
3388
3389
|
}
|
|
3389
3390
|
|
|
3390
3391
|
.svc-question-link__clear-button:focus,
|
|
3391
3392
|
.svc-question-link__clear-button:hover {
|
|
3392
|
-
background-color: var(--red-light, rgba(
|
|
3393
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
3393
3394
|
}
|
|
3394
3395
|
.svc-property-panel__item {
|
|
3395
|
-
margin: calc(2 * var(--base-unit, 8px)) 0;
|
|
3396
|
+
margin: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
3396
3397
|
width: 100%;
|
|
3397
3398
|
}
|
|
3398
3399
|
.svc-property-panel__group {
|
|
@@ -3400,67 +3401,67 @@ svc-question .sv-action-bar,
|
|
|
3400
3401
|
-moz-appearance: none;
|
|
3401
3402
|
appearance: none;
|
|
3402
3403
|
width: 100%;
|
|
3403
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
3404
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3404
3405
|
border: none;
|
|
3405
3406
|
outline: none;
|
|
3406
|
-
color: var(--foreground-light, #909090);
|
|
3407
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3407
3408
|
cursor: pointer;
|
|
3408
3409
|
text-align: left;
|
|
3409
|
-
background: var(--background, #fff);
|
|
3410
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
3410
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3411
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3411
3412
|
font-family: var(--font-family);
|
|
3412
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3413
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3413
3414
|
}
|
|
3414
3415
|
|
|
3415
3416
|
.svc-property-panel__group:disabled,
|
|
3416
3417
|
.svc-property-panel__group:disabled:hover {
|
|
3417
|
-
background-color: var(--background, #fff);
|
|
3418
|
-
color: var(--foreground, #161616);
|
|
3418
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3419
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3419
3420
|
opacity: 0.25;
|
|
3420
3421
|
cursor: default;
|
|
3421
3422
|
}
|
|
3422
3423
|
|
|
3423
3424
|
.svc-property-panel__group:hover {
|
|
3424
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3425
|
-
color: var(--foreground-light, #909090);
|
|
3425
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3426
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3426
3427
|
font-weight: 400;
|
|
3427
3428
|
}
|
|
3428
3429
|
|
|
3429
3430
|
.svc-property-panel__group--active,
|
|
3430
3431
|
.svc-property-panel__group--active:hover {
|
|
3431
|
-
color: var(--foreground, #161616);
|
|
3432
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3432
3433
|
font-weight: 600;
|
|
3433
|
-
background-color: var(--background, #fff);
|
|
3434
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3434
3435
|
}
|
|
3435
3436
|
.svc-tabbed-menu-item {
|
|
3436
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3437
|
-
height: calc(8 * var(--base-unit, 8px));
|
|
3438
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
3437
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3438
|
+
height: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3439
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3439
3440
|
box-sizing: border-box;
|
|
3440
3441
|
cursor: pointer;
|
|
3441
3442
|
}
|
|
3442
3443
|
.svc-tabbed-menu-item:hover, .svc-tabbed-menu-item:focus {
|
|
3443
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3444
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
3444
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3445
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3445
3446
|
outline: none;
|
|
3446
3447
|
}
|
|
3447
3448
|
|
|
3448
3449
|
.svc-tabbed-menu-item--selected {
|
|
3449
|
-
background: var(--background, #fff);
|
|
3450
|
-
box-shadow: inset 0px -2px 0px var(--primary, #19b394);
|
|
3450
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3451
|
+
box-shadow: inset 0px -2px 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3451
3452
|
}
|
|
3452
3453
|
.svc-tabbed-menu-item--selected:hover, .svc-tabbed-menu-item--selected:focus {
|
|
3453
|
-
background: var(--background, #fff);
|
|
3454
|
-
box-shadow: inset 0px -2px 0px var(--primary, #19b394);
|
|
3454
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3455
|
+
box-shadow: inset 0px -2px 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3455
3456
|
}
|
|
3456
3457
|
|
|
3457
3458
|
.svc-tabbed-menu-item--disabled {
|
|
3458
3459
|
cursor: default;
|
|
3459
|
-
color: var(--foreground, #161616);
|
|
3460
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3460
3461
|
opacity: 0.25;
|
|
3461
3462
|
}
|
|
3462
3463
|
.svc-tabbed-menu-item--disabled:hover {
|
|
3463
|
-
background-color: var(--background, #fff);
|
|
3464
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3464
3465
|
}
|
|
3465
3466
|
|
|
3466
3467
|
.svc-tabbed-menu-item--hidden {
|
|
@@ -3469,7 +3470,7 @@ svc-question .sv-action-bar,
|
|
|
3469
3470
|
|
|
3470
3471
|
.svc-tabbed-menu-item .svc-tabbed-menu-item__text {
|
|
3471
3472
|
white-space: nowrap;
|
|
3472
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
3473
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3473
3474
|
}
|
|
3474
3475
|
|
|
3475
3476
|
.svc-tabbed-menu-item-container .sv-dots__item {
|
|
@@ -3480,7 +3481,7 @@ svc-question .sv-action-bar,
|
|
|
3480
3481
|
white-space: nowrap;
|
|
3481
3482
|
overflow: hidden;
|
|
3482
3483
|
align-items: center;
|
|
3483
|
-
height: calc(8 * var(--base-unit, 8px));
|
|
3484
|
+
height: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3484
3485
|
}
|
|
3485
3486
|
|
|
3486
3487
|
.svc-tabbed-menu-wrapper {
|
|
@@ -3493,19 +3494,19 @@ svc-question .sv-action-bar,
|
|
|
3493
3494
|
align-items: center;
|
|
3494
3495
|
z-index: 20;
|
|
3495
3496
|
outline: none;
|
|
3496
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
3497
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3497
3498
|
}
|
|
3498
3499
|
.svc-toolbox__item sv-svg-icon,
|
|
3499
3500
|
.svc-toolbox__item .sv-svg-icon {
|
|
3500
3501
|
display: block;
|
|
3501
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
3502
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3502
3503
|
}
|
|
3503
3504
|
|
|
3504
3505
|
.svc-toolbox__item-container {
|
|
3505
3506
|
outline: none;
|
|
3506
3507
|
}
|
|
3507
3508
|
.svc-toolbox__item-container .sv-svg-icon use {
|
|
3508
|
-
fill: var(--foreground-light, #909090);
|
|
3509
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3509
3510
|
}
|
|
3510
3511
|
|
|
3511
3512
|
.svc-toolbox__item-banner {
|
|
@@ -3514,19 +3515,19 @@ svc-question .sv-action-bar,
|
|
|
3514
3515
|
box-sizing: border-box;
|
|
3515
3516
|
align-items: center;
|
|
3516
3517
|
margin-right: 0;
|
|
3517
|
-
margin-left: calc(-1.5 * var(--base-unit, 8px));
|
|
3518
|
+
margin-left: calc(-1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3518
3519
|
}
|
|
3519
3520
|
.svc-toolbox__item-banner .svc-toolbox__item-icon {
|
|
3520
3521
|
position: absolute;
|
|
3521
3522
|
display: block;
|
|
3522
|
-
left: calc(1.5 * var(--base-unit, 8px));
|
|
3523
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
3523
|
+
left: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3524
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3524
3525
|
}
|
|
3525
3526
|
.svc-toolbox__item-banner .svc-toolbox__item-title {
|
|
3526
|
-
color: var(--foreground, #161616);
|
|
3527
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3527
3528
|
}
|
|
3528
3529
|
.svc-toolbox__item-banner .sv-svg-icon use {
|
|
3529
|
-
fill: var(--primary, #19b394);
|
|
3530
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3530
3531
|
}
|
|
3531
3532
|
|
|
3532
3533
|
.svc-creator__toolbox--right .svc-toolbox__item:hover .svc-toolbox__item-banner,
|
|
@@ -3538,11 +3539,11 @@ svc-question .sv-action-bar,
|
|
|
3538
3539
|
[style*="direction: rtl"] .svc-toolbox__item:hover .svc-toolbox__item-banner,
|
|
3539
3540
|
[style*="direction: rtl"] .svc-toolbox__item:focus .svc-toolbox__item-banner {
|
|
3540
3541
|
flex-direction: row-reverse;
|
|
3541
|
-
padding-right: calc(1.5 * var(--base-unit, 8px));
|
|
3542
|
-
padding-left: calc(2 * var(--base-unit, 8px));
|
|
3542
|
+
padding-right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3543
|
+
padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3543
3544
|
margin-left: 0;
|
|
3544
3545
|
margin-right: 0;
|
|
3545
|
-
transform: translateX(calc(1.5 * var(--base-unit, 8px)));
|
|
3546
|
+
transform: translateX(calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
3546
3547
|
}
|
|
3547
3548
|
.svc-creator__toolbox--right .svc-toolbox__item:hover .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3548
3549
|
.svc-creator__toolbox--right .svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
@@ -3552,8 +3553,8 @@ svc-question .sv-action-bar,
|
|
|
3552
3553
|
[style*="direction:rtl"] .svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3553
3554
|
[style*="direction: rtl"] .svc-toolbox__item:hover .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3554
3555
|
[style*="direction: rtl"] .svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title {
|
|
3555
|
-
padding-left: calc(1 * var(--base-unit, 8px));
|
|
3556
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
3556
|
+
padding-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3557
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3557
3558
|
}
|
|
3558
3559
|
.svc-creator__toolbox--right .svc-toolbox__item,
|
|
3559
3560
|
[dir=rtl] .svc-toolbox__item,
|
|
@@ -3584,61 +3585,61 @@ svc-question .sv-action-bar,
|
|
|
3584
3585
|
[style*="direction:rtl"] .svc-toolbox__item-banner .svc-toolbox__item-icon,
|
|
3585
3586
|
[style*="direction: rtl"] .svc-toolbox__item-banner .svc-toolbox__item-icon {
|
|
3586
3587
|
left: auto;
|
|
3587
|
-
right: calc(1.5 * var(--base-unit, 8px));
|
|
3588
|
+
right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3588
3589
|
}
|
|
3589
3590
|
|
|
3590
3591
|
.svc-toolbox__item-title {
|
|
3591
|
-
font-family: var(--font-family);
|
|
3592
|
+
font-family: var(--font-family, var(--font-family));
|
|
3592
3593
|
font-style: normal;
|
|
3593
3594
|
font-weight: 600;
|
|
3594
|
-
font-size: calc(
|
|
3595
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
3595
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
3596
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
3596
3597
|
display: block;
|
|
3597
|
-
padding-left: calc(1 * var(--base-unit, 8px));
|
|
3598
|
-
padding-right: calc(1.5 * var(--base-unit, 8px));
|
|
3598
|
+
padding-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3599
|
+
padding-right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3599
3600
|
white-space: nowrap;
|
|
3600
|
-
color: var(--foreground-light, #909090);
|
|
3601
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3601
3602
|
}
|
|
3602
3603
|
|
|
3603
3604
|
.svc-toolbox__item:hover .svc-toolbox__item-banner,
|
|
3604
3605
|
.svc-toolbox__item:focus .svc-toolbox__item-banner {
|
|
3605
|
-
max-width: calc(100 * var(--base-unit, 8px));
|
|
3606
|
-
padding-left: calc(1.5 * var(--base-unit, 8px));
|
|
3607
|
-
padding-right: calc(2 * var(--base-unit, 8px));
|
|
3606
|
+
max-width: calc(100 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3607
|
+
padding-left: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3608
|
+
padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3608
3609
|
opacity: 1;
|
|
3609
3610
|
}
|
|
3610
3611
|
.svc-toolbox__item:hover .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3611
3612
|
.svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title {
|
|
3612
|
-
padding-left: calc(4 * var(--base-unit, 8px));
|
|
3613
|
+
padding-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3613
3614
|
}
|
|
3614
3615
|
|
|
3615
3616
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):focus,
|
|
3616
3617
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):hover {
|
|
3617
3618
|
overflow: hidden;
|
|
3618
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3619
|
-
background-color: var(--background, #fff);
|
|
3620
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
|
|
3619
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3620
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3621
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
|
|
3621
3622
|
transition: 0.1s ease-in-out;
|
|
3622
3623
|
}
|
|
3623
3624
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):focus .svc-toolbox__item-title,
|
|
3624
3625
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):hover .svc-toolbox__item-title {
|
|
3625
|
-
color: var(--foreground, #161616);
|
|
3626
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3626
3627
|
}
|
|
3627
3628
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):focus .sv-svg-icon use,
|
|
3628
3629
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):hover .sv-svg-icon use {
|
|
3629
|
-
fill: var(--primary, #19b394);
|
|
3630
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3630
3631
|
}
|
|
3631
3632
|
|
|
3632
3633
|
.svc-toolbox__tool .sv-dots__item:hover:enabled,
|
|
3633
3634
|
.svc-toolbox__tool .sv-dots__item:focus:enabled,
|
|
3634
3635
|
.svc-toolbox__tool .sv-dots__item.sv-action-bar-item--pressed {
|
|
3635
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3636
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3636
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3637
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3637
3638
|
}
|
|
3638
3639
|
.svc-toolbox__tool .sv-dots__item:hover:enabled .sv-svg-icon use,
|
|
3639
3640
|
.svc-toolbox__tool .sv-dots__item:focus:enabled .sv-svg-icon use,
|
|
3640
3641
|
.svc-toolbox__tool .sv-dots__item.sv-action-bar-item--pressed .sv-svg-icon use {
|
|
3641
|
-
fill: var(--primary, #19b394);
|
|
3642
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3642
3643
|
}
|
|
3643
3644
|
|
|
3644
3645
|
[dir=rtl] .svc-toolbox-popup,
|
|
@@ -3651,24 +3652,24 @@ svc-question .sv-action-bar,
|
|
|
3651
3652
|
display: none;
|
|
3652
3653
|
}
|
|
3653
3654
|
.svc-toolbox-popup .sv-list__item .sv-list__item-body {
|
|
3654
|
-
padding-top: calc(1.5 * var(--base-unit, 8px));
|
|
3655
|
-
padding-bottom: calc(1.5 * var(--base-unit, 8px));
|
|
3656
|
-
padding-inline-start: calc(2 * var(--base-unit, 8px));
|
|
3657
|
-
padding-inline-end: calc(5 * var(--base-unit, 8px));
|
|
3655
|
+
padding-top: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3656
|
+
padding-bottom: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3657
|
+
padding-inline-start: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3658
|
+
padding-inline-end: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3658
3659
|
}
|
|
3659
3660
|
|
|
3660
3661
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots),
|
|
3661
3662
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover,
|
|
3662
3663
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots),
|
|
3663
3664
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover {
|
|
3664
|
-
color: var(--foreground, #161616);
|
|
3665
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3665
3666
|
opacity: 0.5;
|
|
3666
3667
|
}
|
|
3667
3668
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots) .sv-svg-icon use,
|
|
3668
3669
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover .sv-svg-icon use,
|
|
3669
3670
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots) .sv-svg-icon use,
|
|
3670
3671
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover .sv-svg-icon use {
|
|
3671
|
-
fill: var(--foreground, #161616);
|
|
3672
|
+
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3672
3673
|
opacity: 0.5;
|
|
3673
3674
|
}
|
|
3674
3675
|
svc-toolbox {
|
|
@@ -3679,14 +3680,14 @@ svc-toolbox {
|
|
|
3679
3680
|
|
|
3680
3681
|
.svc-toolbox {
|
|
3681
3682
|
height: 100%;
|
|
3682
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
3683
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3683
3684
|
box-sizing: border-box;
|
|
3684
3685
|
overflow-y: auto;
|
|
3685
3686
|
direction: rtl;
|
|
3686
3687
|
}
|
|
3687
3688
|
|
|
3688
3689
|
.svc-toolbox--compact {
|
|
3689
|
-
width: calc(10.5 * var(--base-unit, 8px));
|
|
3690
|
+
width: calc(10.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3690
3691
|
overflow: visible;
|
|
3691
3692
|
direction: ltr;
|
|
3692
3693
|
}
|
|
@@ -3707,25 +3708,25 @@ svc-toolbox {
|
|
|
3707
3708
|
}
|
|
3708
3709
|
|
|
3709
3710
|
.svc-toolbox__tool .sv-dots__item {
|
|
3710
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
3711
|
-
margin-top: calc(0.5 * var(--base-unit, 8px));
|
|
3711
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3712
|
+
margin-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3712
3713
|
}
|
|
3713
3714
|
|
|
3714
3715
|
.svc-toolbox__category-separator {
|
|
3715
3716
|
height: 1px;
|
|
3716
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
3717
|
-
background-color: var(--border, #d6d6d6);
|
|
3718
|
-
margin: calc(1 * var(--base-unit, 8px)) 0 calc(1.5 * var(--base-unit, 8px));
|
|
3717
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3718
|
+
background-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3719
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3719
3720
|
}
|
|
3720
3721
|
|
|
3721
3722
|
.svc-toolbox__category-header {
|
|
3722
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
3723
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
3724
|
-
background: var(--background-dim, #f3f3f3);
|
|
3725
|
-
border-bottom: 1px solid var(--border, #d6d6d6);
|
|
3723
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3724
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3725
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3726
|
+
border-bottom: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3726
3727
|
box-sizing: border-box;
|
|
3727
3728
|
width: 100%;
|
|
3728
|
-
min-width: calc(20 * var(--base-unit, 8px));
|
|
3729
|
+
min-width: calc(20 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3729
3730
|
position: relative;
|
|
3730
3731
|
}
|
|
3731
3732
|
|
|
@@ -3735,23 +3736,23 @@ svc-toolbox {
|
|
|
3735
3736
|
|
|
3736
3737
|
.svc-toolbox__category-title {
|
|
3737
3738
|
font-family: var(--font-family);
|
|
3738
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
3739
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3739
3740
|
font-weight: bold;
|
|
3740
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
3741
|
-
color: var(--foreground, #161616);
|
|
3741
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3742
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3742
3743
|
vertical-align: middle;
|
|
3743
3744
|
display: block;
|
|
3744
3745
|
}
|
|
3745
3746
|
|
|
3746
3747
|
.svc-toolbox__category-header__controls {
|
|
3747
3748
|
position: absolute;
|
|
3748
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
3749
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
3749
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3750
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3750
3751
|
display: none;
|
|
3751
3752
|
}
|
|
3752
3753
|
|
|
3753
3754
|
.svc-toolbox__category-header__button {
|
|
3754
|
-
fill: var(--foreground-light, #909090);
|
|
3755
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3755
3756
|
}
|
|
3756
3757
|
|
|
3757
3758
|
.svc-toolbox__category-header:hover .svc-toolbox__category-header__controls {
|
|
@@ -3763,7 +3764,7 @@ svc-toolbox {
|
|
|
3763
3764
|
}
|
|
3764
3765
|
.svc-toolbox__tool .sv-action__content {
|
|
3765
3766
|
display: flex;
|
|
3766
|
-
padding-top: calc(0.5 * var(--base-unit, 8px));
|
|
3767
|
+
padding-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3767
3768
|
flex-direction: column;
|
|
3768
3769
|
align-items: flex-start;
|
|
3769
3770
|
}
|
|
@@ -3803,9 +3804,9 @@ svc-toolbox {
|
|
|
3803
3804
|
}
|
|
3804
3805
|
|
|
3805
3806
|
.svc-side-bar__container-header {
|
|
3806
|
-
background: var(--background, #fff);
|
|
3807
|
-
box-shadow: inset 0px -2px 0px var(--primary, #19b394);
|
|
3808
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3807
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3808
|
+
box-shadow: inset 0px -2px 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3809
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3809
3810
|
display: flex;
|
|
3810
3811
|
}
|
|
3811
3812
|
|
|
@@ -3813,9 +3814,9 @@ svc-toolbox {
|
|
|
3813
3814
|
display: flex;
|
|
3814
3815
|
flex-direction: column;
|
|
3815
3816
|
align-items: flex-start;
|
|
3816
|
-
height: calc(100% - (8 * var(--base-unit, 8px)));
|
|
3817
|
+
height: calc(100% - (8 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
3817
3818
|
overflow-y: auto;
|
|
3818
|
-
background-color: var(--background, #fff);
|
|
3819
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3819
3820
|
}
|
|
3820
3821
|
|
|
3821
3822
|
.svc-side-bar__container-container {
|
|
@@ -3823,24 +3824,24 @@ svc-toolbox {
|
|
|
3823
3824
|
flex-direction: column;
|
|
3824
3825
|
align-items: flex-start;
|
|
3825
3826
|
width: 100%;
|
|
3826
|
-
padding: 0px calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3827
|
+
padding: 0px calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3827
3828
|
box-sizing: border-box;
|
|
3828
|
-
background: var(--background-dim, #f3f3f3);
|
|
3829
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
3829
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3830
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3830
3831
|
}
|
|
3831
3832
|
|
|
3832
3833
|
.svc-side-bar__container-title {
|
|
3833
3834
|
display: flex;
|
|
3834
|
-
line-height: calc(4.5 * var(--base-unit, 8px));
|
|
3835
|
+
line-height: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3835
3836
|
flex-grow: 1;
|
|
3836
3837
|
flex-shrink: 0;
|
|
3837
3838
|
justify-content: flex-end;
|
|
3838
|
-
padding: calc(1.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3839
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3839
3840
|
}
|
|
3840
3841
|
|
|
3841
3842
|
.svc-side-bar__container-actions {
|
|
3842
3843
|
width: 100%;
|
|
3843
|
-
padding: calc(1.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
3844
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3844
3845
|
}
|
|
3845
3846
|
.svc-side-bar__container-actions .sv-action-bar {
|
|
3846
3847
|
justify-content: flex-end;
|
|
@@ -3853,9 +3854,9 @@ svc-toolbox {
|
|
|
3853
3854
|
|
|
3854
3855
|
.svc-flex-column.svc-side-bar__wrapper {
|
|
3855
3856
|
width: auto;
|
|
3856
|
-
border-left: 1px solid var(--border, #d6d6d6);
|
|
3857
|
+
border-left: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3857
3858
|
height: 100%;
|
|
3858
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3859
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3859
3860
|
}
|
|
3860
3861
|
|
|
3861
3862
|
.svc-side-bar {
|
|
@@ -3867,7 +3868,7 @@ svc-toolbox {
|
|
|
3867
3868
|
overflow: visible;
|
|
3868
3869
|
}
|
|
3869
3870
|
.svc-flyout-side-bar .svc-side-bar__shadow {
|
|
3870
|
-
background-color: var(--foreground-light, #909090);
|
|
3871
|
+
background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3871
3872
|
opacity: 0.75;
|
|
3872
3873
|
position: absolute;
|
|
3873
3874
|
top: 0;
|
|
@@ -3915,12 +3916,12 @@ svc-toolbox {
|
|
|
3915
3916
|
.sv-mobile-side-bar .svc-side-bar__container-title {
|
|
3916
3917
|
display: block;
|
|
3917
3918
|
font-weight: bold;
|
|
3918
|
-
font-size: calc(3 * var(--base-unit, 8px));
|
|
3919
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
3919
|
+
font-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3920
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3920
3921
|
flex: unset;
|
|
3921
3922
|
}
|
|
3922
3923
|
.sv-mobile-side-bar .svc-side-bar__wrapper {
|
|
3923
|
-
top: calc(2 * var(--base-unit, 8px));
|
|
3924
|
+
top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3924
3925
|
background: none;
|
|
3925
3926
|
}
|
|
3926
3927
|
.sv-mobile-side-bar .svc-side-bar__container {
|
|
@@ -3929,20 +3930,20 @@ svc-toolbox {
|
|
|
3929
3930
|
}
|
|
3930
3931
|
.sv-mobile-side-bar .svc-side-bar__container-header {
|
|
3931
3932
|
border: unset;
|
|
3932
|
-
box-shadow: 0px calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3933
|
-
border-radius: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) 0px 0px;
|
|
3933
|
+
box-shadow: 0px calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3934
|
+
border-radius: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0px 0px;
|
|
3934
3935
|
}
|
|
3935
3936
|
.sv-mobile-side-bar .svc-side-bar__container-content {
|
|
3936
|
-
height: calc(100% - 20 * var(--base-unit, 8px));
|
|
3937
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3937
|
+
height: calc(100% - 20 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3938
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3938
3939
|
}
|
|
3939
3940
|
.sv-mobile-side-bar .svc-side-bar__container-close {
|
|
3940
3941
|
display: flex;
|
|
3941
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3942
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3942
3943
|
}
|
|
3943
3944
|
.sv-mobile-side-bar .svc-side-bar__container-close .svc-side-bar__container-close-button {
|
|
3944
3945
|
width: 100%;
|
|
3945
|
-
margin: calc(2 * var(--base-unit, 8px));
|
|
3946
|
+
margin: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3946
3947
|
}
|
|
3947
3948
|
|
|
3948
3949
|
.svc-side-bar .svc-toolbox {
|
|
@@ -3951,7 +3952,7 @@ svc-toolbox {
|
|
|
3951
3952
|
.spg-action-bar {
|
|
3952
3953
|
display: flex;
|
|
3953
3954
|
box-sizing: content-box;
|
|
3954
|
-
padding-right: calc(0.5 * var(--base-unit, 8px));
|
|
3955
|
+
padding-right: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3955
3956
|
position: relative;
|
|
3956
3957
|
align-items: center;
|
|
3957
3958
|
margin-left: auto;
|
|
@@ -3967,46 +3968,46 @@ svc-toolbox {
|
|
|
3967
3968
|
-moz-appearance: none;
|
|
3968
3969
|
appearance: none;
|
|
3969
3970
|
display: flex;
|
|
3970
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
3971
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3971
3972
|
box-sizing: border-box;
|
|
3972
3973
|
border: none;
|
|
3973
|
-
color: var(--primary, #19b394);
|
|
3974
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3974
3975
|
font-weight: 600;
|
|
3975
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3976
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3976
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3977
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3977
3978
|
font-family: var(--font-family);
|
|
3978
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3979
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3979
3980
|
background-color: transparent;
|
|
3980
3981
|
cursor: pointer;
|
|
3981
3982
|
}
|
|
3982
3983
|
.spg-action-button:hover, .spg-action-button:focus {
|
|
3983
3984
|
opacity: 1;
|
|
3984
3985
|
outline: none;
|
|
3985
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3986
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3986
3987
|
}
|
|
3987
3988
|
.spg-action-button:hover use, .spg-action-button:focus use {
|
|
3988
|
-
fill: var(--primary, #19b394);
|
|
3989
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3989
3990
|
}
|
|
3990
3991
|
|
|
3991
3992
|
.spg-action-button__icon {
|
|
3992
3993
|
display: block;
|
|
3993
3994
|
}
|
|
3994
3995
|
.spg-action-button__icon use {
|
|
3995
|
-
fill: var(--foreground-light, #909090);
|
|
3996
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3996
3997
|
}
|
|
3997
3998
|
|
|
3998
3999
|
.spg-action-button--danger {
|
|
3999
|
-
color: var(--red, #e60a3e);
|
|
4000
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
4000
4001
|
}
|
|
4001
4002
|
.spg-action-button--danger:hover, .spg-action-button--danger:focus {
|
|
4002
|
-
background-color: var(--red-light, rgba(
|
|
4003
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
4003
4004
|
}
|
|
4004
4005
|
.spg-action-button--danger:hover use, .spg-action-button--danger:focus use {
|
|
4005
|
-
fill: var(--red, #e60a3e);
|
|
4006
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
4006
4007
|
}
|
|
4007
4008
|
|
|
4008
4009
|
button.spg-action-button--large {
|
|
4009
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
4010
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4010
4011
|
}
|
|
4011
4012
|
|
|
4012
4013
|
.spg-action-button:disabled {
|
|
@@ -4024,7 +4025,7 @@ button.spg-action-button--large {
|
|
|
4024
4025
|
}
|
|
4025
4026
|
|
|
4026
4027
|
.spg-action-button--text {
|
|
4027
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
4028
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4028
4029
|
}
|
|
4029
4030
|
|
|
4030
4031
|
.spg-question {
|
|
@@ -4041,18 +4042,18 @@ button.spg-action-button--large {
|
|
|
4041
4042
|
.spg-question__title {
|
|
4042
4043
|
width: 100%;
|
|
4043
4044
|
margin: 0;
|
|
4044
|
-
padding: calc(1 * var(--base-unit, 8px)) 0;
|
|
4045
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4046
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4045
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4046
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4047
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4047
4048
|
font-family: var(--font-family);
|
|
4048
|
-
color: var(--foreground-light, #909090);
|
|
4049
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4049
4050
|
font-weight: normal;
|
|
4050
4051
|
box-sizing: border-box;
|
|
4051
4052
|
}
|
|
4052
4053
|
|
|
4053
4054
|
.spg-question__content {
|
|
4054
4055
|
width: 100%;
|
|
4055
|
-
color: var(--primary, #19b394);
|
|
4056
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4056
4057
|
cursor: pointer;
|
|
4057
4058
|
}
|
|
4058
4059
|
|
|
@@ -4072,40 +4073,40 @@ button.spg-action-button--large {
|
|
|
4072
4073
|
align-items: flex-end;
|
|
4073
4074
|
padding: 0px;
|
|
4074
4075
|
font-family: var(--font-family);
|
|
4075
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
4076
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
4077
|
-
color: var(--foreground-light, #909090);
|
|
4076
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4077
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4078
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4078
4079
|
position: absolute;
|
|
4079
|
-
inset-inline-end: calc(0.75 * var(--base-unit, 8px));
|
|
4080
|
-
inset-block-end: calc(0.5 * var(--base-unit, 8px));
|
|
4080
|
+
inset-inline-end: calc(0.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4081
|
+
inset-block-end: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4081
4082
|
}
|
|
4082
4083
|
|
|
4083
4084
|
.spg-question__description {
|
|
4084
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4085
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4086
|
-
color: var(--foreground, #161616);
|
|
4087
|
-
padding-bottom: calc(2 * var(--base-unit, 8px));
|
|
4085
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4086
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4087
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4088
|
+
padding-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4088
4089
|
white-space: normal;
|
|
4089
4090
|
}
|
|
4090
4091
|
|
|
4091
4092
|
.spg-row-narrow__question {
|
|
4092
|
-
margin-top: calc(-2 * var(--base-unit, 8px));
|
|
4093
|
+
margin-top: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4093
4094
|
}
|
|
4094
4095
|
|
|
4095
4096
|
.spg-row--multiple > div > .spg-row-narrow__question {
|
|
4096
|
-
margin-top: calc(-1 * var(--base-unit, 8px));
|
|
4097
|
+
margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4097
4098
|
}
|
|
4098
4099
|
|
|
4099
4100
|
.spg-question--location--left {
|
|
4100
4101
|
flex-direction: row;
|
|
4101
|
-
background: var(--background, #fff);
|
|
4102
|
-
box-shadow: inset 0 0 0 1px var(--border-inside, rgba(0, 0, 0, 0.16));
|
|
4103
|
-
line-height: calc(6 * var(--base-unit, 8px));
|
|
4102
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4103
|
+
box-shadow: inset 0 0 0 1px var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
|
|
4104
|
+
line-height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4104
4105
|
vertical-align: middle;
|
|
4105
4106
|
align-items: stretch;
|
|
4106
4107
|
}
|
|
4107
4108
|
.spg-question--location--left:focus-within {
|
|
4108
|
-
box-shadow: inset 0 0 0 2px var(--primary, #19b394);
|
|
4109
|
+
box-shadow: inset 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4109
4110
|
}
|
|
4110
4111
|
|
|
4111
4112
|
.spg-question__header--location--left {
|
|
@@ -4117,8 +4118,8 @@ button.spg-action-button--large {
|
|
|
4117
4118
|
align-items: center;
|
|
4118
4119
|
}
|
|
4119
4120
|
.spg-question__header--location--left .spg-question__title {
|
|
4120
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
4121
|
-
border-right: 1px solid var(--border, #d6d6d6);
|
|
4121
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4122
|
+
border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4122
4123
|
display: inline-block;
|
|
4123
4124
|
}
|
|
4124
4125
|
|
|
@@ -4136,48 +4137,48 @@ button.spg-action-button--large {
|
|
|
4136
4137
|
|
|
4137
4138
|
.spg-row--multiple {
|
|
4138
4139
|
display: flex;
|
|
4139
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
4140
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4140
4141
|
flex-wrap: wrap;
|
|
4141
4142
|
}
|
|
4142
4143
|
.spg-row--multiple > div {
|
|
4143
4144
|
flex-grow: 1;
|
|
4144
|
-
min-width: calc(25.5 * var(--base-unit, 8px));
|
|
4145
|
+
min-width: calc(25.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4145
4146
|
}
|
|
4146
4147
|
.spg-row--multiple > div .spg-question__header--location--left {
|
|
4147
|
-
min-width: calc(8 * var(--base-unit, 8px));
|
|
4148
|
+
min-width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4148
4149
|
}
|
|
4149
4150
|
.spg-row--multiple > div input {
|
|
4150
|
-
min-width: max(17 * var(--base-unit, 8px), 100%);
|
|
4151
|
+
min-width: max(17 * var(--sjs-base-unit, var(--base-unit, 8px)), 100%);
|
|
4151
4152
|
width: 0;
|
|
4152
4153
|
}
|
|
4153
4154
|
|
|
4154
4155
|
.spg-question__erbox {
|
|
4155
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
4156
|
-
color: var(--foreground, #161616);
|
|
4157
|
-
background-color: var(--red-light, rgba(
|
|
4158
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
4159
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4156
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4157
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4158
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
4159
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4160
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4160
4161
|
}
|
|
4161
4162
|
.spg-question__erbox > div {
|
|
4162
4163
|
display: flex;
|
|
4163
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
4164
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4164
4165
|
}
|
|
4165
4166
|
|
|
4166
4167
|
.spg-question__erbox-icon {
|
|
4167
4168
|
display: block;
|
|
4168
4169
|
flex-grow: 0;
|
|
4169
4170
|
flex-shrink: 0;
|
|
4170
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4171
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4172
|
-
background-size: calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
4171
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4172
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4173
|
+
background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4173
4174
|
background-repeat: no-repeat;
|
|
4174
4175
|
background-position: 0 0;
|
|
4175
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4176
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4176
4177
|
background-image: url("data:image/svg+xml,%3Csvg width='24' height='20' viewBox='0 0 24 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.0336 15.4803L14.5736 1.45346C13.9936 0.487805 12.9936 0 12.0036 0C11.0136 0 10.0136 0.487805 9.43364 1.45346L0.973642 15.4803C-0.226358 17.4714 1.21364 20 3.54364 20H20.4536C22.7836 20 24.2236 17.4714 23.0236 15.4803H23.0336ZM21.3336 17.5112C21.2436 17.6605 20.9936 18.0189 20.4636 18.0189H3.54364C3.01364 18.0189 2.76364 17.6705 2.67364 17.5112C2.58364 17.3519 2.41364 16.9537 2.68364 16.5057L11.1436 2.47885C11.4036 2.04082 11.8336 1.99104 12.0036 1.99104C12.1736 1.99104 12.5936 2.04082 12.8636 2.47885L21.3136 16.5057C21.5836 16.9537 21.4136 17.3519 21.3236 17.5112H21.3336ZM13.0036 7.05824V12.0358C13.0036 12.5834 12.5536 13.0314 12.0036 13.0314C11.4536 13.0314 11.0036 12.5834 11.0036 12.0358V7.05824C11.0036 6.5107 11.4536 6.06272 12.0036 6.06272C12.5536 6.06272 13.0036 6.5107 13.0036 7.05824ZM13.0036 15.0224C13.0036 15.5699 12.5536 16.0179 12.0036 16.0179C11.4536 16.0179 11.0036 15.5699 11.0036 15.0224C11.0036 14.4749 11.4536 14.0269 12.0036 14.0269C12.5536 14.0269 13.0036 14.4749 13.0036 15.0224Z' fill='%23E60A3E'/%3E%3C/svg%3E");
|
|
4177
4178
|
}
|
|
4178
4179
|
|
|
4179
4180
|
.spg-question__erbox--location--bottom {
|
|
4180
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4181
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4181
4182
|
}
|
|
4182
4183
|
|
|
4183
4184
|
.spg-input {
|
|
@@ -4185,63 +4186,63 @@ button.spg-action-button--large {
|
|
|
4185
4186
|
-moz-appearance: none;
|
|
4186
4187
|
appearance: none;
|
|
4187
4188
|
display: block;
|
|
4188
|
-
background-color: var(--background, #fff);
|
|
4189
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4189
4190
|
box-sizing: border-box;
|
|
4190
4191
|
width: 100%;
|
|
4191
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4192
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4192
4193
|
border: none;
|
|
4193
|
-
box-shadow: inset 0 0 0 1px var(--border-inside, rgba(0, 0, 0, 0.16));
|
|
4194
|
-
padding: calc(1.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
4194
|
+
box-shadow: inset 0 0 0 1px var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
|
|
4195
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4195
4196
|
outline: none;
|
|
4196
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4197
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4197
4198
|
font-family: var(--font-family);
|
|
4198
|
-
color: var(--foreground, #161616);
|
|
4199
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4199
4200
|
}
|
|
4200
4201
|
|
|
4201
4202
|
.spg-input::placeholder {
|
|
4202
|
-
color: var(--foreground-light, #909090);
|
|
4203
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4203
4204
|
}
|
|
4204
4205
|
|
|
4205
4206
|
.spg-input:focus,
|
|
4206
4207
|
.spg-input.spg-dropdown:focus,
|
|
4207
4208
|
.spg-input.spg-dropdown:focus-within,
|
|
4208
4209
|
.spg-input-container:focus-within {
|
|
4209
|
-
box-shadow: inset 0 0 0 2px var(--primary, #19b394);
|
|
4210
|
+
box-shadow: inset 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4210
4211
|
}
|
|
4211
4212
|
|
|
4212
4213
|
.spg-input:disabled,
|
|
4213
4214
|
.spg-input:disabled::placeholder {
|
|
4214
|
-
color: var(--foreground, #161616);
|
|
4215
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4215
4216
|
opacity: 0.25;
|
|
4216
4217
|
}
|
|
4217
4218
|
|
|
4218
4219
|
.spg-input[type=color] {
|
|
4219
4220
|
padding-left: 0;
|
|
4220
4221
|
padding-right: 0;
|
|
4221
|
-
min-width: calc(8 * var(--base-unit, 8px));
|
|
4222
|
+
min-width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4222
4223
|
}
|
|
4223
4224
|
|
|
4224
4225
|
.spg-input__edit-button {
|
|
4225
4226
|
position: relative;
|
|
4226
4227
|
box-sizing: border-box;
|
|
4227
4228
|
appearance: none;
|
|
4228
|
-
background: var(--background, #fff);
|
|
4229
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4229
4230
|
border: none;
|
|
4230
4231
|
outline: none;
|
|
4231
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
4232
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
4233
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
4232
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4233
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4234
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4234
4235
|
line-height: 0;
|
|
4235
4236
|
}
|
|
4236
4237
|
.spg-input__edit-button:hover {
|
|
4237
|
-
background: var(--background-dim, #f3f3f3);
|
|
4238
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4238
4239
|
}
|
|
4239
4240
|
.spg-input__edit-button:active {
|
|
4240
4241
|
opacity: 0.5;
|
|
4241
4242
|
}
|
|
4242
4243
|
.spg-input__edit-button:disabled {
|
|
4243
4244
|
opacity: 0.25;
|
|
4244
|
-
background: var(--background, #fff);
|
|
4245
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4245
4246
|
}
|
|
4246
4247
|
.spg-input__edit-button svg {
|
|
4247
4248
|
height: 24px;
|
|
@@ -4250,55 +4251,59 @@ button.spg-action-button--large {
|
|
|
4250
4251
|
}
|
|
4251
4252
|
|
|
4252
4253
|
.spg-input.spg-input--error {
|
|
4253
|
-
box-shadow: 0 0 0 1px inset var(--red, #e60a3e);
|
|
4254
|
+
box-shadow: 0 0 0 1px inset var(--sjs-special-red, var(--red, #e60a3e));
|
|
4254
4255
|
}
|
|
4255
4256
|
|
|
4256
4257
|
.spg-input-container {
|
|
4257
4258
|
display: flex;
|
|
4258
4259
|
justify-content: space-between;
|
|
4259
4260
|
cursor: default;
|
|
4260
|
-
padding: calc(0.5 * var(--base-unit, 8px));
|
|
4261
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4261
4262
|
align-items: center;
|
|
4262
|
-
gap: calc(0.5 * var(--base-unit, 8px));
|
|
4263
|
-
box-shadow: 0 0 0 1px inset var(--border-inside, rgba(0, 0, 0, 0.16));
|
|
4263
|
+
gap: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4264
|
+
box-shadow: 0 0 0 1px inset var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
|
|
4264
4265
|
}
|
|
4265
4266
|
|
|
4266
4267
|
.spg-input-container__input {
|
|
4267
4268
|
flex-grow: 1;
|
|
4268
4269
|
width: 100%;
|
|
4269
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
4270
|
-
color: var(--foreground, #161616);
|
|
4271
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4270
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4271
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4272
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4272
4273
|
font-family: var(--font-family);
|
|
4273
4274
|
outline: none;
|
|
4274
4275
|
border: none;
|
|
4275
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4276
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4276
4277
|
background-color: transparent;
|
|
4277
4278
|
}
|
|
4278
4279
|
|
|
4279
4280
|
.spg-input-container__buttons-container {
|
|
4280
4281
|
display: flex;
|
|
4281
|
-
gap: calc(0.5 * var(--base-unit, 8px));
|
|
4282
|
+
gap: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4282
4283
|
}
|
|
4283
4284
|
|
|
4284
4285
|
.spg-dropdown {
|
|
4285
4286
|
border-radius: 0;
|
|
4286
4287
|
display: flex;
|
|
4287
|
-
padding-right: calc(5.5 * var(--base-unit, 8px));
|
|
4288
|
+
padding-right: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4288
4289
|
line-height: normal;
|
|
4289
|
-
background-position: right calc(1.625 * var(--base-unit, 8px)) top 50%, 0 0;
|
|
4290
|
+
background-position: right calc(1.625 * var(--sjs-base-unit, var(--base-unit, 8px))) top 50%, 0 0;
|
|
4290
4291
|
}
|
|
4291
4292
|
|
|
4292
4293
|
.spg-dropdown__filter-string-input {
|
|
4293
4294
|
line-height: unset;
|
|
4294
4295
|
}
|
|
4295
4296
|
|
|
4297
|
+
.spg-dropdown_chevron-button {
|
|
4298
|
+
line-height: normal;
|
|
4299
|
+
}
|
|
4300
|
+
|
|
4296
4301
|
.spg-comment {
|
|
4297
|
-
height: calc(9 * var(--base-unit, 8px));
|
|
4302
|
+
height: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4298
4303
|
max-width: 100%;
|
|
4299
|
-
min-width: calc(6 * var(--base-unit, 8px));
|
|
4300
|
-
min-height: calc(6 * var(--base-unit, 8px));
|
|
4301
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4304
|
+
min-width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4305
|
+
min-height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4306
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4302
4307
|
}
|
|
4303
4308
|
|
|
4304
4309
|
.spg-panel__title {
|
|
@@ -4307,34 +4312,34 @@ button.spg-action-button--large {
|
|
|
4307
4312
|
appearance: none;
|
|
4308
4313
|
box-sizing: border-box;
|
|
4309
4314
|
width: 100%;
|
|
4310
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
4315
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4311
4316
|
border: none;
|
|
4312
4317
|
outline: none;
|
|
4313
|
-
color: var(--foreground-light, #909090);
|
|
4318
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4314
4319
|
cursor: pointer;
|
|
4315
4320
|
text-align: left;
|
|
4316
|
-
background-color: var(--background, #fff);
|
|
4317
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
4321
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4322
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4318
4323
|
font-family: var(--font-family);
|
|
4319
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4324
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4320
4325
|
font-weight: 400;
|
|
4321
4326
|
margin: 0;
|
|
4322
4327
|
}
|
|
4323
4328
|
|
|
4324
4329
|
.spg-panel__title:disabled,
|
|
4325
4330
|
.spg-panel__title:disabled:hover {
|
|
4326
|
-
color: var(--foreground, #161616);
|
|
4331
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4327
4332
|
opacity: 0.25;
|
|
4328
4333
|
cursor: default;
|
|
4329
4334
|
}
|
|
4330
4335
|
|
|
4331
4336
|
.spg-panel__title--expandable:not(.spg-panel__title[aria-expanded=true]):hover, .spg-panel__title--expandable:not(.spg-panel__title[aria-expanded=true]):focus {
|
|
4332
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
4337
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4333
4338
|
}
|
|
4334
4339
|
|
|
4335
4340
|
.spg-panel__title[aria-expanded=true],
|
|
4336
4341
|
.spg-panel__title--expanded {
|
|
4337
|
-
color: var(--foreground, #161616);
|
|
4342
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4338
4343
|
font-weight: 600;
|
|
4339
4344
|
}
|
|
4340
4345
|
|
|
@@ -4343,27 +4348,27 @@ button.spg-action-button--large {
|
|
|
4343
4348
|
flex-direction: column;
|
|
4344
4349
|
align-items: flex-start;
|
|
4345
4350
|
width: 100%;
|
|
4346
|
-
padding: 0 calc(4 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px));
|
|
4351
|
+
padding: 0 calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4347
4352
|
box-sizing: border-box;
|
|
4348
|
-
background: var(--background-dim, #f3f3f3);
|
|
4349
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
4353
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4354
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4350
4355
|
}
|
|
4351
4356
|
|
|
4352
4357
|
.spg-panel__content .spg-row {
|
|
4353
4358
|
width: 100%;
|
|
4354
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
4359
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4355
4360
|
}
|
|
4356
4361
|
.spg-panel__content .spg-row--multiple {
|
|
4357
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4362
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4358
4363
|
}
|
|
4359
4364
|
|
|
4360
4365
|
.sv-mobile-side-bar .spg-panel__content {
|
|
4361
|
-
padding: 0 calc(2 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px));
|
|
4366
|
+
padding: 0 calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4362
4367
|
}
|
|
4363
4368
|
|
|
4364
4369
|
.spg-checkbox {
|
|
4365
4370
|
cursor: pointer;
|
|
4366
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
4371
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4367
4372
|
}
|
|
4368
4373
|
|
|
4369
4374
|
.spg-checkbox--disabled {
|
|
@@ -4373,36 +4378,36 @@ button.spg-action-button--large {
|
|
|
4373
4378
|
cursor: default;
|
|
4374
4379
|
}
|
|
4375
4380
|
.spg-checkbox--disabled .spg-checkbox__caption {
|
|
4376
|
-
color: var(--foreground-light, #909090);
|
|
4381
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4377
4382
|
}
|
|
4378
4383
|
|
|
4379
4384
|
.spg-checkbox__caption {
|
|
4380
4385
|
font-family: var(--font-family);
|
|
4381
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4382
|
-
color: var(--foreground, #161616);
|
|
4383
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4386
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4387
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4388
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4384
4389
|
}
|
|
4385
4390
|
|
|
4386
4391
|
.spg-checkbox__rectangle {
|
|
4387
|
-
background: var(--background, #fff);
|
|
4388
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
4392
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4393
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4389
4394
|
box-sizing: border-box;
|
|
4390
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4391
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4395
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4396
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4392
4397
|
flex-shrink: 0;
|
|
4393
4398
|
padding: 1px 1px;
|
|
4394
4399
|
}
|
|
4395
4400
|
|
|
4396
4401
|
.spg-checkbox:hover .spg-checkbox__rectangle {
|
|
4397
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
4402
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4398
4403
|
}
|
|
4399
4404
|
|
|
4400
4405
|
.spg-checkbox--disabled .spg-checkbox__rectangle:hover {
|
|
4401
|
-
background: var(--background, #fff);
|
|
4406
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4402
4407
|
}
|
|
4403
4408
|
|
|
4404
4409
|
.spg-checkbox__control:focus + .spg-checkbox__rectangle {
|
|
4405
|
-
outline: 2px solid var(--primary, #19b394);
|
|
4410
|
+
outline: 2px solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4406
4411
|
outline-offset: -2px;
|
|
4407
4412
|
}
|
|
4408
4413
|
|
|
@@ -4412,15 +4417,15 @@ button.spg-action-button--large {
|
|
|
4412
4417
|
|
|
4413
4418
|
.spg-checkbox--checked .spg-checkbox__svg {
|
|
4414
4419
|
display: block;
|
|
4415
|
-
width: calc(2.5 * var(--base-unit, 8px));
|
|
4416
|
-
height: calc(2.5 * var(--base-unit, 8px));
|
|
4420
|
+
width: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4421
|
+
height: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4417
4422
|
background-repeat: no-repeat;
|
|
4418
|
-
background-size: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
4419
|
-
fill: var(--primary, #19b394);
|
|
4423
|
+
background-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4424
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4420
4425
|
}
|
|
4421
4426
|
|
|
4422
4427
|
.spg-checkbox--disabled.spg-checkbox--checked .spg-checkbox__svg {
|
|
4423
|
-
fill: var(--border, #d6d6d6);
|
|
4428
|
+
fill: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4424
4429
|
}
|
|
4425
4430
|
|
|
4426
4431
|
.spg-checkbox__control {
|
|
@@ -4445,30 +4450,30 @@ button.spg-action-button--large {
|
|
|
4445
4450
|
.spg-selectbase__label {
|
|
4446
4451
|
display: flex;
|
|
4447
4452
|
align-items: flex-start;
|
|
4448
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
4453
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4449
4454
|
}
|
|
4450
4455
|
|
|
4451
4456
|
.spg-matrixdynamic__drag-element {
|
|
4452
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
4457
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4453
4458
|
}
|
|
4454
4459
|
.spg-matrixdynamic__drag-element:hover {
|
|
4455
|
-
background-color: var(--background, #fff);
|
|
4460
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4456
4461
|
}
|
|
4457
4462
|
.spg-matrixdynamic__drag-element:after {
|
|
4458
4463
|
content: " ";
|
|
4459
4464
|
display: block;
|
|
4460
|
-
height: calc(0.5 * var(--base-unit, 8px));
|
|
4465
|
+
height: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4461
4466
|
}
|
|
4462
4467
|
|
|
4463
4468
|
.spg-drag-element__svg {
|
|
4464
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4465
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4466
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
4469
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4470
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4471
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4467
4472
|
display: block;
|
|
4468
4473
|
opacity: 0.5;
|
|
4469
4474
|
}
|
|
4470
4475
|
.spg-drag-element__svg use {
|
|
4471
|
-
fill: var(--foreground-light, #909090);
|
|
4476
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4472
4477
|
}
|
|
4473
4478
|
|
|
4474
4479
|
.spg-matrixdynamic__drag-drop-ghost-position-top,
|
|
@@ -4480,8 +4485,8 @@ button.spg-action-button--large {
|
|
|
4480
4485
|
.spg-matrixdynamic__drag-drop-ghost-position-bottom::after {
|
|
4481
4486
|
content: "";
|
|
4482
4487
|
width: 100%;
|
|
4483
|
-
height: calc(0.5 * var(--base-unit, 8px));
|
|
4484
|
-
background-color: var(--secondary, #ff9814);
|
|
4488
|
+
height: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4489
|
+
background-color: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
4485
4490
|
position: absolute;
|
|
4486
4491
|
left: 0;
|
|
4487
4492
|
}
|
|
@@ -4495,13 +4500,13 @@ button.spg-action-button--large {
|
|
|
4495
4500
|
}
|
|
4496
4501
|
|
|
4497
4502
|
.spg-matrixdynamic__placeholder {
|
|
4498
|
-
padding: calc(6 * var(--base-unit, 8px)) 0;
|
|
4503
|
+
padding: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4499
4504
|
display: flex;
|
|
4500
4505
|
flex-direction: column;
|
|
4501
4506
|
justify-content: center;
|
|
4502
4507
|
align-items: center;
|
|
4503
|
-
background: var(--background, #fff);
|
|
4504
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
4508
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4509
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4505
4510
|
box-sizing: border-box;
|
|
4506
4511
|
}
|
|
4507
4512
|
.spg-matrixdynamic__placeholder .spg-matrixdynamic__add-btn {
|
|
@@ -4509,64 +4514,64 @@ button.spg-action-button--large {
|
|
|
4509
4514
|
}
|
|
4510
4515
|
|
|
4511
4516
|
.spg-matrixdynamic__placeholder-text {
|
|
4512
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4513
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4514
|
-
color: var(--foreground-light, #909090);
|
|
4517
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4518
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4519
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4515
4520
|
}
|
|
4516
4521
|
|
|
4517
4522
|
.spg-matrixdynamic__add-btn {
|
|
4518
4523
|
display: none;
|
|
4519
4524
|
appearance: none;
|
|
4520
4525
|
border: none;
|
|
4521
|
-
margin-top: calc(0.5 * var(--base-unit, 8px));
|
|
4526
|
+
margin-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4522
4527
|
background: transparent;
|
|
4523
|
-
color: var(--primary, #19b394);
|
|
4528
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4524
4529
|
font-family: var(--font-family);
|
|
4525
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4530
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4526
4531
|
font-weight: 600;
|
|
4527
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4532
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4528
4533
|
}
|
|
4529
4534
|
|
|
4530
4535
|
.spg-smiley-icon {
|
|
4531
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4532
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4533
|
-
margin: calc(1 * var(--base-unit, 8px));
|
|
4536
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4537
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4538
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4534
4539
|
border-radius: 100px;
|
|
4535
|
-
border: 1px solid var(--foreground, #161616);
|
|
4540
|
+
border: 1px solid var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4536
4541
|
display: flex;
|
|
4537
4542
|
justify-content: center;
|
|
4538
4543
|
align-items: center;
|
|
4539
|
-
margin-right: calc(4 * var(--base-unit, 8px));
|
|
4544
|
+
margin-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4540
4545
|
}
|
|
4541
4546
|
.spg-smiley-icon svg {
|
|
4542
|
-
width: calc(1.5 * var(--base-unit, 8px));
|
|
4543
|
-
height: calc(1.5 * var(--base-unit, 8px));
|
|
4544
|
-
fill: var(--foreground, #161616);
|
|
4547
|
+
width: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4548
|
+
height: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4549
|
+
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4545
4550
|
}
|
|
4546
4551
|
|
|
4547
4552
|
.spg-table-wrapper {
|
|
4548
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
4553
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4549
4554
|
border-bottom: none;
|
|
4550
4555
|
}
|
|
4551
4556
|
|
|
4552
4557
|
.spg-table {
|
|
4553
4558
|
width: 100%;
|
|
4554
|
-
background-color: var(--background, #fff);
|
|
4559
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4555
4560
|
border-collapse: collapse;
|
|
4556
4561
|
}
|
|
4557
4562
|
.spg-table tr {
|
|
4558
|
-
border-bottom: 1px solid var(--border, #d6d6d6);
|
|
4563
|
+
border-bottom: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4559
4564
|
}
|
|
4560
4565
|
|
|
4561
4566
|
.spg-table__cell {
|
|
4562
4567
|
padding: 0;
|
|
4563
4568
|
}
|
|
4564
4569
|
.spg-table__cell .spg-checkbox {
|
|
4565
|
-
margin: 0 calc(2 * var(--base-unit, 8px));
|
|
4570
|
+
margin: 0 calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4566
4571
|
}
|
|
4567
4572
|
|
|
4568
4573
|
.spg-table__cell--detail-panel {
|
|
4569
|
-
background: var(--background-dim, #f3f3f3);
|
|
4574
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4570
4575
|
}
|
|
4571
4576
|
.spg-table__cell--detail-panel .spg-panel__content {
|
|
4572
4577
|
box-shadow: none;
|
|
@@ -4578,35 +4583,40 @@ button.spg-action-button--large {
|
|
|
4578
4583
|
|
|
4579
4584
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-input {
|
|
4580
4585
|
appearance: none;
|
|
4581
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4582
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4586
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4587
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4583
4588
|
box-shadow: none;
|
|
4584
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
4589
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4585
4590
|
background-color: transparent;
|
|
4586
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
4591
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4587
4592
|
height: auto;
|
|
4588
4593
|
}
|
|
4589
4594
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-input[type=color] {
|
|
4590
4595
|
padding-right: 0;
|
|
4591
4596
|
}
|
|
4592
4597
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-input:focus, .spg-table__cell:not(.spg-table__cell--detail-panel) .spg-input:focus-within {
|
|
4593
|
-
box-shadow: inset 0 0 0 2px var(--primary, #19b394);
|
|
4598
|
+
box-shadow: inset 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4599
|
+
}
|
|
4600
|
+
|
|
4601
|
+
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-dropdown_chevron-button {
|
|
4602
|
+
display: none;
|
|
4594
4603
|
}
|
|
4595
4604
|
|
|
4596
4605
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-dropdown {
|
|
4597
4606
|
width: max-content;
|
|
4598
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
4599
|
-
background-size: calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
4600
|
-
background-position: right calc(0.5 * var(--base-unit, 8px)) top 50%, 0 0;
|
|
4607
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4608
|
+
background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4609
|
+
background-position: right calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) top 50%, 0 0;
|
|
4601
4610
|
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 15L17 10H7L12 15Z' fill='%2390909080'/%3E%3C/svg%3E%0A");
|
|
4611
|
+
background-repeat: no-repeat;
|
|
4602
4612
|
}
|
|
4603
4613
|
|
|
4604
4614
|
.spg-table__cell:not(.spg-table__cell--detail-panel):first-of-type .spg-text {
|
|
4605
|
-
padding-left: calc(2 * var(--base-unit, 8px));
|
|
4615
|
+
padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4606
4616
|
}
|
|
4607
4617
|
|
|
4608
4618
|
.spg-table__cell--actions:first-of-type {
|
|
4609
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
4619
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4610
4620
|
}
|
|
4611
4621
|
|
|
4612
4622
|
.spg-table__cell--actions:last-of-type .spg-action-bar {
|
|
@@ -4615,16 +4625,16 @@ button.spg-action-button--large {
|
|
|
4615
4625
|
|
|
4616
4626
|
.spg-table__cell--actions > .spg-matrixdynamic__drag-element {
|
|
4617
4627
|
display: inline-block;
|
|
4618
|
-
margin-top: calc(0.5 * var(--base-unit, 8px));
|
|
4628
|
+
margin-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4619
4629
|
cursor: move;
|
|
4620
4630
|
}
|
|
4621
4631
|
|
|
4622
4632
|
.spg-table__cell--header {
|
|
4623
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
4633
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4624
4634
|
font-weight: normal;
|
|
4625
|
-
color: var(--foreground-light, #909090);
|
|
4626
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4627
|
-
background: var(--background-dim, #f3f3f3);
|
|
4635
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4636
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4637
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4628
4638
|
text-align: left;
|
|
4629
4639
|
white-space: nowrap;
|
|
4630
4640
|
text-overflow: ellipsis;
|
|
@@ -4633,14 +4643,14 @@ button.spg-action-button--large {
|
|
|
4633
4643
|
}
|
|
4634
4644
|
|
|
4635
4645
|
.spg-table__question-wrapper {
|
|
4636
|
-
padding: calc(0.5 * var(--base-unit, 8px)) 0;
|
|
4646
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4637
4647
|
}
|
|
4638
4648
|
|
|
4639
4649
|
.spg-question-group .spg-row {
|
|
4640
4650
|
margin-top: 0;
|
|
4641
4651
|
}
|
|
4642
4652
|
.spg-question-group .spg-row:not(:first-of-type) {
|
|
4643
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4653
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4644
4654
|
}
|
|
4645
4655
|
|
|
4646
4656
|
.spg-color-editor__color-input {
|
|
@@ -4657,7 +4667,7 @@ button.spg-action-button--large {
|
|
|
4657
4667
|
|
|
4658
4668
|
.spg-color-editor__color-item {
|
|
4659
4669
|
display: flex;
|
|
4660
|
-
gap: calc(2 * var(--base-unit, 8px));
|
|
4670
|
+
gap: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4661
4671
|
}
|
|
4662
4672
|
.spg-color-editor__color-item .spg-color-editor__color-swatch {
|
|
4663
4673
|
margin-left: 0;
|
|
@@ -4668,24 +4678,24 @@ button.spg-action-button--large {
|
|
|
4668
4678
|
flex-shrink: 0;
|
|
4669
4679
|
flex-grow: 0;
|
|
4670
4680
|
border-radius: 3px;
|
|
4671
|
-
width: calc(4 * var(--base-unit, 8px));
|
|
4672
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4681
|
+
width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4682
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4673
4683
|
box-sizing: border-box;
|
|
4674
4684
|
border: 1px solid rgba(0, 0, 0, 0.16);
|
|
4675
|
-
margin-left: calc(1.5 * var(--base-unit, 8px));
|
|
4685
|
+
margin-left: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4676
4686
|
}
|
|
4677
4687
|
.spg-color-editor__color-swatch .sv-svg-icon {
|
|
4678
4688
|
position: absolute;
|
|
4679
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
4680
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
4689
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4690
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4681
4691
|
left: 50%;
|
|
4682
4692
|
top: 50%;
|
|
4683
4693
|
transform: translate(-50%, -50%);
|
|
4684
|
-
fill: var(--background, #fff);
|
|
4694
|
+
fill: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4685
4695
|
}
|
|
4686
4696
|
|
|
4687
4697
|
.spg-color-editor .spg-input__edit-button + * {
|
|
4688
|
-
margin-inline-end: calc(-0.5 * var(--base-unit, 8px));
|
|
4698
|
+
margin-inline-end: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4689
4699
|
}
|
|
4690
4700
|
|
|
4691
4701
|
.spg-file-edit__choose-button {
|
|
@@ -4699,10 +4709,10 @@ button.spg-action-button--large {
|
|
|
4699
4709
|
.spg-theme-builder-root .spg-paneldynamic__separator {
|
|
4700
4710
|
border: none;
|
|
4701
4711
|
margin: 0;
|
|
4702
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
4712
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4703
4713
|
}
|
|
4704
4714
|
.spg-theme-builder-root .spg-panel__footer {
|
|
4705
|
-
margin: calc(1 * var(--base-unit, 8px)) auto 0;
|
|
4715
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) auto 0;
|
|
4706
4716
|
}
|
|
4707
4717
|
.spg-theme-builder-root .spg-paneldynamic__add-btn {
|
|
4708
4718
|
margin: 0 auto;
|
|
@@ -4715,13 +4725,13 @@ button.spg-action-button--large {
|
|
|
4715
4725
|
}
|
|
4716
4726
|
.spg-theme-builder-root .spg-row--multiple > div {
|
|
4717
4727
|
flex: 1 1 0;
|
|
4718
|
-
min-width: calc(12.5 * var(--base-unit, 8px));
|
|
4728
|
+
min-width: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4719
4729
|
}
|
|
4720
4730
|
.spg-theme-builder-root .spg-row--multiple > div input {
|
|
4721
4731
|
min-width: 0;
|
|
4722
4732
|
}
|
|
4723
4733
|
.spg-theme-builder-root .spg-row--multiple > div .spg-question--location--left {
|
|
4724
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4734
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4725
4735
|
box-sizing: border-box;
|
|
4726
4736
|
}
|
|
4727
4737
|
.spg-theme-builder-root .spg-row--multiple > div .spg-question--location--left .spg-input {
|
|
@@ -4741,23 +4751,23 @@ button.spg-action-button--large {
|
|
|
4741
4751
|
}
|
|
4742
4752
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content {
|
|
4743
4753
|
padding: 0;
|
|
4744
|
-
padding-bottom: calc(5 * var(--base-unit, 8px));
|
|
4754
|
+
padding-bottom: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4745
4755
|
box-shadow: none;
|
|
4746
4756
|
}
|
|
4747
4757
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content .spg-panel__title {
|
|
4748
4758
|
background-color: transparent;
|
|
4749
4759
|
box-shadow: none;
|
|
4750
|
-
padding: calc(1 * var(--base-unit, 8px)) 0;
|
|
4760
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4751
4761
|
}
|
|
4752
4762
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content::after {
|
|
4753
4763
|
content: " ";
|
|
4754
4764
|
display: block;
|
|
4755
4765
|
position: relative;
|
|
4756
|
-
left: calc(-4 * var(--base-unit, 8px));
|
|
4757
|
-
top: calc(5 * var(--base-unit, 8px));
|
|
4758
|
-
width: calc(8 * var(--base-unit, 8px) + 100%);
|
|
4766
|
+
left: calc(-4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4767
|
+
top: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4768
|
+
width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)) + 100%);
|
|
4759
4769
|
height: 1px;
|
|
4760
|
-
background-color: var(--border, #d6d6d6);
|
|
4770
|
+
background-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4761
4771
|
}
|
|
4762
4772
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content > .spg-row:first-of-type {
|
|
4763
4773
|
margin-top: 0;
|
|
@@ -4769,7 +4779,7 @@ button.spg-action-button--large {
|
|
|
4769
4779
|
content: none;
|
|
4770
4780
|
}
|
|
4771
4781
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content .spg-panel__content .spg-row {
|
|
4772
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4782
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4773
4783
|
}
|
|
4774
4784
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content .spg-panel__content .spg-row:first-of-type {
|
|
4775
4785
|
margin-top: 0;
|
|
@@ -4801,12 +4811,12 @@ button.spg-action-button--large {
|
|
|
4801
4811
|
|
|
4802
4812
|
.spg-root-modern {
|
|
4803
4813
|
width: 100%;
|
|
4804
|
-
border-right: 1px solid var(--border, #d6d6d6);
|
|
4814
|
+
border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4805
4815
|
box-sizing: border-box;
|
|
4806
4816
|
}
|
|
4807
4817
|
|
|
4808
4818
|
.sv-popup--modal {
|
|
4809
|
-
padding: calc(4 * var(--base-unit, 8px));
|
|
4819
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4810
4820
|
}
|
|
4811
4821
|
.sv-popup--modal.sv-property-editor .sv-popup__container .sv-popup_shadow {
|
|
4812
4822
|
background-color: transparent;
|
|
@@ -4823,7 +4833,7 @@ button.spg-action-button--large {
|
|
|
4823
4833
|
}
|
|
4824
4834
|
.sv-popup--modal .sd-body,
|
|
4825
4835
|
.sv-popup--modal .sl-body {
|
|
4826
|
-
min-width: calc(78 * var(--base-unit, 8px));
|
|
4836
|
+
min-width: calc(78 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4827
4837
|
}
|
|
4828
4838
|
|
|
4829
4839
|
.sv-popup.sv-property-editor .sd-root-modern {
|
|
@@ -4831,8 +4841,8 @@ button.spg-action-button--large {
|
|
|
4831
4841
|
}
|
|
4832
4842
|
|
|
4833
4843
|
.svc-object-selector .sv-popup__container {
|
|
4834
|
-
margin-left: calc(1 * var(--base-unit, 8px));
|
|
4835
|
-
margin-right: calc(1 * var(--base-unit, 8px));
|
|
4844
|
+
margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4845
|
+
margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4836
4846
|
}
|
|
4837
4847
|
|
|
4838
4848
|
.svc-object-selector__content {
|
|
@@ -4844,8 +4854,8 @@ button.spg-action-button--large {
|
|
|
4844
4854
|
}
|
|
4845
4855
|
|
|
4846
4856
|
.spg-title .spg-action-bar {
|
|
4847
|
-
margin-top: calc(-1 * var(--base-unit, 8px));
|
|
4848
|
-
margin-bottom: calc(-1 * var(--base-unit, 8px));
|
|
4857
|
+
margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4858
|
+
margin-bottom: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4849
4859
|
margin-right: 1px;
|
|
4850
4860
|
}
|
|
4851
4861
|
|
|
@@ -4854,23 +4864,23 @@ button.spg-action-button--large {
|
|
|
4854
4864
|
}
|
|
4855
4865
|
|
|
4856
4866
|
.spg-body--empty {
|
|
4857
|
-
margin: calc(3 * var(--base-unit, 8px));
|
|
4867
|
+
margin: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4858
4868
|
}
|
|
4859
4869
|
.svc-text {
|
|
4860
4870
|
font-family: var(--font-family);
|
|
4861
4871
|
font-style: normal;
|
|
4862
4872
|
font-weight: normal;
|
|
4863
|
-
color: var(--foreground, #161616);
|
|
4873
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4864
4874
|
}
|
|
4865
4875
|
|
|
4866
4876
|
.svc-text--normal {
|
|
4867
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4868
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4877
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4878
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4869
4879
|
}
|
|
4870
4880
|
|
|
4871
4881
|
.svc-text--small {
|
|
4872
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
4873
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
4882
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4883
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4874
4884
|
}
|
|
4875
4885
|
|
|
4876
4886
|
.svc-text--bold {
|
|
@@ -4883,7 +4893,7 @@ button.spg-action-button--large {
|
|
|
4883
4893
|
.svc-flex-row {
|
|
4884
4894
|
display: flex;
|
|
4885
4895
|
flex-direction: row;
|
|
4886
|
-
background: var(--background-dim, #f3f3f3);
|
|
4896
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4887
4897
|
}
|
|
4888
4898
|
|
|
4889
4899
|
.svc-full-container {
|
|
@@ -4902,15 +4912,15 @@ button.spg-action-button--large {
|
|
|
4902
4912
|
}
|
|
4903
4913
|
|
|
4904
4914
|
.sv-action-bar--default-size-mode .sv-action-bar-separator {
|
|
4905
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
4915
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4906
4916
|
}
|
|
4907
4917
|
|
|
4908
4918
|
.sv-action-bar--small-size-mode .sv-action-bar-separator {
|
|
4909
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
4919
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4910
4920
|
}
|
|
4911
4921
|
|
|
4912
4922
|
.svc-creator--mobile .sv-action-bar-separator {
|
|
4913
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4923
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4914
4924
|
}
|
|
4915
4925
|
|
|
4916
4926
|
.sv-action-bar--small-size-mode .sv-action-bar-item {
|
|
@@ -4920,20 +4930,20 @@ button.spg-action-button--large {
|
|
|
4920
4930
|
|
|
4921
4931
|
.svc-top-bar {
|
|
4922
4932
|
display: flex;
|
|
4923
|
-
background: var(--background, #fff);
|
|
4933
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4924
4934
|
box-sizing: border-box;
|
|
4925
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
4935
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4926
4936
|
}
|
|
4927
4937
|
.svc-top-bar .svc-toolbar-wrapper {
|
|
4928
4938
|
flex: 0 0 auto;
|
|
4929
4939
|
display: flex;
|
|
4930
4940
|
}
|
|
4931
4941
|
.svc-top-bar .svc-toolbar-wrapper .sv-action-bar {
|
|
4932
|
-
padding: 0 calc(1 * var(--base-unit, 8px));
|
|
4942
|
+
padding: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4933
4943
|
justify-content: flex-end;
|
|
4934
4944
|
}
|
|
4935
4945
|
.svc-top-bar .svc-toolbar-wrapper .sv-action .sv-action-bar-item {
|
|
4936
|
-
margin: 0 calc(1 * var(--base-unit, 8px));
|
|
4946
|
+
margin: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4937
4947
|
}
|
|
4938
4948
|
|
|
4939
4949
|
.svc-footer-bar .svc-toolbar-wrapper {
|
|
@@ -4941,15 +4951,15 @@ button.spg-action-button--large {
|
|
|
4941
4951
|
left: 0;
|
|
4942
4952
|
right: 0;
|
|
4943
4953
|
bottom: 0;
|
|
4944
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4954
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4945
4955
|
}
|
|
4946
4956
|
.svc-footer-bar .svc-toolbar-wrapper .sv-action-bar {
|
|
4947
4957
|
justify-content: center;
|
|
4948
4958
|
padding: 0;
|
|
4949
4959
|
width: 100%;
|
|
4950
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4951
|
-
background: var(--background, #fff);
|
|
4952
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
4960
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4961
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4962
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4953
4963
|
}
|
|
4954
4964
|
|
|
4955
4965
|
/*# sourceMappingURL=survey-creator-core.fontless.css.map*/
|