survey-creator-core 1.9.95 → 1.9.96
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 +875 -875
- package/survey-creator-core.fontless.css +874 -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 +81 -30
- 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/tabs/test.d.ts +2 -0
- package/typings/components/tabs/theme.d.ts +2 -1
- package/typings/custom-questions/question-color.d.ts +1 -0
|
@@ -1,39 +1,39 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* SurveyJS Creator v1.9.
|
|
2
|
+
* SurveyJS Creator v1.9.96
|
|
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
|
|
6
6
|
*/
|
|
7
7
|
.svc-context-container {
|
|
8
8
|
display: flex;
|
|
9
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
9
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
10
10
|
width: max-content;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
.svc-context-button {
|
|
14
14
|
display: block;
|
|
15
15
|
box-sizing: border-box;
|
|
16
|
-
background-color: var(--background, #fff);
|
|
16
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
17
17
|
border-radius: 50%;
|
|
18
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
19
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
18
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
19
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
20
20
|
cursor: pointer;
|
|
21
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
21
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
22
22
|
outline: none;
|
|
23
23
|
}
|
|
24
24
|
.svc-context-button use {
|
|
25
|
-
fill: var(--foreground-light, #909090);
|
|
25
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
26
26
|
}
|
|
27
27
|
|
|
28
28
|
.svc-context-button:hover use, .svc-context-button:focus use {
|
|
29
|
-
fill: var(--primary, #19b394);
|
|
29
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
.svc-context-button--danger:hover use, .svc-context-button--danger:focus use {
|
|
33
|
-
fill: var(--red, #e60a3e);
|
|
33
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
34
34
|
}
|
|
35
35
|
.svc-embed-tab__content {
|
|
36
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
36
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
37
37
|
font-family: var(--font-family);
|
|
38
38
|
}
|
|
39
39
|
.svc-embed-tab__content .spg-row {
|
|
@@ -41,13 +41,13 @@
|
|
|
41
41
|
}
|
|
42
42
|
.svc-embed-tab__content .spg-row .spg-question__content .spg-comment:disabled,
|
|
43
43
|
.svc-embed-tab__content .spg-row .spg-question__content .spg-comment:disabled::placeholder {
|
|
44
|
-
color: var(--foreground, #161616);
|
|
44
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
45
45
|
}
|
|
46
46
|
.svc-embed-tab__content .spg-question__description {
|
|
47
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
48
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
49
|
-
color: var(--foreground, #161616);
|
|
50
|
-
padding: calc(2 * var(--base-unit, 8px)) 0 calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
47
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
48
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
49
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
50
|
+
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)));
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
.sv-question-embed__title {
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
svc-tab-json-editor-ace {
|
|
62
62
|
width: 100%;
|
|
63
63
|
height: 100%;
|
|
64
|
-
background: var(--background-dim, #f3f3f3);
|
|
64
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
.svc-json-editor-tab__content {
|
|
@@ -75,7 +75,7 @@ svc-tab-json-editor-ace {
|
|
|
75
75
|
svc-tab-json-editor-textarea {
|
|
76
76
|
width: 100%;
|
|
77
77
|
height: 100%;
|
|
78
|
-
background: var(--background-dim, #f3f3f3);
|
|
78
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
.svc-json-editor-tab__content {
|
|
@@ -91,33 +91,33 @@ svc-tab-json-editor-textarea {
|
|
|
91
91
|
.svc-json-editor-tab__errros_button {
|
|
92
92
|
position: absolute;
|
|
93
93
|
top: 0%;
|
|
94
|
-
right: calc(0% + (2 * var(--base-unit, 8px)));
|
|
95
|
-
min-height: calc(2.5 * var(--base-unit, 8px));
|
|
96
|
-
max-height: calc(2.5 * var(--base-unit, 8px));
|
|
94
|
+
right: calc(0% + (2 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
95
|
+
min-height: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
96
|
+
max-height: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
97
97
|
border: none;
|
|
98
|
-
background-color: var(--primary, #19b394);
|
|
99
|
-
color: var(--primary-foreground, #fff);
|
|
98
|
+
background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
99
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
100
100
|
font-weight: bold;
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
.svc-json-editor-tab__content-errors {
|
|
104
104
|
position: absolute;
|
|
105
105
|
right: 0%;
|
|
106
|
-
top: calc(0% + (3 * var(--base-unit, 8px)));
|
|
107
|
-
max-width: calc(100% - (2 * var(--base-unit, 8px)));
|
|
108
|
-
padding: var(--base-unit, 8px);
|
|
109
|
-
background-color: var(--background, #fff);
|
|
106
|
+
top: calc(0% + (3 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
107
|
+
max-width: calc(100% - (2 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
108
|
+
padding: var(--sjs-base-unit, var(--base-unit, 8px));
|
|
109
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
110
110
|
background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.1));
|
|
111
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
111
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
112
112
|
border-radius: 1px;
|
|
113
|
-
color: var(--foreground, #161616);
|
|
113
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
114
114
|
font-family: monospace;
|
|
115
115
|
}
|
|
116
116
|
.svc-json-editor-tab__content-errors span {
|
|
117
117
|
white-space: pre-line;
|
|
118
118
|
}
|
|
119
119
|
.svc-json-editor-tab__content-errors span > b {
|
|
120
|
-
color: var(--red, #e60a3e);
|
|
120
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
121
121
|
}
|
|
122
122
|
|
|
123
123
|
.svc-json-editor-tab__content-errors:empty {
|
|
@@ -250,7 +250,7 @@ svc-tab-json-editor-textarea {
|
|
|
250
250
|
svc-tab-test {
|
|
251
251
|
width: 100%;
|
|
252
252
|
height: 100%;
|
|
253
|
-
background: var(--background-dim, #f3f3f3);
|
|
253
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
254
254
|
}
|
|
255
255
|
|
|
256
256
|
.svc-test-tab__content .svc-plugin-tab__content {
|
|
@@ -260,13 +260,13 @@ svc-tab-test {
|
|
|
260
260
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_completed_page {
|
|
261
261
|
margin: 0;
|
|
262
262
|
border: 0;
|
|
263
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
263
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
264
264
|
}
|
|
265
265
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_body {
|
|
266
266
|
border: 0;
|
|
267
267
|
}
|
|
268
268
|
.svc-test-tab__content .svc-plugin-tab__content .svc-preview__test-again {
|
|
269
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
269
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
270
270
|
margin-left: auto;
|
|
271
271
|
margin-right: auto;
|
|
272
272
|
margin-bottom: 72px;
|
|
@@ -274,7 +274,7 @@ svc-tab-test {
|
|
|
274
274
|
}
|
|
275
275
|
|
|
276
276
|
.svc-creator-tab__content--with-toolbar.svc-test-tab__content .svc-plugin-tab__content {
|
|
277
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
277
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
278
278
|
}
|
|
279
279
|
|
|
280
280
|
.svc-test-tab__content-actions {
|
|
@@ -282,9 +282,9 @@ svc-tab-test {
|
|
|
282
282
|
}
|
|
283
283
|
.svc-test-tab__content-actions .sv-action-bar {
|
|
284
284
|
padding: 0;
|
|
285
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
286
|
-
background: var(--background, #fff);
|
|
287
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
285
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
286
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
287
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
288
288
|
width: 100%;
|
|
289
289
|
position: absolute;
|
|
290
290
|
}
|
|
@@ -292,7 +292,7 @@ svc-tab-test {
|
|
|
292
292
|
left: 0;
|
|
293
293
|
right: 0;
|
|
294
294
|
justify-content: center;
|
|
295
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
295
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
296
296
|
}
|
|
297
297
|
.svc-test-tab__content-actions .sv-action-bar.sv-action-bar--pages .sv-action__content {
|
|
298
298
|
padding: 0;
|
|
@@ -301,13 +301,13 @@ svc-tab-test {
|
|
|
301
301
|
margin: 0;
|
|
302
302
|
}
|
|
303
303
|
.svc-test-tab__content-actions .sv-action-bar-item {
|
|
304
|
-
font-family: var(--font-family);
|
|
304
|
+
font-family: var(--font-family, var(--font-family));
|
|
305
305
|
font-style: normal;
|
|
306
306
|
font-weight: 600;
|
|
307
|
-
font-size: calc(
|
|
308
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
307
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
308
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
309
309
|
width: 100%;
|
|
310
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
310
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
311
311
|
}
|
|
312
312
|
.svc-test-tab__content-actions .svc-page-selector {
|
|
313
313
|
max-width: 50%;
|
|
@@ -316,7 +316,7 @@ svc-tab-test {
|
|
|
316
316
|
overflow: hidden;
|
|
317
317
|
white-space: nowrap;
|
|
318
318
|
text-overflow: ellipsis;
|
|
319
|
-
color: var(--foreground, #161616);
|
|
319
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
320
320
|
display: inline-block;
|
|
321
321
|
}
|
|
322
322
|
|
|
@@ -324,8 +324,8 @@ svc-tab-test {
|
|
|
324
324
|
font-family: var(--font-family);
|
|
325
325
|
font-style: normal;
|
|
326
326
|
font-weight: 400;
|
|
327
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
328
|
-
color: var(--foreground, #161616);
|
|
327
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
328
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
329
329
|
width: 100%;
|
|
330
330
|
position: absolute;
|
|
331
331
|
top: 50%;
|
|
@@ -343,36 +343,36 @@ svc-tab-test {
|
|
|
343
343
|
}
|
|
344
344
|
|
|
345
345
|
.sl-table__cell.st-table__cell--actions:first-of-type .sv-action-bar {
|
|
346
|
-
margin-top: calc(-0.5 * var(--base-unit, 8px));
|
|
347
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
346
|
+
margin-top: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
347
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
348
348
|
}
|
|
349
349
|
|
|
350
350
|
.sl-table .sl-table__detail-button.sl-table__detail-button {
|
|
351
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
352
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
351
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
352
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
353
353
|
box-sizing: border-box;
|
|
354
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
354
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
355
355
|
padding: 0;
|
|
356
356
|
}
|
|
357
357
|
.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 {
|
|
358
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
358
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
359
359
|
outline: none;
|
|
360
360
|
}
|
|
361
361
|
.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 {
|
|
362
|
-
fill: var(--primary, #19b394);
|
|
362
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
363
363
|
}
|
|
364
364
|
|
|
365
365
|
.sl-table__remove-button .sv-action-bar-item {
|
|
366
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
367
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
366
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
367
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
368
368
|
cursor: pointer;
|
|
369
369
|
}
|
|
370
370
|
.sl-table__remove-button .sv-action-bar-item:hover:enabled, .sl-table__remove-button .sv-action-bar-item.sv-focused--by-key {
|
|
371
|
-
background-color: var(--red-light, rgba(
|
|
371
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
372
372
|
outline: none;
|
|
373
373
|
}
|
|
374
374
|
.sl-table__remove-button .sv-action-bar-item:hover:enabled use, .sl-table__remove-button .sv-action-bar-item.sv-focused--by-key use {
|
|
375
|
-
fill: var(--red, #e60a3e);
|
|
375
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
376
376
|
}
|
|
377
377
|
|
|
378
378
|
.sl-table__cell .sv-action-bar-item__icon {
|
|
@@ -386,15 +386,15 @@ svc-tab-test {
|
|
|
386
386
|
|
|
387
387
|
.sl-table__row #remove-row .sv-action-bar-item {
|
|
388
388
|
border: none;
|
|
389
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
390
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
389
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
390
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
391
391
|
}
|
|
392
392
|
.sl-table__row #remove-row .sv-action-bar-item__icon use {
|
|
393
|
-
fill: var(--red, #e60a3e);
|
|
393
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
394
394
|
}
|
|
395
395
|
|
|
396
396
|
.sl-table__row.sl-table__row--additional .sl-table__cell .svc-action-button {
|
|
397
|
-
color: var(--secondary, #ff9814);
|
|
397
|
+
color: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
398
398
|
}
|
|
399
399
|
|
|
400
400
|
.sl-table__cell .svc-action-button,
|
|
@@ -405,14 +405,14 @@ svc-tab-test {
|
|
|
405
405
|
font-family: var(--font-family);
|
|
406
406
|
font-style: normal;
|
|
407
407
|
font-weight: bold;
|
|
408
|
-
font-size: calc(3 * var(--base-unit, 8px));
|
|
409
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
408
|
+
font-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
409
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
410
410
|
background: transparent;
|
|
411
|
-
color: var(--foreground, #161616);
|
|
411
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
412
412
|
outline: none;
|
|
413
413
|
border: none;
|
|
414
414
|
box-shadow: none;
|
|
415
|
-
max-height: calc(13.5 * var(--base-unit, 8px));
|
|
415
|
+
max-height: calc(13.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
416
416
|
overflow: hidden;
|
|
417
417
|
display: -webkit-box;
|
|
418
418
|
-webkit-line-clamp: 3;
|
|
@@ -420,12 +420,12 @@ svc-tab-test {
|
|
|
420
420
|
}
|
|
421
421
|
|
|
422
422
|
.sl-table__cell {
|
|
423
|
-
color: var(--foreground, #161616);
|
|
423
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
424
424
|
font-weight: bold;
|
|
425
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
425
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
426
426
|
font-family: var(--font-family);
|
|
427
427
|
vertical-align: top;
|
|
428
|
-
padding: calc(2 * var(--base-unit, 8px)) 0;
|
|
428
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
429
429
|
width: 100%;
|
|
430
430
|
}
|
|
431
431
|
|
|
@@ -464,14 +464,14 @@ svc-tab-test {
|
|
|
464
464
|
text-align: left;
|
|
465
465
|
}
|
|
466
466
|
.sl-table tbody tr:last-of-type .sl-table__cell {
|
|
467
|
-
padding-bottom: calc(10 * var(--base-unit, 8px));
|
|
467
|
+
padding-bottom: calc(10 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
468
468
|
}
|
|
469
469
|
.sl-table tr:first-of-type .sl-table__cell {
|
|
470
|
-
padding-top: calc(4 * var(--base-unit, 8px));
|
|
470
|
+
padding-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
471
471
|
}
|
|
472
472
|
.sl-table td:first-of-type,
|
|
473
473
|
.sl-table th:first-of-type {
|
|
474
|
-
padding-left: calc(4 * var(--base-unit, 8px));
|
|
474
|
+
padding-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
475
475
|
}
|
|
476
476
|
.sl-table td:first-of-type .sv-action-bar,
|
|
477
477
|
.sl-table th:first-of-type .sv-action-bar {
|
|
@@ -479,7 +479,7 @@ svc-tab-test {
|
|
|
479
479
|
}
|
|
480
480
|
.sl-table td:last-of-type,
|
|
481
481
|
.sl-table th:last-of-type {
|
|
482
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
482
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
483
483
|
}
|
|
484
484
|
|
|
485
485
|
.sl-panel .sl-panel__footer {
|
|
@@ -493,12 +493,12 @@ svc-tab-test {
|
|
|
493
493
|
}
|
|
494
494
|
.sl-panel .sl-panel__footer button.sl-panel__done-button {
|
|
495
495
|
width: 100%;
|
|
496
|
-
margin: calc(2 * var(--base-unit, 8px)) 0 calc(10 * var(--base-unit, 8px)) 0;
|
|
497
|
-
color: var(--primary, #19b394);
|
|
498
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
496
|
+
margin: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(10 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
497
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
498
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
499
499
|
font-family: var(--font-family);
|
|
500
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
501
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
500
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
501
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
502
502
|
display: flex;
|
|
503
503
|
align-items: center;
|
|
504
504
|
vertical-align: baseline;
|
|
@@ -506,8 +506,8 @@ svc-tab-test {
|
|
|
506
506
|
user-select: none;
|
|
507
507
|
}
|
|
508
508
|
.sl-panel .sl-panel__footer button:hover:enabled {
|
|
509
|
-
background-color: var(--primary, #19b394);
|
|
510
|
-
color: var(--primary-foreground, #fff);
|
|
509
|
+
background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
510
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
511
511
|
}
|
|
512
512
|
.sl-panel .sl-panel__footer .sv-action-bar-item__title {
|
|
513
513
|
color: inherit;
|
|
@@ -525,7 +525,7 @@ svc-tab-test {
|
|
|
525
525
|
.sl-question {
|
|
526
526
|
display: flex;
|
|
527
527
|
align-items: center;
|
|
528
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
528
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
529
529
|
}
|
|
530
530
|
|
|
531
531
|
.sl-row {
|
|
@@ -539,7 +539,7 @@ svc-tab-test {
|
|
|
539
539
|
}
|
|
540
540
|
|
|
541
541
|
.sl-question__header--left {
|
|
542
|
-
margin-right: calc(1 * var(--base-unit, 8px));
|
|
542
|
+
margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
543
543
|
}
|
|
544
544
|
|
|
545
545
|
.sl-row .sd-scrollable-container:not(.sd-scrollable-container--compact) {
|
|
@@ -547,9 +547,9 @@ svc-tab-test {
|
|
|
547
547
|
}
|
|
548
548
|
|
|
549
549
|
.sl-question__title {
|
|
550
|
-
color: var(--foreground, #161616);
|
|
551
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
552
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
550
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
551
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
552
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
553
553
|
margin: 0;
|
|
554
554
|
font-weight: 600;
|
|
555
555
|
}
|
|
@@ -558,19 +558,19 @@ svc-tab-test {
|
|
|
558
558
|
}
|
|
559
559
|
|
|
560
560
|
.sl-row--multiple .sl-question {
|
|
561
|
-
padding-right: calc(1 * var(--base-unit, 8px));
|
|
561
|
+
padding-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
562
562
|
}
|
|
563
563
|
|
|
564
564
|
.svc-logic-question-value {
|
|
565
|
-
--sd-base-padding: calc(5 * var(--base-unit, 8px));
|
|
566
|
-
--sd-base-vertical-padding: calc(4 * var(--base-unit, 8px));
|
|
567
|
-
--sd-page-vertical-padding: calc(3 * var(--base-unit, 8px));
|
|
568
|
-
padding-right: calc(5 * var(--base-unit, 8px));
|
|
569
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
565
|
+
--sd-base-padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
566
|
+
--sd-base-vertical-padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
567
|
+
--sd-page-vertical-padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
568
|
+
padding-right: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
569
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
570
570
|
}
|
|
571
571
|
|
|
572
572
|
.svc-logic_trigger-editor {
|
|
573
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
573
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
574
574
|
}
|
|
575
575
|
|
|
576
576
|
.svc-logic_trigger-editor .svc-logic-question-value {
|
|
@@ -582,16 +582,16 @@ svc-tab-test {
|
|
|
582
582
|
}
|
|
583
583
|
|
|
584
584
|
.spg-comment.sl-comment {
|
|
585
|
-
height: calc(17 * var(--base-unit, 8px));
|
|
585
|
+
height: calc(17 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
586
586
|
}
|
|
587
587
|
.svc-tab-translation {
|
|
588
588
|
width: 100%;
|
|
589
589
|
height: 100%;
|
|
590
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
590
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
591
591
|
}
|
|
592
592
|
|
|
593
593
|
.st-properties .spg-item.spg-selectbase__label:focus-within {
|
|
594
|
-
outline: 1px dotted var(--primary, #19b394);
|
|
594
|
+
outline: 1px dotted var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
595
595
|
}
|
|
596
596
|
.st-properties .spg-selectbase__label:focus-within {
|
|
597
597
|
outline: none;
|
|
@@ -604,8 +604,8 @@ svc-tab-test {
|
|
|
604
604
|
font-family: var(--font-family);
|
|
605
605
|
font-style: normal;
|
|
606
606
|
font-weight: 400;
|
|
607
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
608
|
-
color: var(--foreground, #161616);
|
|
607
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
608
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
609
609
|
width: 100%;
|
|
610
610
|
position: absolute;
|
|
611
611
|
top: 50%;
|
|
@@ -620,7 +620,7 @@ svc-tab-test {
|
|
|
620
620
|
}
|
|
621
621
|
|
|
622
622
|
.st-strings {
|
|
623
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
623
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
624
624
|
overflow-y: auto;
|
|
625
625
|
overflow-x: hidden;
|
|
626
626
|
}
|
|
@@ -633,7 +633,7 @@ svc-tab-test {
|
|
|
633
633
|
flex-shrink: 0;
|
|
634
634
|
flex-grow: 0;
|
|
635
635
|
width: 450px;
|
|
636
|
-
border-left: 1px solid var(--border, #d6d6d6);
|
|
636
|
+
border-left: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
637
637
|
}
|
|
638
638
|
|
|
639
639
|
.st-property-panel .spg-panel__content .spg-row {
|
|
@@ -641,11 +641,11 @@ svc-tab-test {
|
|
|
641
641
|
}
|
|
642
642
|
|
|
643
643
|
.st-property-panel .spg-panel__content .spg-row:first-child {
|
|
644
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
644
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
645
645
|
}
|
|
646
646
|
|
|
647
647
|
.st-strings-header .st-table__cell {
|
|
648
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
648
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
649
649
|
height: auto;
|
|
650
650
|
}
|
|
651
651
|
|
|
@@ -655,22 +655,22 @@ svc-tab-test {
|
|
|
655
655
|
|
|
656
656
|
.st-title.st-panel__title,
|
|
657
657
|
.st-table__cell.st-table__cell--header {
|
|
658
|
-
font-family: var(--font-family);
|
|
658
|
+
font-family: var(--font-family, var(--font-family));
|
|
659
659
|
font-style: normal;
|
|
660
660
|
font-weight: 600;
|
|
661
|
-
font-size: calc(
|
|
662
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
663
|
-
color: var(--foreground-light, #909090);
|
|
661
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
662
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
663
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
664
664
|
text-align: left;
|
|
665
665
|
}
|
|
666
666
|
|
|
667
667
|
.st-title.st-panel__title {
|
|
668
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
669
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
670
|
-
padding-left: calc(3 * var(--base-unit, 8px));
|
|
668
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
669
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
670
|
+
padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
671
671
|
margin: 0;
|
|
672
|
-
background-color: var(--background-
|
|
673
|
-
border-bottom: 1px solid var(--border-light, #eaeaea);
|
|
672
|
+
background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
|
|
673
|
+
border-bottom: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
674
674
|
}
|
|
675
675
|
|
|
676
676
|
.st-table tr {
|
|
@@ -682,28 +682,28 @@ svc-tab-test {
|
|
|
682
682
|
display: block;
|
|
683
683
|
flex: 1 1;
|
|
684
684
|
box-sizing: border-box;
|
|
685
|
-
background-color: var(--background, #fff);
|
|
686
|
-
border-bottom: 1px solid var(--border-light, #eaeaea);
|
|
687
|
-
padding: calc(1 * var(--base-unit, 8px)) 0;
|
|
685
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
686
|
+
border-bottom: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
687
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
688
688
|
}
|
|
689
689
|
|
|
690
690
|
td.st-table__cell:first-of-type {
|
|
691
|
-
font-family: var(--font-family);
|
|
691
|
+
font-family: var(--font-family, var(--font-family));
|
|
692
692
|
font-style: normal;
|
|
693
693
|
font-weight: 600;
|
|
694
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
695
|
-
line-height: calc(
|
|
696
|
-
color: var(--foreground, #161616);
|
|
694
|
+
font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
695
|
+
line-height: calc(1.5 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
696
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
697
697
|
max-width: 300px;
|
|
698
|
-
padding-right: calc(3 * var(--base-unit, 8px));
|
|
698
|
+
padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
699
699
|
}
|
|
700
700
|
td.st-table__cell:first-of-type span {
|
|
701
701
|
display: inline-block;
|
|
702
|
-
padding-left: calc(3 * var(--base-unit, 8px));
|
|
702
|
+
padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
703
703
|
}
|
|
704
704
|
|
|
705
705
|
.st-panel-indent .st-table__cell:first-of-type span {
|
|
706
|
-
padding-left: calc(6 * var(--base-unit, 8px));
|
|
706
|
+
padding-left: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
707
707
|
}
|
|
708
708
|
|
|
709
709
|
.st-table {
|
|
@@ -714,32 +714,32 @@ td.st-table__cell:first-of-type span {
|
|
|
714
714
|
}
|
|
715
715
|
|
|
716
716
|
.st-comment {
|
|
717
|
-
font-family: var(--font-family);
|
|
717
|
+
font-family: var(--font-family, var(--font-family));
|
|
718
718
|
font-style: normal;
|
|
719
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
720
|
-
line-height: calc(
|
|
719
|
+
font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
720
|
+
line-height: calc(1.5 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
721
721
|
display: block;
|
|
722
|
-
width: calc(100% - 3 * var(--base-unit, 8px));
|
|
722
|
+
width: calc(100% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
723
723
|
border: unset;
|
|
724
724
|
outline: none;
|
|
725
|
-
background-color: var(--background, #fff);
|
|
726
|
-
color: var(--foreground, #161616);
|
|
725
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
726
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
727
727
|
resize: none;
|
|
728
728
|
padding: 0;
|
|
729
729
|
}
|
|
730
730
|
|
|
731
731
|
.sd-translation-line-skeleton {
|
|
732
|
-
min-height: calc(5 * var(--base-unit, 8px));
|
|
733
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
732
|
+
min-height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
733
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
734
734
|
}
|
|
735
735
|
.svc-tab-logic-edit {
|
|
736
736
|
width: 100%;
|
|
737
737
|
height: 100%;
|
|
738
|
-
background: var(--background-dim, #f3f3f3);
|
|
738
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
739
739
|
}
|
|
740
740
|
|
|
741
741
|
.svc-tab-logic-edit__content {
|
|
742
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
742
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
743
743
|
overflow-y: auto;
|
|
744
744
|
overflow-x: hidden;
|
|
745
745
|
padding-left: 16%;
|
|
@@ -756,43 +756,43 @@ td.st-table__cell:first-of-type span {
|
|
|
756
756
|
|
|
757
757
|
.svc-tab-logic-edit__content-actions .sv-action-bar {
|
|
758
758
|
padding: 0;
|
|
759
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
760
|
-
background: var(--background, #fff);
|
|
761
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
759
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
760
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
761
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
762
762
|
width: 100%;
|
|
763
763
|
}
|
|
764
764
|
|
|
765
765
|
.svc-logic-paneldynamic div.svc-logic-operator {
|
|
766
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
766
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
767
767
|
box-sizing: content-box;
|
|
768
768
|
}
|
|
769
769
|
|
|
770
770
|
.svc-logic-paneldynamic .svc-logic-operator {
|
|
771
771
|
-webkit-appearance: none;
|
|
772
772
|
appearance: none;
|
|
773
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
774
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
773
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
774
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
775
775
|
border: none;
|
|
776
776
|
outline: none;
|
|
777
777
|
font-weight: 600;
|
|
778
778
|
font-family: var(--font-family);
|
|
779
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
780
|
-
color: var(--foreground-light, #909090);
|
|
781
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
782
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
779
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
780
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
781
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
782
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
783
783
|
cursor: pointer;
|
|
784
784
|
}
|
|
785
785
|
.svc-logic-paneldynamic .svc-logic-operator option {
|
|
786
|
-
background: var(--background, #fff);
|
|
787
|
-
color: var(--foreground, #161616);
|
|
786
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
787
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
788
788
|
}
|
|
789
789
|
|
|
790
790
|
.svc-logic-operator:focus {
|
|
791
|
-
outline: 1px dotted var(--primary, #19b394);
|
|
791
|
+
outline: 1px dotted var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
792
792
|
}
|
|
793
793
|
|
|
794
794
|
.sl-question.svc-logic-question--answered .svc-logic-operator {
|
|
795
|
-
color: var(--foreground, #161616);
|
|
795
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
796
796
|
}
|
|
797
797
|
|
|
798
798
|
.svc-logic-operator.svc-logic-operator:hover, .svc-logic-operator.svc-logic-operator:focus {
|
|
@@ -802,33 +802,33 @@ td.st-table__cell:first-of-type span {
|
|
|
802
802
|
}
|
|
803
803
|
|
|
804
804
|
.svc-logic-operator.svc-logic-operator--question {
|
|
805
|
-
background-color: var(--blue-light, rgba(67, 127, 217, 0.1));
|
|
805
|
+
background-color: var(--sjs-special-blue-light, var(--blue-light, rgba(67, 127, 217, 0.1)));
|
|
806
806
|
}
|
|
807
807
|
.svc-logic-operator.svc-logic-operator--question:hover, .svc-logic-operator.svc-logic-operator--question:focus {
|
|
808
|
-
background-color: var(--blue, #437fd9);
|
|
808
|
+
background-color: var(--sjs-special-blue, #437fd9);
|
|
809
809
|
}
|
|
810
810
|
|
|
811
811
|
.svc-logic-operator.svc-logic-operator--conjunction,
|
|
812
812
|
.svc-logic-operator.svc-logic-operator--operator {
|
|
813
|
-
background-color: var(--yellow-light, rgba(255, 152, 20, 0.1));
|
|
813
|
+
background-color: var(--sjs-special-yellow-light, var(--yellow-light, rgba(255, 152, 20, 0.1)));
|
|
814
814
|
}
|
|
815
815
|
.svc-logic-operator.svc-logic-operator--conjunction:hover, .svc-logic-operator.svc-logic-operator--conjunction:focus,
|
|
816
816
|
.svc-logic-operator.svc-logic-operator--operator:hover,
|
|
817
817
|
.svc-logic-operator.svc-logic-operator--operator:focus {
|
|
818
|
-
background-color: var(--yellow, #ff9814);
|
|
818
|
+
background-color: var(--sjs-special-yellow, var(--yellow, #ff9814));
|
|
819
819
|
}
|
|
820
820
|
|
|
821
821
|
.svc-logic-operator.svc-logic-operator--action {
|
|
822
|
-
background-color: var(--red-light, rgba(
|
|
822
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
823
823
|
}
|
|
824
824
|
.svc-logic-operator.svc-logic-operator--action:hover, .svc-logic-operator.svc-logic-operator--action:focus {
|
|
825
|
-
background-color: var(--red, #e60a3e);
|
|
825
|
+
background-color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
826
826
|
}
|
|
827
827
|
|
|
828
828
|
.svc-logic-operator.svc-logic-operator--error {
|
|
829
|
-
background-color: var(--background, #fff);
|
|
830
|
-
color: var(--red, #e60a3e);
|
|
831
|
-
box-shadow: inset 0 0 0 2px var(--red, #e60a3e);
|
|
829
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
830
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
831
|
+
box-shadow: inset 0 0 0 2px var(--sjs-special-red, var(--red, #e60a3e));
|
|
832
832
|
}
|
|
833
833
|
|
|
834
834
|
.svc-logic-operator__error {
|
|
@@ -845,11 +845,11 @@ td.st-table__cell:first-of-type span {
|
|
|
845
845
|
|
|
846
846
|
.svc-logic-condition-remove.svc-icon-remove {
|
|
847
847
|
display: none;
|
|
848
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
849
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
848
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
849
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
850
850
|
background-repeat: no-repeat;
|
|
851
851
|
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");
|
|
852
|
-
background-size: calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
852
|
+
background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
853
853
|
background-position: center;
|
|
854
854
|
}
|
|
855
855
|
|
|
@@ -860,11 +860,11 @@ td.st-table__cell:first-of-type span {
|
|
|
860
860
|
|
|
861
861
|
.svc-logic-condition-remove.svc-icon-remove:hover,
|
|
862
862
|
.svc-logic-condition-remove.svc-icon-remove:focus {
|
|
863
|
-
background-color: var(--red-light, rgba(
|
|
863
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
864
864
|
}
|
|
865
865
|
|
|
866
866
|
.svc-logic-condition-remove-question {
|
|
867
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
867
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
868
868
|
}
|
|
869
869
|
|
|
870
870
|
.svc-logic-paneldynamic__button.svc-logic-paneldynamic__remove-btn {
|
|
@@ -877,13 +877,13 @@ td.st-table__cell:first-of-type span {
|
|
|
877
877
|
|
|
878
878
|
.svc-logic-operator--action.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn,
|
|
879
879
|
.svc-logic-operator--operator.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn {
|
|
880
|
-
color: var(--foreground-light, #909090);
|
|
881
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
880
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
881
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
882
882
|
}
|
|
883
883
|
.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,
|
|
884
884
|
.svc-logic-operator--operator.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn:hover,
|
|
885
885
|
.svc-logic-operator--operator.sl-paneldynamic__add-btn.sl-paneldynamic__add-btn:focus {
|
|
886
|
-
color: var(--primary-foreground, #fff);
|
|
886
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
887
887
|
}
|
|
888
888
|
|
|
889
889
|
.svc-logic-tab__content.svc-logic-tab__empty {
|
|
@@ -894,24 +894,24 @@ td.st-table__cell:first-of-type span {
|
|
|
894
894
|
top: 35%;
|
|
895
895
|
}
|
|
896
896
|
.svc-logic-tab__content.svc-logic-tab__empty .svc-logic-tab__content-action {
|
|
897
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
898
|
-
margin-top: calc(4 * var(--base-unit, 8px));
|
|
897
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
898
|
+
margin-top: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
899
899
|
}
|
|
900
900
|
.svc-logic-tab__content .svc-logic-tab__content-action {
|
|
901
901
|
margin-left: 25%;
|
|
902
902
|
margin-right: 25%;
|
|
903
|
-
margin-bottom: calc(8 * var(--base-unit, 8px));
|
|
903
|
+
margin-bottom: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
904
904
|
}
|
|
905
905
|
.svc-logic-tab__content .svc-logic-tab__content-action--disabled {
|
|
906
906
|
cursor: default;
|
|
907
|
-
outline: solid calc(0.25 * var(--base-unit, 8px)) transparent;
|
|
907
|
+
outline: solid calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) transparent;
|
|
908
908
|
}
|
|
909
909
|
.svc-logic-tab__content .svc-logic-tab__content-action--disabled:focus, .svc-logic-tab__content .svc-logic-tab__content-action--disabled:hover {
|
|
910
|
-
background-color: var(--background, #fff);
|
|
911
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
910
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
911
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
912
912
|
}
|
|
913
913
|
.svc-logic-tab__content .svc-logic-tab__content-action--disabled .svc-text {
|
|
914
|
-
color: var(--foreground, #161616);
|
|
914
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
915
915
|
opacity: 0.25;
|
|
916
916
|
}
|
|
917
917
|
.svc-logic-tab__content .sd-paneldynamic__panel-wrapper--in-row {
|
|
@@ -933,7 +933,7 @@ td.st-table__cell:first-of-type span {
|
|
|
933
933
|
margin-top: 0;
|
|
934
934
|
}
|
|
935
935
|
.svc-logic-paneldynamic .sd-row__panel {
|
|
936
|
-
width: calc(100% - 5 * var(--base-unit, 8px));
|
|
936
|
+
width: calc(100% - 5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
937
937
|
}
|
|
938
938
|
|
|
939
939
|
.svc-logic-tab__content .svc-logic-paneldynamic .sd-row {
|
|
@@ -964,36 +964,36 @@ td.st-table__cell:first-of-type span {
|
|
|
964
964
|
}
|
|
965
965
|
|
|
966
966
|
.svc-logic-placeholder {
|
|
967
|
-
width: calc(78 * var(--base-unit, 8px));
|
|
967
|
+
width: calc(78 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
968
968
|
min-width: 100%;
|
|
969
969
|
max-width: 100%;
|
|
970
970
|
box-sizing: border-box;
|
|
971
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
972
|
-
background: var(--background, #fff);
|
|
973
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
974
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
975
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px));
|
|
971
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
972
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
973
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
974
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
975
|
+
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)));
|
|
976
976
|
}
|
|
977
977
|
|
|
978
978
|
.svc-logic-placeholder__text {
|
|
979
979
|
font-family: var(--font-family);
|
|
980
980
|
font-style: normal;
|
|
981
981
|
font-weight: 400;
|
|
982
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
983
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
982
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
983
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
984
984
|
text-align: center;
|
|
985
|
-
color: var(--foreground-light, #909090);
|
|
985
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
986
986
|
display: block;
|
|
987
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
987
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
988
988
|
}
|
|
989
989
|
|
|
990
990
|
.svc-logic-tab__leave-apply-button {
|
|
991
|
-
background-color: var(--red, #e60a3e);
|
|
991
|
+
background-color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
992
992
|
}
|
|
993
993
|
svc-tab-designer {
|
|
994
994
|
width: 100%;
|
|
995
995
|
height: 100%;
|
|
996
|
-
background: var(--background-dim, #f3f3f3);
|
|
996
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
997
997
|
}
|
|
998
998
|
|
|
999
999
|
.svc-tab-designer {
|
|
@@ -1010,7 +1010,7 @@ svc-tab-designer {
|
|
|
1010
1010
|
}
|
|
1011
1011
|
|
|
1012
1012
|
.svc-tab-designer--with-place-holder .svc-designer-header {
|
|
1013
|
-
min-width: calc(84 * var(--base-unit, 8px));
|
|
1013
|
+
min-width: calc(84 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1014
1014
|
}
|
|
1015
1015
|
|
|
1016
1016
|
.svc-tab-designer .svc-designer-header .sd-container-modern__title {
|
|
@@ -1023,18 +1023,18 @@ svc-tab-designer {
|
|
|
1023
1023
|
display: flex;
|
|
1024
1024
|
}
|
|
1025
1025
|
.svc-tab-designer .sd-container-modern {
|
|
1026
|
-
min-width: calc(70 * var(--base-unit, 8px));
|
|
1026
|
+
min-width: calc(70 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1027
1027
|
width: 100%;
|
|
1028
1028
|
box-sizing: border-box;
|
|
1029
1029
|
margin-left: auto;
|
|
1030
1030
|
margin-right: auto;
|
|
1031
1031
|
}
|
|
1032
1032
|
.svc-tab-designer .sd-container-modern.sd-container-modern--static {
|
|
1033
|
-
max-width: calc(84 * var(--base-unit, 8px));
|
|
1033
|
+
max-width: calc(84 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1034
1034
|
}
|
|
1035
1035
|
.svc-tab-designer .sd-container-modern.sd-container-modern--responsive {
|
|
1036
1036
|
max-width: initial;
|
|
1037
|
-
padding: 0 calc(1 * var(--base-unit, 8px));
|
|
1037
|
+
padding: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1038
1038
|
}
|
|
1039
1039
|
.svc-tab-designer .sd-question.sd-question--image {
|
|
1040
1040
|
width: 100%;
|
|
@@ -1055,16 +1055,16 @@ svc-tab-designer {
|
|
|
1055
1055
|
flex-direction: column;
|
|
1056
1056
|
align-items: center;
|
|
1057
1057
|
justify-content: center;
|
|
1058
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
1058
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1059
1059
|
box-sizing: border-box;
|
|
1060
1060
|
}
|
|
1061
1061
|
|
|
1062
1062
|
.svc-designer-placeholder-page {
|
|
1063
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
1063
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1064
1064
|
}
|
|
1065
1065
|
|
|
1066
1066
|
.svc-designer-placeholder-page .svc-page__footer {
|
|
1067
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
1067
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1068
1068
|
margin: auto;
|
|
1069
1069
|
}
|
|
1070
1070
|
|
|
@@ -1072,9 +1072,9 @@ svc-tab-designer {
|
|
|
1072
1072
|
display: none;
|
|
1073
1073
|
}
|
|
1074
1074
|
.svc-creator--mobile .sd-root-modern {
|
|
1075
|
-
--sd-base-padding: calc(3 * var(--base-unit, 8px));
|
|
1076
|
-
--sd-base-vertical-padding: calc(2 * var(--base-unit, 8px));
|
|
1077
|
-
--sd-page-vertical-padding: calc(2 * var(--base-unit, 8px));
|
|
1075
|
+
--sd-base-padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1076
|
+
--sd-base-vertical-padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1077
|
+
--sd-page-vertical-padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1078
1078
|
}
|
|
1079
1079
|
.svc-creator--mobile .svc-question__content .sd-question__content .sd-selectbase__column {
|
|
1080
1080
|
max-width: initial;
|
|
@@ -1082,10 +1082,10 @@ svc-tab-designer {
|
|
|
1082
1082
|
margin-left: 0;
|
|
1083
1083
|
}
|
|
1084
1084
|
.svc-creator--mobile .svc-question__content--selected .svc-rating-question-controls {
|
|
1085
|
-
bottom: calc(10 * var(--base-unit, 8px));
|
|
1085
|
+
bottom: calc(10 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1086
1086
|
}
|
|
1087
1087
|
.svc-creator--mobile .svc-page {
|
|
1088
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
1088
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1089
1089
|
}
|
|
1090
1090
|
.svc-creator--mobile .svc-page__content {
|
|
1091
1091
|
padding-left: 0;
|
|
@@ -1093,23 +1093,23 @@ svc-tab-designer {
|
|
|
1093
1093
|
border: 0;
|
|
1094
1094
|
}
|
|
1095
1095
|
.svc-creator--mobile .svc-page__content .sd-page {
|
|
1096
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1096
|
+
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)));
|
|
1097
1097
|
}
|
|
1098
1098
|
.svc-creator--mobile .svc-page__content .svc-page__footer {
|
|
1099
|
-
margin-left: calc(2 * var(--base-unit, 8px));
|
|
1100
|
-
margin-right: calc(2 * var(--base-unit, 8px));
|
|
1099
|
+
margin-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1100
|
+
margin-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1101
1101
|
}
|
|
1102
1102
|
.svc-creator--mobile .svc-question__content {
|
|
1103
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
1103
|
+
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)));
|
|
1104
1104
|
}
|
|
1105
1105
|
.svc-creator--mobile .svc-question__content.svc-question__content--selected {
|
|
1106
|
-
padding-bottom: calc(8 * var(--base-unit, 8px));
|
|
1106
|
+
padding-bottom: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1107
1107
|
}
|
|
1108
1108
|
.svc-creator--mobile .svc-tab-designer {
|
|
1109
1109
|
justify-content: initial;
|
|
1110
1110
|
}
|
|
1111
1111
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title {
|
|
1112
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
1112
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1113
1113
|
flex-direction: column-reverse;
|
|
1114
1114
|
align-items: flex-start;
|
|
1115
1115
|
}
|
|
@@ -1117,31 +1117,31 @@ svc-tab-designer {
|
|
|
1117
1117
|
margin-top: 0;
|
|
1118
1118
|
}
|
|
1119
1119
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title .svc-logo-image-placeholder {
|
|
1120
|
-
margin-left: calc(-2 * var(--base-unit, 8px));
|
|
1120
|
+
margin-left: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1121
1121
|
}
|
|
1122
1122
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title h3 {
|
|
1123
1123
|
margin: 0;
|
|
1124
|
-
font-size: calc(3 * var(--base-unit, 8px));
|
|
1125
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1124
|
+
font-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1125
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1126
1126
|
}
|
|
1127
1127
|
.svc-creator--mobile .svc-tab-designer .sd-title.sd-container-modern__title h5 {
|
|
1128
1128
|
margin: 0;
|
|
1129
1129
|
}
|
|
1130
1130
|
.svc-creator--mobile .svc-tab-designer .sd-container-modern {
|
|
1131
|
-
min-width: calc(46 * var(--base-unit, 8px));
|
|
1131
|
+
min-width: calc(46 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1132
1132
|
}
|
|
1133
1133
|
.svc-creator--mobile .svc-properties-wrapper {
|
|
1134
1134
|
width: 100%;
|
|
1135
1135
|
}
|
|
1136
1136
|
.svc-creator--mobile .svc-question__content-actions {
|
|
1137
|
-
width: calc(100% - 3 * var(--base-unit, 8px));
|
|
1138
|
-
left: calc(2 * var(--base-unit, 8px));
|
|
1137
|
+
width: calc(100% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1138
|
+
left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1139
1139
|
}
|
|
1140
1140
|
.svc-creator--mobile .svc-question__content-actions .sv-action-bar-item {
|
|
1141
1141
|
border: 0;
|
|
1142
1142
|
}
|
|
1143
1143
|
.svc-creator--mobile .svc-page__content-actions .sv-action-bar {
|
|
1144
|
-
padding-right: calc(1 * var(--base-unit, 8px));
|
|
1144
|
+
padding-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1145
1145
|
}
|
|
1146
1146
|
.svc-creator--mobile .svc-page__content-actions .sv-action-bar .sv-action .sv-action__content {
|
|
1147
1147
|
padding-right: 0;
|
|
@@ -1152,7 +1152,7 @@ svc-tab-designer {
|
|
|
1152
1152
|
svc-tab-test {
|
|
1153
1153
|
width: 100%;
|
|
1154
1154
|
height: 100%;
|
|
1155
|
-
background: var(--background-dim, #f3f3f3);
|
|
1155
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
1156
1156
|
}
|
|
1157
1157
|
|
|
1158
1158
|
.svc-test-tab__content .svc-plugin-tab__content {
|
|
@@ -1162,13 +1162,13 @@ svc-tab-test {
|
|
|
1162
1162
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_completed_page {
|
|
1163
1163
|
margin: 0;
|
|
1164
1164
|
border: 0;
|
|
1165
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
1165
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
1166
1166
|
}
|
|
1167
1167
|
.svc-test-tab__content .svc-plugin-tab__content .sv_default_css .sv_body {
|
|
1168
1168
|
border: 0;
|
|
1169
1169
|
}
|
|
1170
1170
|
.svc-test-tab__content .svc-plugin-tab__content .svc-preview__test-again {
|
|
1171
|
-
width: calc(33 * var(--base-unit, 8px));
|
|
1171
|
+
width: calc(33 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1172
1172
|
margin-left: auto;
|
|
1173
1173
|
margin-right: auto;
|
|
1174
1174
|
margin-bottom: 72px;
|
|
@@ -1176,7 +1176,7 @@ svc-tab-test {
|
|
|
1176
1176
|
}
|
|
1177
1177
|
|
|
1178
1178
|
.svc-creator-tab__content--with-toolbar.svc-test-tab__content .svc-plugin-tab__content {
|
|
1179
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
1179
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1180
1180
|
}
|
|
1181
1181
|
|
|
1182
1182
|
.svc-test-tab__content-actions {
|
|
@@ -1184,9 +1184,9 @@ svc-tab-test {
|
|
|
1184
1184
|
}
|
|
1185
1185
|
.svc-test-tab__content-actions .sv-action-bar {
|
|
1186
1186
|
padding: 0;
|
|
1187
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
1188
|
-
background: var(--background, #fff);
|
|
1189
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
1187
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1188
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1189
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1190
1190
|
width: 100%;
|
|
1191
1191
|
position: absolute;
|
|
1192
1192
|
}
|
|
@@ -1194,7 +1194,7 @@ svc-tab-test {
|
|
|
1194
1194
|
left: 0;
|
|
1195
1195
|
right: 0;
|
|
1196
1196
|
justify-content: center;
|
|
1197
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
1197
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1198
1198
|
}
|
|
1199
1199
|
.svc-test-tab__content-actions .sv-action-bar.sv-action-bar--pages .sv-action__content {
|
|
1200
1200
|
padding: 0;
|
|
@@ -1203,13 +1203,13 @@ svc-tab-test {
|
|
|
1203
1203
|
margin: 0;
|
|
1204
1204
|
}
|
|
1205
1205
|
.svc-test-tab__content-actions .sv-action-bar-item {
|
|
1206
|
-
font-family: var(--font-family);
|
|
1206
|
+
font-family: var(--font-family, var(--font-family));
|
|
1207
1207
|
font-style: normal;
|
|
1208
1208
|
font-weight: 600;
|
|
1209
|
-
font-size: calc(
|
|
1210
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
1209
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1210
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1211
1211
|
width: 100%;
|
|
1212
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
1212
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1213
1213
|
}
|
|
1214
1214
|
.svc-test-tab__content-actions .svc-page-selector {
|
|
1215
1215
|
max-width: 50%;
|
|
@@ -1218,7 +1218,7 @@ svc-tab-test {
|
|
|
1218
1218
|
overflow: hidden;
|
|
1219
1219
|
white-space: nowrap;
|
|
1220
1220
|
text-overflow: ellipsis;
|
|
1221
|
-
color: var(--foreground, #161616);
|
|
1221
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1222
1222
|
display: inline-block;
|
|
1223
1223
|
}
|
|
1224
1224
|
|
|
@@ -1226,8 +1226,8 @@ svc-tab-test {
|
|
|
1226
1226
|
font-family: var(--font-family);
|
|
1227
1227
|
font-style: normal;
|
|
1228
1228
|
font-weight: 400;
|
|
1229
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1230
|
-
color: var(--foreground, #161616);
|
|
1229
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1230
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1231
1231
|
width: 100%;
|
|
1232
1232
|
position: absolute;
|
|
1233
1233
|
top: 50%;
|
|
@@ -1242,34 +1242,34 @@ svc-tab-test {
|
|
|
1242
1242
|
|
|
1243
1243
|
.svc-notifier {
|
|
1244
1244
|
position: absolute;
|
|
1245
|
-
bottom: calc(1 * var(--base-unit, 8px));
|
|
1246
|
-
left: calc(1 * var(--base-unit, 8px));
|
|
1247
|
-
background: var(--background, #fff);
|
|
1245
|
+
bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1246
|
+
left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1247
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1248
1248
|
opacity: 0;
|
|
1249
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1250
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
|
|
1251
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1252
|
-
color: var(--foreground, #161616);
|
|
1253
|
-
min-width: calc(30 * var(--base-unit, 8px));
|
|
1249
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1250
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
|
|
1251
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1252
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1253
|
+
min-width: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1254
1254
|
text-align: center;
|
|
1255
1255
|
z-index: 1600;
|
|
1256
1256
|
visibility: hidden;
|
|
1257
|
-
font-family: var(--font-family);
|
|
1257
|
+
font-family: var(--font-family, var(--font-family));
|
|
1258
1258
|
font-style: normal;
|
|
1259
1259
|
font-weight: 600;
|
|
1260
|
-
font-size: calc(
|
|
1261
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
1260
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1261
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
1262
1262
|
}
|
|
1263
1263
|
|
|
1264
1264
|
.svc-notifier.svc-notifier--error {
|
|
1265
|
-
background-color: var(--red, #e60a3e);
|
|
1265
|
+
background-color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
1266
1266
|
color: #ffffff;
|
|
1267
1267
|
opacity: 1;
|
|
1268
1268
|
}
|
|
1269
1269
|
|
|
1270
1270
|
.svc-creator--mobile .svc-notifier {
|
|
1271
1271
|
left: 0;
|
|
1272
|
-
bottom: calc(6 * var(--base-unit, 8px));
|
|
1272
|
+
bottom: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1273
1273
|
width: 100%;
|
|
1274
1274
|
box-sizing: border-box;
|
|
1275
1275
|
opacity: 1;
|
|
@@ -1288,7 +1288,7 @@ survey-creator,
|
|
|
1288
1288
|
survey-creator *,
|
|
1289
1289
|
.svc-creator * {
|
|
1290
1290
|
scrollbar-width: thin;
|
|
1291
|
-
scrollbar-color: var(--border, #d6d6d6) transparent;
|
|
1291
|
+
scrollbar-color: var(--sjs-border-default, var(--border, #d6d6d6)) transparent;
|
|
1292
1292
|
}
|
|
1293
1293
|
survey-creator ::-webkit-scrollbar,
|
|
1294
1294
|
.svc-creator ::-webkit-scrollbar {
|
|
@@ -1301,7 +1301,7 @@ survey-creator ::-webkit-scrollbar-thumb,
|
|
|
1301
1301
|
border: 4px solid rgba(0, 0, 0, 0);
|
|
1302
1302
|
background-clip: padding-box;
|
|
1303
1303
|
border-radius: 32px;
|
|
1304
|
-
background-color: var(--border, #d6d6d6);
|
|
1304
|
+
background-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1305
1305
|
}
|
|
1306
1306
|
survey-creator ::-webkit-scrollbar-track,
|
|
1307
1307
|
.svc-creator ::-webkit-scrollbar-track {
|
|
@@ -1310,7 +1310,7 @@ survey-creator ::-webkit-scrollbar-track,
|
|
|
1310
1310
|
survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
1311
1311
|
.svc-creator ::-webkit-scrollbar-thumb:hover {
|
|
1312
1312
|
border: 2px solid rgba(0, 0, 0, 0);
|
|
1313
|
-
background-color: var(--foreground-light, #909090);
|
|
1313
|
+
background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1314
1314
|
}
|
|
1315
1315
|
|
|
1316
1316
|
.svc-creator__area {
|
|
@@ -1322,16 +1322,16 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1322
1322
|
}
|
|
1323
1323
|
|
|
1324
1324
|
.svc-creator__area.svc-creator__area--with-banner {
|
|
1325
|
-
height: calc(100% - (4 * var(--base-unit, 8px)));
|
|
1325
|
+
height: calc(100% - (4 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1326
1326
|
}
|
|
1327
1327
|
|
|
1328
1328
|
.svc-creator__content-wrapper {
|
|
1329
1329
|
width: 100%;
|
|
1330
|
-
height: calc(100% - (8 * var(--base-unit, 8px)));
|
|
1330
|
+
height: calc(100% - (8 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1331
1331
|
}
|
|
1332
1332
|
|
|
1333
1333
|
.svc-creator__content-wrapper--footer-toolbar {
|
|
1334
|
-
height: calc(100% - (6 * var(--base-unit, 8px)));
|
|
1334
|
+
height: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
1335
1335
|
}
|
|
1336
1336
|
|
|
1337
1337
|
.svc-creator__content-holder {
|
|
@@ -1366,18 +1366,18 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1366
1366
|
|
|
1367
1367
|
.svc-plugin-tab__content-actions sv-action-bar {
|
|
1368
1368
|
padding: 0;
|
|
1369
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
1370
|
-
background: var(--background, #fff);
|
|
1371
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
1369
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1370
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1371
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1372
1372
|
}
|
|
1373
1373
|
|
|
1374
1374
|
.svc-creator__banner {
|
|
1375
1375
|
position: absolute;
|
|
1376
|
-
bottom: calc(-4 * var(--base-unit, 8px));
|
|
1376
|
+
bottom: calc(-4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1377
1377
|
width: 100%;
|
|
1378
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
1379
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1380
|
-
background-color: var(--secondary, #ff9814);
|
|
1378
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1379
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1380
|
+
background-color: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
1381
1381
|
text-align: center;
|
|
1382
1382
|
overflow: hidden;
|
|
1383
1383
|
}
|
|
@@ -1388,31 +1388,31 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1388
1388
|
max-width: 0;
|
|
1389
1389
|
overflow: hidden;
|
|
1390
1390
|
height: 100%;
|
|
1391
|
-
background-color: var(--background, #fff);
|
|
1391
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1392
1392
|
/* Shadow / Medium */
|
|
1393
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
1394
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
|
|
1393
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1394
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
|
|
1395
1395
|
transition: max-width 0.1s ease-in-out, padding 0.2s ease-in-out;
|
|
1396
1396
|
}
|
|
1397
1397
|
|
|
1398
1398
|
.svc-creator__non-commercial-text {
|
|
1399
|
-
color: var(--primary-foreground, #fff);
|
|
1399
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
1400
1400
|
font-family: var(--font-family);
|
|
1401
1401
|
font-weight: bold;
|
|
1402
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1402
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1403
1403
|
text-transform: uppercase;
|
|
1404
1404
|
vertical-align: middle;
|
|
1405
1405
|
}
|
|
1406
1406
|
.svc-creator__non-commercial-text a {
|
|
1407
|
-
color: var(--primary-foreground, #fff);
|
|
1407
|
+
color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
|
|
1408
1408
|
text-decoration: none;
|
|
1409
1409
|
}
|
|
1410
1410
|
|
|
1411
1411
|
.sv-drag-drop-ghost {
|
|
1412
|
-
top: calc(0.75 * var(--base-unit, 8px));
|
|
1412
|
+
top: calc(0.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1413
1413
|
width: 100%;
|
|
1414
|
-
height: calc(0.5 * var(--base-unit, 8px));
|
|
1415
|
-
background: var(--secondary, #ff9814);
|
|
1414
|
+
height: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1415
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
1416
1416
|
position: absolute;
|
|
1417
1417
|
}
|
|
1418
1418
|
|
|
@@ -1423,7 +1423,7 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1423
1423
|
|
|
1424
1424
|
.sv-drag-drop-ghost--item-value-bottom {
|
|
1425
1425
|
top: initial;
|
|
1426
|
-
bottom: calc(-0.5 * var(--base-unit, 8px));
|
|
1426
|
+
bottom: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1427
1427
|
}
|
|
1428
1428
|
.sd-element__title .svc-string-editor {
|
|
1429
1429
|
display: inline-block;
|
|
@@ -1445,7 +1445,7 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1445
1445
|
}
|
|
1446
1446
|
.svc-string-editor .sv-string-editor[aria-placeholder]:empty:before {
|
|
1447
1447
|
content: attr(aria-placeholder);
|
|
1448
|
-
color: var(--foreground-light, #909090);
|
|
1448
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1449
1449
|
}
|
|
1450
1450
|
.svc-string-editor .sv-string-editor--html,
|
|
1451
1451
|
.svc-string-editor .sv-string-editor:focus-within {
|
|
@@ -1476,12 +1476,12 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1476
1476
|
z-index: 20;
|
|
1477
1477
|
padding: 0px;
|
|
1478
1478
|
vertical-align: top;
|
|
1479
|
-
margin-inline-start: calc(2 * var(--base-unit, 8px));
|
|
1480
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
1479
|
+
margin-inline-start: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1480
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1481
1481
|
font-family: var(--font-family);
|
|
1482
1482
|
font-weight: 400;
|
|
1483
|
-
color: var(--foreground-light, #909090);
|
|
1484
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
1483
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1484
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1485
1485
|
}
|
|
1486
1486
|
|
|
1487
1487
|
.svc-string-editor__border {
|
|
@@ -1495,9 +1495,9 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1495
1495
|
}
|
|
1496
1496
|
|
|
1497
1497
|
.svc-string-editor__error {
|
|
1498
|
-
margin-left: calc(1 * var(--base-unit, 8px));
|
|
1499
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1500
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1498
|
+
margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1499
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1500
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1501
1501
|
color: red;
|
|
1502
1502
|
display: none;
|
|
1503
1503
|
}
|
|
@@ -1506,9 +1506,9 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1506
1506
|
position: absolute;
|
|
1507
1507
|
left: 100%;
|
|
1508
1508
|
height: 100%;
|
|
1509
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
1509
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1510
1510
|
top: 0;
|
|
1511
|
-
padding-left: calc(2 * var(--base-unit, 8px));
|
|
1511
|
+
padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1512
1512
|
z-index: 12;
|
|
1513
1513
|
display: none;
|
|
1514
1514
|
align-items: center;
|
|
@@ -1521,13 +1521,13 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1521
1521
|
position: relative;
|
|
1522
1522
|
}
|
|
1523
1523
|
.svc-string-editor__button use {
|
|
1524
|
-
fill: var(--primary, #19b394);
|
|
1524
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1525
1525
|
}
|
|
1526
1526
|
|
|
1527
1527
|
.svc-string-editor__button--edit {
|
|
1528
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
1529
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
1530
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
1528
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1529
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1530
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1531
1531
|
}
|
|
1532
1532
|
.svc-string-editor__button--edit .sv-svg-icon {
|
|
1533
1533
|
vertical-align: bottom;
|
|
@@ -1544,26 +1544,26 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1544
1544
|
display: flex;
|
|
1545
1545
|
top: 0;
|
|
1546
1546
|
bottom: 0;
|
|
1547
|
-
left: calc(-0.5 * var(--base-unit, 8px));
|
|
1548
|
-
right: calc(-0.5 * var(--base-unit, 8px));
|
|
1547
|
+
left: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1548
|
+
right: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1549
1549
|
border-radius: 3px;
|
|
1550
|
-
box-shadow: 0px 0px 0px calc(0.25 * var(--base-unit, 8px)) rgba(0, 0, 0, 0.16);
|
|
1550
|
+
box-shadow: 0px 0px 0px calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) rgba(0, 0, 0, 0.16);
|
|
1551
1551
|
}
|
|
1552
1552
|
|
|
1553
1553
|
.svc-string-editor:focus-within .svc-string-editor__border {
|
|
1554
1554
|
display: flex;
|
|
1555
|
-
top: calc(-0.5 * var(--base-unit, 8px));
|
|
1556
|
-
bottom: calc(-0.5 * var(--base-unit, 8px));
|
|
1557
|
-
left: calc(-1 * var(--base-unit, 8px));
|
|
1558
|
-
right: calc(-1 * var(--base-unit, 8px));
|
|
1555
|
+
top: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1556
|
+
bottom: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1557
|
+
left: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1558
|
+
right: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1559
1559
|
border-radius: 3px;
|
|
1560
1560
|
box-sizing: content-box;
|
|
1561
|
-
background-color: var(--background, #fff);
|
|
1562
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1), 0px 0px 0px calc(0.25 * var(--base-unit, 8px)) var(--primary, #19b394);
|
|
1561
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1562
|
+
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));
|
|
1563
1563
|
}
|
|
1564
1564
|
|
|
1565
1565
|
.svc-string-editor.svc-string-editor--error:focus-within .svc-string-editor__border {
|
|
1566
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1), 0px 0px 0px calc(0.25 * var(--base-unit, 8px)) var(--red, #e60a3e);
|
|
1566
|
+
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));
|
|
1567
1567
|
}
|
|
1568
1568
|
|
|
1569
1569
|
.sd-boolean .sv-string-editor:focus-within {
|
|
@@ -1571,7 +1571,7 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1571
1571
|
}
|
|
1572
1572
|
|
|
1573
1573
|
.sd-rating .sd-rating__item:focus-within {
|
|
1574
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--primary, #19b394);
|
|
1574
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1575
1575
|
}
|
|
1576
1576
|
.sd-rating:not(.sd-rating__min-text) .svc-string-editor:focus-within .svc-string-editor__border {
|
|
1577
1577
|
display: none;
|
|
@@ -1579,12 +1579,12 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1579
1579
|
|
|
1580
1580
|
.sd-table__cell--actions .svc-string-editor__button--done,
|
|
1581
1581
|
.sd-matrixdynamic__add-btn .svc-string-editor__button--done {
|
|
1582
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
1582
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1583
1583
|
}
|
|
1584
1584
|
|
|
1585
1585
|
.sd-table__cell--header .svc-matrix-cell:not(:focus):focus-within .svc-matrix-cell--selected {
|
|
1586
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--primary, #19b394);
|
|
1587
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1586
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1587
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1588
1588
|
display: block;
|
|
1589
1589
|
}
|
|
1590
1590
|
.sd-table__cell--header .svc-string-editor:focus-within .svc-string-editor__border {
|
|
@@ -1592,8 +1592,8 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1592
1592
|
}
|
|
1593
1593
|
|
|
1594
1594
|
.sd-item__control-label .svc-string-editor:focus-within .svc-string-editor__border {
|
|
1595
|
-
left: calc(-0.7 * var(--base-unit, 8px));
|
|
1596
|
-
right: calc(-0.7 * var(--base-unit, 8px));
|
|
1595
|
+
left: calc(-0.7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1596
|
+
right: calc(-0.7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1597
1597
|
}
|
|
1598
1598
|
|
|
1599
1599
|
.svc-string-editor:hover ~ .sd-question__required-text, .svc-string-editor:focus-within ~ .sd-question__required-text {
|
|
@@ -1602,56 +1602,56 @@ survey-creator ::-webkit-scrollbar-thumb:hover,
|
|
|
1602
1602
|
.svc-btn {
|
|
1603
1603
|
display: flex;
|
|
1604
1604
|
align-items: center;
|
|
1605
|
-
height: calc(7 * var(--base-unit, 8px));
|
|
1606
|
-
line-height: calc(7 * var(--base-unit, 8px));
|
|
1605
|
+
height: calc(7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1606
|
+
line-height: calc(7 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1607
1607
|
vertical-align: baseline;
|
|
1608
1608
|
text-align: center;
|
|
1609
|
-
background-color: var(--background, #fff);
|
|
1610
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
1611
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1609
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1610
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
1611
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1612
1612
|
cursor: pointer;
|
|
1613
1613
|
user-select: none;
|
|
1614
|
-
outline: solid calc(0.25 * var(--base-unit, 8px)) transparent;
|
|
1614
|
+
outline: solid calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) transparent;
|
|
1615
1615
|
}
|
|
1616
1616
|
.svc-btn .svc-text {
|
|
1617
1617
|
display: flex;
|
|
1618
1618
|
align-items: center;
|
|
1619
1619
|
flex-grow: 1;
|
|
1620
1620
|
justify-content: center;
|
|
1621
|
-
color: var(--primary, #19b394);
|
|
1621
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1622
1622
|
}
|
|
1623
1623
|
|
|
1624
1624
|
.svc-btn:hover {
|
|
1625
|
-
background-color: var(--sjs-general-backcolor-dark, rgb(248, 248, 248));
|
|
1625
|
+
background-color: var(--sjs-questionpanel-hovercolor, var(--sjs-general-backcolor-dark, rgb(248, 248, 248)));
|
|
1626
1626
|
}
|
|
1627
1627
|
|
|
1628
1628
|
.svc-btn:focus {
|
|
1629
|
-
box-shadow: 0 0 0 2px var(--primary, #19b394);
|
|
1629
|
+
box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1630
1630
|
}
|
|
1631
1631
|
|
|
1632
1632
|
.svc-action-button {
|
|
1633
1633
|
display: inline-block;
|
|
1634
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1634
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1635
1635
|
box-sizing: border-box;
|
|
1636
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
1637
|
-
color: var(--primary, #19b394);
|
|
1636
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1637
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1638
1638
|
font-weight: 600;
|
|
1639
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
1640
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
1641
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid transparent;
|
|
1639
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1640
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1641
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid transparent;
|
|
1642
1642
|
}
|
|
1643
1643
|
.svc-action-button:focus, .svc-action-button:hover {
|
|
1644
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
1644
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1645
1645
|
outline: none;
|
|
1646
1646
|
}
|
|
1647
1647
|
|
|
1648
1648
|
.svc-action-button--selected {
|
|
1649
|
-
border-color: var(--primary, #19b394);
|
|
1649
|
+
border-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1650
1650
|
}
|
|
1651
1651
|
|
|
1652
1652
|
.svc-action-button--disabled {
|
|
1653
1653
|
opacity: 0.25;
|
|
1654
|
-
color: var(--foreground, #161616);
|
|
1654
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1655
1655
|
}
|
|
1656
1656
|
svc-page-navigator,
|
|
1657
1657
|
.svc-page-navigator {
|
|
@@ -1661,20 +1661,20 @@ svc-page-navigator,
|
|
|
1661
1661
|
|
|
1662
1662
|
.svc-page-navigator__navigator-icon {
|
|
1663
1663
|
display: block;
|
|
1664
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
1665
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
1666
|
-
padding: calc(1.25 * var(--base-unit, 8px));
|
|
1664
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1665
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1666
|
+
padding: calc(1.25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1667
1667
|
border-radius: 50%;
|
|
1668
1668
|
cursor: pointer;
|
|
1669
1669
|
}
|
|
1670
1670
|
.svc-page-navigator__navigator-icon use {
|
|
1671
|
-
fill: var(--foreground-light, #909090);
|
|
1671
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1672
1672
|
}
|
|
1673
1673
|
|
|
1674
1674
|
.svc-page-navigator__selector {
|
|
1675
|
-
width: calc(5.5 * var(--base-unit, 8px));
|
|
1676
|
-
height: calc(5.5 * var(--base-unit, 8px));
|
|
1677
|
-
min-height: calc(5.5 * var(--base-unit, 8px));
|
|
1675
|
+
width: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1676
|
+
height: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1677
|
+
min-height: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1678
1678
|
}
|
|
1679
1679
|
|
|
1680
1680
|
survey-creator .svc-page-navigator__selector:hover, survey-creator .svc-page-navigator__selector:focus,
|
|
@@ -1685,39 +1685,39 @@ survey-creator .svc-page-navigator__selector:hover, survey-creator .svc-page-nav
|
|
|
1685
1685
|
survey-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon, survey-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon,
|
|
1686
1686
|
.svc-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon,
|
|
1687
1687
|
.svc-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon {
|
|
1688
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
1688
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1689
1689
|
}
|
|
1690
1690
|
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,
|
|
1691
1691
|
.svc-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigator-icon use,
|
|
1692
1692
|
.svc-creator .svc-page-navigator__selector:focus .svc-page-navigator__navigator-icon use {
|
|
1693
|
-
fill: var(--primary, #19b394);
|
|
1693
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1694
1694
|
}
|
|
1695
1695
|
|
|
1696
1696
|
.svc-page-navigator__selector--opened {
|
|
1697
1697
|
opacity: 0.5;
|
|
1698
1698
|
}
|
|
1699
1699
|
.svc-page-navigator__selector--opened .svc-page-navigator__navigator-icon {
|
|
1700
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
1700
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1701
1701
|
}
|
|
1702
1702
|
.svc-page-navigator__selector--opened .svc-page-navigator__navigator-icon use {
|
|
1703
|
-
fill: var(--primary, #19b394);
|
|
1703
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1704
1704
|
}
|
|
1705
1705
|
|
|
1706
1706
|
.svc-page-navigator__popup {
|
|
1707
|
-
min-width: calc(12.5 * var(--base-unit, 8px));
|
|
1707
|
+
min-width: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1708
1708
|
}
|
|
1709
1709
|
|
|
1710
1710
|
.svc-tab-designer--with-page-navigator .svc-tab-designer_content {
|
|
1711
|
-
margin-right: calc(6.5 * var(--base-unit, 8px));
|
|
1711
|
+
margin-right: calc(6.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1712
1712
|
}
|
|
1713
1713
|
|
|
1714
1714
|
.svc-tab-designer__page-navigator {
|
|
1715
|
-
width: calc(5.5 * var(--base-unit, 8px));
|
|
1715
|
+
width: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1716
1716
|
position: absolute;
|
|
1717
|
-
padding: calc(16.5 * var(--base-unit, 8px)) 0;
|
|
1717
|
+
padding: calc(16.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
1718
1718
|
top: 0;
|
|
1719
1719
|
bottom: 0;
|
|
1720
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
1720
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1721
1721
|
}
|
|
1722
1722
|
|
|
1723
1723
|
.svc-creator__toolbox--right .svc-tab-designer--with-page-navigator .svc-tab-designer_content,
|
|
@@ -1725,21 +1725,21 @@ survey-creator .svc-page-navigator__selector:hover .svc-page-navigator__navigato
|
|
|
1725
1725
|
[style*="direction:rtl"] .svc-tab-designer--with-page-navigator .svc-tab-designer_content,
|
|
1726
1726
|
[style*="direction: rtl"] .svc-tab-designer--with-page-navigator .svc-tab-designer_content {
|
|
1727
1727
|
margin-right: 0;
|
|
1728
|
-
margin-left: calc(6.5 * var(--base-unit, 8px));
|
|
1728
|
+
margin-left: calc(6.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1729
1729
|
}
|
|
1730
1730
|
.svc-creator__toolbox--right .svc-tab-designer__page-navigator,
|
|
1731
1731
|
[dir=rtl] .svc-tab-designer__page-navigator,
|
|
1732
1732
|
[style*="direction:rtl"] .svc-tab-designer__page-navigator,
|
|
1733
1733
|
[style*="direction: rtl"] .svc-tab-designer__page-navigator {
|
|
1734
1734
|
right: unset;
|
|
1735
|
-
left: calc(1 * var(--base-unit, 8px));
|
|
1735
|
+
left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1736
1736
|
}
|
|
1737
1737
|
svc-page-navigator-item,
|
|
1738
1738
|
.svc-page-navigator-item {
|
|
1739
1739
|
display: block;
|
|
1740
|
-
width: calc(5.5 * var(--base-unit, 8px));
|
|
1741
|
-
height: calc(4.5 * var(--base-unit, 8px));
|
|
1742
|
-
min-height: calc(4.5 * var(--base-unit, 8px));
|
|
1740
|
+
width: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1741
|
+
height: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1742
|
+
min-height: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1743
1743
|
cursor: pointer;
|
|
1744
1744
|
position: relative;
|
|
1745
1745
|
}
|
|
@@ -1776,26 +1776,26 @@ svc-page-navigator-item,
|
|
|
1776
1776
|
height: 6px;
|
|
1777
1777
|
right: calc(50% - 3px);
|
|
1778
1778
|
top: calc(50% - 3px);
|
|
1779
|
-
background: var(--border, #d6d6d6);
|
|
1779
|
+
background: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
1780
1780
|
}
|
|
1781
1781
|
|
|
1782
1782
|
.svc-page-navigator-item--selected .svc-page-navigator-item__dot {
|
|
1783
|
-
width: calc(1 * var(--base-unit, 8px));
|
|
1784
|
-
height: calc(1 * var(--base-unit, 8px));
|
|
1785
|
-
right: calc(50% - 1.5 * var(--base-unit, 8px) / 2);
|
|
1786
|
-
top: calc(50% - 1.5 * var(--base-unit, 8px) / 2);
|
|
1787
|
-
background: var(--background, #fff);
|
|
1788
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--primary, #19b394);
|
|
1783
|
+
width: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1784
|
+
height: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1785
|
+
right: calc(50% - 1.5 * var(--sjs-base-unit, var(--base-unit, 8px)) / 2);
|
|
1786
|
+
top: calc(50% - 1.5 * var(--sjs-base-unit, var(--base-unit, 8px)) / 2);
|
|
1787
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1788
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1789
1789
|
}
|
|
1790
1790
|
|
|
1791
1791
|
.svc-page-navigator-item__banner {
|
|
1792
1792
|
overflow: hidden;
|
|
1793
1793
|
white-space: nowrap;
|
|
1794
1794
|
text-overflow: ellipsis;
|
|
1795
|
-
right: calc(0.5 * var(--base-unit, 8px));
|
|
1795
|
+
right: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1796
1796
|
display: flex;
|
|
1797
1797
|
align-items: center;
|
|
1798
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
1798
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1799
1799
|
animation: 0.5s ease-in;
|
|
1800
1800
|
padding: 0;
|
|
1801
1801
|
opacity: 0;
|
|
@@ -1804,8 +1804,8 @@ svc-page-navigator-item,
|
|
|
1804
1804
|
.svc-page-navigator-item__banner .svc-page-navigator-item__dot {
|
|
1805
1805
|
position: absolute;
|
|
1806
1806
|
display: inline-block;
|
|
1807
|
-
top: calc(1.75 * var(--base-unit, 8px));
|
|
1808
|
-
right: calc(1.75 * var(--base-unit, 8px));
|
|
1807
|
+
top: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1808
|
+
right: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1809
1809
|
}
|
|
1810
1810
|
|
|
1811
1811
|
.svc-creator__toolbox--right .svc-page-navigator-item__banner,
|
|
@@ -1820,20 +1820,20 @@ svc-page-navigator-item,
|
|
|
1820
1820
|
[style*="direction:rtl"] .svc-page-navigator-item__banner .svc-page-navigator-item__dot,
|
|
1821
1821
|
[style*="direction: rtl"] .svc-page-navigator-item__banner .svc-page-navigator-item__dot {
|
|
1822
1822
|
right: unset;
|
|
1823
|
-
left: calc(1.75 * var(--base-unit, 8px));
|
|
1823
|
+
left: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1824
1824
|
}
|
|
1825
1825
|
|
|
1826
1826
|
.svc-page-navigator-item-content:not(.svc-page-navigator-item--disabled) .svc-page-navigator-item__banner .svc-page-navigator-item__dot {
|
|
1827
|
-
width: calc(1 * var(--base-unit, 8px));
|
|
1828
|
-
height: calc(1 * var(--base-unit, 8px));
|
|
1827
|
+
width: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1828
|
+
height: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1829
1829
|
border: none;
|
|
1830
|
-
background: var(--primary, #19b394);
|
|
1830
|
+
background: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
1831
1831
|
}
|
|
1832
1832
|
|
|
1833
1833
|
.svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):hover .svc-page-navigator-item__banner,
|
|
1834
1834
|
.svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):focus .svc-page-navigator-item__banner {
|
|
1835
|
-
padding: 0 calc(4.5 * var(--base-unit, 8px)) 0 calc(2.5 * var(--base-unit, 8px));
|
|
1836
|
-
max-width: calc(25 * var(--base-unit, 8px));
|
|
1835
|
+
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)));
|
|
1836
|
+
max-width: calc(25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1837
1837
|
opacity: 1;
|
|
1838
1838
|
}
|
|
1839
1839
|
|
|
@@ -1845,11 +1845,11 @@ svc-page-navigator-item,
|
|
|
1845
1845
|
[style*="direction:rtl"] .svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):focus .svc-page-navigator-item__banner,
|
|
1846
1846
|
[style*="direction: rtl"] .svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):hover .svc-page-navigator-item__banner,
|
|
1847
1847
|
[style*="direction: rtl"] .svc-page-navigator-item-content:not(.svc-page-navigator-item--selected):focus .svc-page-navigator-item__banner {
|
|
1848
|
-
padding: 0 calc(2.5 * var(--base-unit, 8px)) 0 calc(4.5 * var(--base-unit, 8px));
|
|
1848
|
+
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)));
|
|
1849
1849
|
}
|
|
1850
1850
|
|
|
1851
1851
|
.svc-page-navigator-item--disabled .svc-page-navigator-item__banner {
|
|
1852
|
-
color: var(--foreground, #161616);
|
|
1852
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
1853
1853
|
opacity: 0.25;
|
|
1854
1854
|
}
|
|
1855
1855
|
svc-page {
|
|
@@ -1857,48 +1857,48 @@ svc-page {
|
|
|
1857
1857
|
}
|
|
1858
1858
|
|
|
1859
1859
|
.svc-page {
|
|
1860
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
1860
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1861
1861
|
}
|
|
1862
1862
|
.svc-page .sd-page__title {
|
|
1863
|
-
margin: calc(2.5 * var(--base-unit, 8px)) 0 0 0;
|
|
1863
|
+
margin: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 0 0;
|
|
1864
1864
|
}
|
|
1865
1865
|
|
|
1866
1866
|
.svc-page__content {
|
|
1867
1867
|
position: relative;
|
|
1868
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(0 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
1868
|
+
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)));
|
|
1869
1869
|
box-sizing: border-box;
|
|
1870
1870
|
width: 100%;
|
|
1871
1871
|
outline: none;
|
|
1872
1872
|
}
|
|
1873
1873
|
.svc-page__content .sd-page {
|
|
1874
1874
|
margin: 0;
|
|
1875
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
1875
|
+
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)));
|
|
1876
1876
|
}
|
|
1877
1877
|
|
|
1878
1878
|
.svc-page__content-actions {
|
|
1879
1879
|
position: absolute;
|
|
1880
1880
|
display: none;
|
|
1881
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
1881
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1882
1882
|
inset-inline-end: 0;
|
|
1883
|
-
padding: 0 calc(1.5 * var(--base-unit, 8px));
|
|
1883
|
+
padding: 0 calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1884
1884
|
z-index: 1;
|
|
1885
1885
|
}
|
|
1886
1886
|
|
|
1887
1887
|
.svc-page__content:not(.svc-page__content--new):focus,
|
|
1888
1888
|
.svc-hovered.svc-page__content:not(.svc-page__content--new) {
|
|
1889
|
-
background: var(--secondary-
|
|
1889
|
+
background: var(--sjs-secondary-backcolor-semi-light, rgba(255, 152, 20, 0.1));
|
|
1890
1890
|
}
|
|
1891
1891
|
|
|
1892
1892
|
.svc-creator .svc-page .svc-page__content--selected,
|
|
1893
1893
|
.svc-creator .svc-page .svc-page__content--selected:focus,
|
|
1894
1894
|
.svc-hovered {
|
|
1895
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
1895
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1896
1896
|
}
|
|
1897
1897
|
.svc-creator .svc-page .svc-page__content--selected.svc-page__content--selected,
|
|
1898
1898
|
.svc-creator .svc-page .svc-page__content--selected:focus.svc-page__content--selected,
|
|
1899
1899
|
.svc-hovered.svc-page__content--selected {
|
|
1900
|
-
box-shadow: 0 0 0 2px var(--secondary, #ff9814) inset;
|
|
1901
|
-
background: var(--secondary-
|
|
1900
|
+
box-shadow: 0 0 0 2px var(--sjs-secondary-backcolor, var(--secondary, #ff9814)) inset;
|
|
1901
|
+
background: var(--sjs-secondary-backcolor-semi-light, rgba(255, 152, 20, 0.1));
|
|
1902
1902
|
}
|
|
1903
1903
|
.svc-creator .svc-page .svc-page__content--selected.svc-page__content--selected .svc-page__content-actions,
|
|
1904
1904
|
.svc-creator .svc-page .svc-page__content--selected:focus.svc-page__content--selected .svc-page__content-actions,
|
|
@@ -1908,9 +1908,9 @@ svc-page {
|
|
|
1908
1908
|
|
|
1909
1909
|
.svc-page__footer {
|
|
1910
1910
|
overflow: visible;
|
|
1911
|
-
margin-left: calc(3 * var(--base-unit, 8px));
|
|
1912
|
-
margin-right: calc(3 * var(--base-unit, 8px));
|
|
1913
|
-
gap: calc(2 * var(--base-unit, 8px));
|
|
1911
|
+
margin-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1912
|
+
margin-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1913
|
+
gap: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1914
1914
|
}
|
|
1915
1915
|
.svc-page__footer .sv-action {
|
|
1916
1916
|
flex: 1 1 0;
|
|
@@ -1921,38 +1921,38 @@ svc-page {
|
|
|
1921
1921
|
}
|
|
1922
1922
|
|
|
1923
1923
|
.svc-page__add-new-question .svc-text {
|
|
1924
|
-
margin-left: calc(6 * var(--base-unit, 8px));
|
|
1924
|
+
margin-left: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1925
1925
|
}
|
|
1926
1926
|
|
|
1927
1927
|
.svc-page__question-type-selector {
|
|
1928
1928
|
appearance: none;
|
|
1929
1929
|
display: flex;
|
|
1930
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
1931
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
1930
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1931
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1932
1932
|
box-sizing: border-box;
|
|
1933
1933
|
border: none;
|
|
1934
1934
|
border-radius: 2px;
|
|
1935
1935
|
background-color: transparent;
|
|
1936
1936
|
cursor: pointer;
|
|
1937
|
-
margin-inline-end: calc(1 * var(--base-unit, 8px));
|
|
1937
|
+
margin-inline-end: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1938
1938
|
outline: none;
|
|
1939
1939
|
}
|
|
1940
1940
|
.svc-page__question-type-selector use {
|
|
1941
|
-
fill: var(--foreground-light, #909090);
|
|
1941
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
1942
1942
|
}
|
|
1943
1943
|
.svc-page__question-type-selector:hover {
|
|
1944
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
1944
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
1945
1945
|
}
|
|
1946
1946
|
.svc-page__question-type-selector:focus {
|
|
1947
|
-
background-color: var(--sjs-primary-backcolor-light, rgba(25, 179, 148, 0.1));
|
|
1947
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
1948
1948
|
}
|
|
1949
1949
|
|
|
1950
1950
|
.svc-page--drag-over-empty:after {
|
|
1951
1951
|
content: " ";
|
|
1952
1952
|
position: absolute;
|
|
1953
|
-
background: var(--secondary, #ff9814);
|
|
1954
|
-
left: calc(3 * var(--base-unit, 8px));
|
|
1955
|
-
bottom: calc(11 * var(--base-unit, 8px));
|
|
1953
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
1954
|
+
left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1955
|
+
bottom: calc(11 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1956
1956
|
width: calc(100% - 48px);
|
|
1957
1957
|
height: 4px;
|
|
1958
1958
|
}
|
|
@@ -1967,15 +1967,15 @@ svc-page {
|
|
|
1967
1967
|
|
|
1968
1968
|
.svc-row .sd-row--multiple {
|
|
1969
1969
|
overflow: auto;
|
|
1970
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
1971
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
1972
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
1970
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1971
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1972
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1973
1973
|
margin-left: 0;
|
|
1974
1974
|
width: 100%;
|
|
1975
1975
|
flex-wrap: nowrap;
|
|
1976
|
-
background: var(--background, #fff);
|
|
1977
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
1978
|
-
border-radius:
|
|
1976
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
1977
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
1978
|
+
border-radius: calc(1 * var(--sjs-corner-radius, 4px));
|
|
1979
1979
|
}
|
|
1980
1980
|
.svc-row .sd-row--multiple > div {
|
|
1981
1981
|
padding-left: 0;
|
|
@@ -1985,7 +1985,7 @@ svc-page {
|
|
|
1985
1985
|
}
|
|
1986
1986
|
|
|
1987
1987
|
.sd-panel .svc-row .sd-row--multiple {
|
|
1988
|
-
padding: calc(0 * var(--base-unit, 8px));
|
|
1988
|
+
padding: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
1989
1989
|
box-shadow: none;
|
|
1990
1990
|
border-radius: 0;
|
|
1991
1991
|
padding: 2px;
|
|
@@ -1998,12 +1998,12 @@ svc-page {
|
|
|
1998
1998
|
box-shadow: none;
|
|
1999
1999
|
}
|
|
2000
2000
|
.svc-row.svc-row--ghost .sd-row {
|
|
2001
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
2001
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2002
2002
|
}
|
|
2003
2003
|
.svc-row.svc-row--ghost:last-child .sd-row {
|
|
2004
2004
|
height: initial;
|
|
2005
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2006
|
-
margin-bottom: calc(2 * var(--base-unit, 8px));
|
|
2005
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2006
|
+
margin-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2007
2007
|
}
|
|
2008
2008
|
.svc-row.svc-row--ghost + .svc-row .sd-page__row {
|
|
2009
2009
|
margin-top: 0;
|
|
@@ -2011,15 +2011,15 @@ svc-page {
|
|
|
2011
2011
|
|
|
2012
2012
|
.svc-panel .svc-row.svc-row--ghost.svc-row.svc-row--ghost .sd-row {
|
|
2013
2013
|
height: initial;
|
|
2014
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2015
|
-
margin-bottom: calc(2 * var(--base-unit, 8px));
|
|
2014
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2015
|
+
margin-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2016
2016
|
}
|
|
2017
2017
|
|
|
2018
2018
|
.svc-row--drag-over-top:before {
|
|
2019
2019
|
content: " ";
|
|
2020
2020
|
position: absolute;
|
|
2021
2021
|
left: 0;
|
|
2022
|
-
background: var(--secondary, #ff9814);
|
|
2022
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2023
2023
|
top: 6px;
|
|
2024
2024
|
width: 100%;
|
|
2025
2025
|
height: 4px;
|
|
@@ -2029,7 +2029,7 @@ svc-page {
|
|
|
2029
2029
|
content: " ";
|
|
2030
2030
|
position: absolute;
|
|
2031
2031
|
left: 0;
|
|
2032
|
-
background: var(--secondary, #ff9814);
|
|
2032
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2033
2033
|
bottom: -10px;
|
|
2034
2034
|
width: 100%;
|
|
2035
2035
|
height: 4px;
|
|
@@ -2046,13 +2046,13 @@ svc-page {
|
|
|
2046
2046
|
.svc-carry-forward-panel {
|
|
2047
2047
|
box-sizing: border-box;
|
|
2048
2048
|
width: 100%;
|
|
2049
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
2050
|
-
border-radius: calc(1 * var(--base-unit, 8px));
|
|
2049
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2050
|
+
border-radius: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2051
2051
|
background-color: #F8F8F8;
|
|
2052
2052
|
text-align: center;
|
|
2053
2053
|
font-weight: 400;
|
|
2054
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
2055
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
2054
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2055
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2056
2056
|
color: rgba(0, 0, 0, 0.45);
|
|
2057
2057
|
}
|
|
2058
2058
|
|
|
@@ -2100,19 +2100,19 @@ svc-question {
|
|
|
2100
2100
|
position: relative;
|
|
2101
2101
|
width: 100%;
|
|
2102
2102
|
height: 100%;
|
|
2103
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
2103
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2104
2104
|
box-sizing: border-box;
|
|
2105
|
-
padding: calc(4 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
2106
|
-
background: var(--background, #fff);
|
|
2107
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
2105
|
+
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)));
|
|
2106
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2107
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
2108
2108
|
border: 2px solid transparent;
|
|
2109
2109
|
outline: none;
|
|
2110
2110
|
}
|
|
2111
2111
|
|
|
2112
2112
|
.svc-question__content .sd-selectbase:not(.sd-imagepicker) {
|
|
2113
2113
|
overflow-x: auto;
|
|
2114
|
-
padding-left: calc(5 * var(--base-unit, 8px));
|
|
2115
|
-
margin-left: calc(-5 * var(--base-unit, 8px));
|
|
2114
|
+
padding-left: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2115
|
+
margin-left: calc(-5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2116
2116
|
}
|
|
2117
2117
|
.svc-question__content .sd-table .sd-selectbase:not(.sd-imagepicker) {
|
|
2118
2118
|
overflow-x: visible;
|
|
@@ -2120,13 +2120,13 @@ svc-question {
|
|
|
2120
2120
|
margin-left: 0;
|
|
2121
2121
|
}
|
|
2122
2122
|
.svc-question__content .sd-multipletext__item-title {
|
|
2123
|
-
color: var(--foreground, #161616);
|
|
2123
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2124
2124
|
}
|
|
2125
2125
|
.svc-question__content .sd-multipletext__item-container.sd-input:focus-within {
|
|
2126
|
-
box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
2126
|
+
box-shadow: var(--sjs-shadow-inner, inset 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
2127
2127
|
}
|
|
2128
2128
|
.svc-question__content .sd-matrixdynamic__btn.sd-matrixdynamic__add-btn {
|
|
2129
|
-
color: var(--foreground, #161616);
|
|
2129
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2130
2130
|
opacity: 0.25;
|
|
2131
2131
|
}
|
|
2132
2132
|
|
|
@@ -2135,18 +2135,18 @@ svc-question {
|
|
|
2135
2135
|
}
|
|
2136
2136
|
|
|
2137
2137
|
.svc-panel__placeholder {
|
|
2138
|
-
color: var(--foreground-light, #909090);
|
|
2138
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2139
2139
|
}
|
|
2140
2140
|
|
|
2141
2141
|
.svc-question__content-actions {
|
|
2142
2142
|
position: absolute;
|
|
2143
2143
|
display: none;
|
|
2144
|
-
bottom: calc(2 * var(--base-unit, 8px));
|
|
2145
|
-
inset-inline-start: calc(4 * var(--base-unit, 8px));
|
|
2146
|
-
inset-inline-end: calc(3.5 * var(--base-unit, 8px));
|
|
2144
|
+
bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2145
|
+
inset-inline-start: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2146
|
+
inset-inline-end: calc(3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2147
2147
|
}
|
|
2148
2148
|
.svc-question__content-actions .sv-action--convertTo {
|
|
2149
|
-
min-width: calc(13 * var(--base-unit, 8px));
|
|
2149
|
+
min-width: calc(13 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2150
2150
|
max-width: max-content;
|
|
2151
2151
|
}
|
|
2152
2152
|
.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item {
|
|
@@ -2162,7 +2162,7 @@ svc-question {
|
|
|
2162
2162
|
}
|
|
2163
2163
|
.svc-question__content-actions .sv-action--convertTo .sv-action-bar-item__title--with-icon {
|
|
2164
2164
|
margin-inline-start: 0;
|
|
2165
|
-
margin-inline-end: calc(0.5 * var(--base-unit, 8px));
|
|
2165
|
+
margin-inline-end: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2166
2166
|
}
|
|
2167
2167
|
.svc-question__content-actions .sv-action--convertTo.sv-action--hidden {
|
|
2168
2168
|
min-width: 0;
|
|
@@ -2173,12 +2173,12 @@ svc-question {
|
|
|
2173
2173
|
|
|
2174
2174
|
.svc-question__content:focus,
|
|
2175
2175
|
.svc-creator .svc-page .svc-hovered > .svc-question__content {
|
|
2176
|
-
box-shadow: 0 0 0 2px var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2176
|
+
box-shadow: 0 0 0 2px var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
2177
2177
|
}
|
|
2178
2178
|
|
|
2179
2179
|
.svc-creator .svc-page .svc-question__content--selected:not(.svc-question__content--dragged).svc-question__content--selected,
|
|
2180
2180
|
.svc-creator:not(.svc-creator--mobile) .svc-page .svc-hovered > .svc-question__content:not(.svc-question__content--dragged).svc-question__content--selected {
|
|
2181
|
-
box-shadow: 0 0 0 2px var(--secondary, #ff9814);
|
|
2181
|
+
box-shadow: 0 0 0 2px var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2182
2182
|
}
|
|
2183
2183
|
.svc-creator .svc-page .svc-question__content--selected:not(.svc-question__content--dragged) > .svc-question__content-actions,
|
|
2184
2184
|
.svc-creator:not(.svc-creator--mobile) .svc-page .svc-hovered > .svc-question__content:not(.svc-question__content--dragged) > .svc-question__content-actions {
|
|
@@ -2186,31 +2186,31 @@ svc-question {
|
|
|
2186
2186
|
}
|
|
2187
2187
|
|
|
2188
2188
|
.svc-question__content--dragged {
|
|
2189
|
-
background: var(--background-
|
|
2189
|
+
background: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
|
|
2190
2190
|
}
|
|
2191
2191
|
.svc-question__content--dragged .sd-question__title {
|
|
2192
|
-
color: var(--foreground-light, #909090);
|
|
2192
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2193
2193
|
}
|
|
2194
2194
|
.svc-question__content--dragged.svc-question__content--selected .svc-question__content-actions {
|
|
2195
2195
|
display: none;
|
|
2196
2196
|
}
|
|
2197
2197
|
|
|
2198
2198
|
.svc-question__content .sd-question.sd-question--table {
|
|
2199
|
-
margin-top: calc(-1 * var(--base-unit, 8px));
|
|
2200
|
-
padding-top: calc(1 * var(--base-unit, 8px));
|
|
2199
|
+
margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2200
|
+
padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2201
2201
|
}
|
|
2202
2202
|
|
|
2203
2203
|
.svc-dragged-element-shortcut {
|
|
2204
2204
|
min-width: 100px;
|
|
2205
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
2206
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
2207
|
-
background-color: var(--background, #fff);
|
|
2208
|
-
color: var(--foreground, #161616);
|
|
2209
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
2205
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2206
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2207
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2208
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2209
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2210
2210
|
cursor: grabbing;
|
|
2211
2211
|
position: absolute;
|
|
2212
2212
|
z-index: 1000;
|
|
2213
|
-
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
|
|
2213
|
+
box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
|
|
2214
2214
|
-moz-user-select: none;
|
|
2215
2215
|
-webkit-user-select: none;
|
|
2216
2216
|
-ms-user-select: none;
|
|
@@ -2222,33 +2222,33 @@ svc-question {
|
|
|
2222
2222
|
}
|
|
2223
2223
|
|
|
2224
2224
|
.svc-dragged-element-shortcut .sv-svg-icon use {
|
|
2225
|
-
fill: var(--primary, #19b394);
|
|
2225
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2226
2226
|
}
|
|
2227
2227
|
|
|
2228
2228
|
.svc-dragged-element-shortcut--selected {
|
|
2229
|
-
border: 2px solid var(--secondary, #ff9814);
|
|
2229
|
+
border: 2px solid var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2230
2230
|
}
|
|
2231
2231
|
|
|
2232
2232
|
.svc-dragged-element-shortcut__text {
|
|
2233
|
-
font-family: var(--font-family);
|
|
2233
|
+
font-family: var(--font-family, var(--font-family));
|
|
2234
2234
|
font-style: normal;
|
|
2235
2235
|
font-weight: 600;
|
|
2236
|
-
font-size: calc(
|
|
2237
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
2238
|
-
margin-left: calc(4 * var(--base-unit, 8px));
|
|
2239
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
2236
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
2237
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
2238
|
+
margin-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2239
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2240
2240
|
}
|
|
2241
2241
|
|
|
2242
2242
|
.svc-dragged-element-shortcut__icon {
|
|
2243
2243
|
position: absolute;
|
|
2244
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
2245
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
2244
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2245
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2246
2246
|
}
|
|
2247
2247
|
|
|
2248
2248
|
.svc-question__content--drag-over-inside .svc-panel__placeholder_frame,
|
|
2249
2249
|
.svc-hovered > .svc-question__content--drag-over-inside .svc-panel__placeholder_frame {
|
|
2250
|
-
box-shadow: 0 0 0 2px var(--primary, #19b394);
|
|
2251
|
-
background: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
2250
|
+
box-shadow: 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2251
|
+
background: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2252
2252
|
}
|
|
2253
2253
|
.svc-question__content--drag-over-inside .svc-panel__placeholder_frame > .svc-question__content-actions,
|
|
2254
2254
|
.svc-hovered > .svc-question__content--drag-over-inside .svc-panel__placeholder_frame > .svc-question__content-actions {
|
|
@@ -2259,7 +2259,7 @@ svc-question {
|
|
|
2259
2259
|
content: " ";
|
|
2260
2260
|
position: absolute;
|
|
2261
2261
|
left: -7px;
|
|
2262
|
-
background: var(--secondary, #ff9814);
|
|
2262
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2263
2263
|
top: 0;
|
|
2264
2264
|
height: 100%;
|
|
2265
2265
|
width: 4px;
|
|
@@ -2269,7 +2269,7 @@ svc-question {
|
|
|
2269
2269
|
content: " ";
|
|
2270
2270
|
position: absolute;
|
|
2271
2271
|
right: -7px;
|
|
2272
|
-
background: var(--secondary, #ff9814);
|
|
2272
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2273
2273
|
top: 0;
|
|
2274
2274
|
height: 100%;
|
|
2275
2275
|
width: 4px;
|
|
@@ -2279,7 +2279,7 @@ svc-question {
|
|
|
2279
2279
|
content: " ";
|
|
2280
2280
|
position: absolute;
|
|
2281
2281
|
left: 0;
|
|
2282
|
-
background: var(--secondary, #ff9814);
|
|
2282
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2283
2283
|
top: -12px;
|
|
2284
2284
|
width: 100%;
|
|
2285
2285
|
height: 4px;
|
|
@@ -2289,7 +2289,7 @@ svc-question {
|
|
|
2289
2289
|
content: " ";
|
|
2290
2290
|
position: absolute;
|
|
2291
2291
|
left: 0;
|
|
2292
|
-
background: var(--secondary, #ff9814);
|
|
2292
|
+
background: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2293
2293
|
bottom: -12px;
|
|
2294
2294
|
width: 100%;
|
|
2295
2295
|
height: 4px;
|
|
@@ -2374,7 +2374,7 @@ svc-question .sv-action-bar,
|
|
|
2374
2374
|
top: 0;
|
|
2375
2375
|
left: 0;
|
|
2376
2376
|
visibility: hidden;
|
|
2377
|
-
height: calc(3.5 * var(--base-unit, 8px));
|
|
2377
|
+
height: calc(3.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2378
2378
|
width: 100%;
|
|
2379
2379
|
display: flex;
|
|
2380
2380
|
align-items: center;
|
|
@@ -2383,16 +2383,16 @@ svc-question .sv-action-bar,
|
|
|
2383
2383
|
|
|
2384
2384
|
.svc-question__drag-element {
|
|
2385
2385
|
width: 100%;
|
|
2386
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
2386
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2387
2387
|
opacity: 0.5;
|
|
2388
2388
|
}
|
|
2389
2389
|
.svc-question__drag-element use {
|
|
2390
|
-
fill: var(--foreground-light, #909090);
|
|
2390
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2391
2391
|
}
|
|
2392
2392
|
|
|
2393
2393
|
.sd-panel :not(.svc-hovered) > .svc-question__content:not(.svc-question__content--selected),
|
|
2394
2394
|
.sd-row--multiple :not(.svc-hovered) > .svc-question__content:not(.svc-question__content--selected) {
|
|
2395
|
-
border: 1px dashed var(--border, #d6d6d6);
|
|
2395
|
+
border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2396
2396
|
box-shadow: none;
|
|
2397
2397
|
}
|
|
2398
2398
|
.sd-panel .svc-question__content,
|
|
@@ -2410,8 +2410,8 @@ svc-question .sv-action-bar,
|
|
|
2410
2410
|
box-shadow: none;
|
|
2411
2411
|
}
|
|
2412
2412
|
.sd-row--multiple .svc-hovered > .svc-question__content:not(.svc-question__content--selected) {
|
|
2413
|
-
border: 1px solid var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2414
|
-
box-shadow: 0 0 0 1px var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2413
|
+
border: 1px solid var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
2414
|
+
box-shadow: 0 0 0 1px var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
|
|
2415
2415
|
}
|
|
2416
2416
|
|
|
2417
2417
|
.sd-panel .svc-row--ghost.svc-row--ghost .svc-question__content.svc-question__content {
|
|
@@ -2431,15 +2431,15 @@ svc-question .sv-action-bar,
|
|
|
2431
2431
|
}
|
|
2432
2432
|
|
|
2433
2433
|
.svc-panel__placeholder_frame {
|
|
2434
|
-
border: 1px dashed var(--border, #d6d6d6);
|
|
2434
|
+
border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2435
2435
|
width: 100%;
|
|
2436
2436
|
box-sizing: border-box;
|
|
2437
|
-
height: calc(30 * var(--base-unit, 8px));
|
|
2437
|
+
height: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2438
2438
|
display: flex;
|
|
2439
2439
|
align-items: center;
|
|
2440
2440
|
justify-content: center;
|
|
2441
2441
|
flex-direction: column;
|
|
2442
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(8 * var(--base-unit, 8px));
|
|
2442
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2443
2443
|
}
|
|
2444
2444
|
|
|
2445
2445
|
.svc-panel__add-new-question-container {
|
|
@@ -2451,15 +2451,15 @@ svc-question .sv-action-bar,
|
|
|
2451
2451
|
|
|
2452
2452
|
.svc-panel__add-new-question {
|
|
2453
2453
|
align-items: center;
|
|
2454
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2454
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2455
2455
|
margin-left: 0;
|
|
2456
2456
|
margin-right: 0;
|
|
2457
2457
|
width: auto;
|
|
2458
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
2459
|
-
line-height: calc(5 * var(--base-unit, 8px));
|
|
2458
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2459
|
+
line-height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2460
2460
|
vertical-align: baseline;
|
|
2461
2461
|
text-align: center;
|
|
2462
|
-
background-color: var(--background, #fff);
|
|
2462
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2463
2463
|
cursor: pointer;
|
|
2464
2464
|
user-select: none;
|
|
2465
2465
|
border: none;
|
|
@@ -2473,40 +2473,40 @@ svc-question .sv-action-bar,
|
|
|
2473
2473
|
align-items: center;
|
|
2474
2474
|
flex-grow: 1;
|
|
2475
2475
|
justify-content: center;
|
|
2476
|
-
margin: calc(1 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
2477
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
2478
|
-
color: var(--primary, #19b394);
|
|
2476
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2477
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2478
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2479
2479
|
}
|
|
2480
2480
|
|
|
2481
2481
|
.svc-panel__question-type-selector {
|
|
2482
2482
|
appearance: none;
|
|
2483
2483
|
display: flex;
|
|
2484
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
2485
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
2484
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2485
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2486
2486
|
box-sizing: border-box;
|
|
2487
2487
|
border: none;
|
|
2488
2488
|
border-radius: 2px;
|
|
2489
2489
|
background-color: transparent;
|
|
2490
2490
|
cursor: pointer;
|
|
2491
|
-
margin-right: calc(1 * var(--base-unit, 8px));
|
|
2491
|
+
margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2492
2492
|
outline: none;
|
|
2493
|
-
top: calc(2 * var(--base-unit, 8px));
|
|
2493
|
+
top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2494
2494
|
margin: 0;
|
|
2495
2495
|
position: absolute;
|
|
2496
2496
|
right: 0;
|
|
2497
2497
|
}
|
|
2498
2498
|
.svc-panel__question-type-selector use {
|
|
2499
|
-
fill: var(--foreground-light, #909090);
|
|
2499
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2500
2500
|
}
|
|
2501
2501
|
.svc-panel__question-type-selector:hover {
|
|
2502
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
2502
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2503
2503
|
}
|
|
2504
2504
|
.svc-panel__question-type-selector:focus {
|
|
2505
|
-
background-color: var(--sjs-primary-backcolor-light, rgba(25, 179, 148, 0.1));
|
|
2505
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2506
2506
|
}
|
|
2507
2507
|
|
|
2508
2508
|
.sd-panel .svc-row {
|
|
2509
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
2509
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2510
2510
|
}
|
|
2511
2511
|
.sd-panel .svc-row:first-of-type {
|
|
2512
2512
|
margin-top: 0;
|
|
@@ -2528,28 +2528,28 @@ svc-question .sv-action-bar,
|
|
|
2528
2528
|
padding-top: 0;
|
|
2529
2529
|
}
|
|
2530
2530
|
.svc-question__content .sd-table__cell--detail-panel .sd-panel__content {
|
|
2531
|
-
padding-top: calc(1 * var(--base-unit, 8px));
|
|
2531
|
+
padding-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2532
2532
|
}
|
|
2533
2533
|
.svc-question__content .sd-paneldynamic__panel-wrapper {
|
|
2534
2534
|
padding: 0;
|
|
2535
2535
|
}
|
|
2536
2536
|
.svc-question__content .sd-table__cell--actions .sv-action-bar-item:disabled {
|
|
2537
|
-
background: var(--background, #fff);
|
|
2537
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2538
2538
|
opacity: 1;
|
|
2539
2539
|
}
|
|
2540
2540
|
.svc-question__content .sd-table__cell--actions .sv-action-bar-item:disabled use {
|
|
2541
|
-
fill: var(--foreground-light, #909090);
|
|
2541
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2542
2542
|
}
|
|
2543
2543
|
|
|
2544
2544
|
.svc-question__content .svc-carry-forward-panel {
|
|
2545
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2545
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2546
2546
|
}
|
|
2547
2547
|
|
|
2548
2548
|
.svc-question__content--ranking .svc-carry-forward-panel {
|
|
2549
2549
|
margin-top: 0;
|
|
2550
2550
|
}
|
|
2551
2551
|
.svc-question__dropdown-choices {
|
|
2552
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
2552
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2553
2553
|
}
|
|
2554
2554
|
|
|
2555
2555
|
.svc-question__dropdown-choice--collapsed:nth-last-child(1) {
|
|
@@ -2565,14 +2565,14 @@ svc-question .sv-action-bar,
|
|
|
2565
2565
|
}
|
|
2566
2566
|
|
|
2567
2567
|
.svc-question__dropdown-choices--wrapper .svc-action-button {
|
|
2568
|
-
margin-left: calc(6.75 * var(--base-unit, 8px));
|
|
2569
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
2568
|
+
margin-left: calc(6.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2569
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2570
2570
|
cursor: pointer;
|
|
2571
2571
|
}
|
|
2572
2572
|
.svc-image-question-controls {
|
|
2573
2573
|
position: absolute;
|
|
2574
|
-
top: calc(5 * var(--base-unit, 8px));
|
|
2575
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
2574
|
+
top: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2575
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2576
2576
|
display: none;
|
|
2577
2577
|
}
|
|
2578
2578
|
|
|
@@ -2581,7 +2581,7 @@ svc-question .sv-action-bar,
|
|
|
2581
2581
|
}
|
|
2582
2582
|
|
|
2583
2583
|
.svc-question__content--image:not(.svc-question__content--empty) {
|
|
2584
|
-
padding: calc(4 * var(--base-unit, 8px)) 0 calc(8 * var(--base-unit, 8px)) 0;
|
|
2584
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(8 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
2585
2585
|
}
|
|
2586
2586
|
|
|
2587
2587
|
.svc-question__content--image.svc-question__content--empty .sd-file,
|
|
@@ -2605,8 +2605,8 @@ svc-question .sv-action-bar,
|
|
|
2605
2605
|
}
|
|
2606
2606
|
|
|
2607
2607
|
.svc-question__content .sd-rating {
|
|
2608
|
-
margin-inline-start: calc(9 * var(--base-unit, 8px));
|
|
2609
|
-
width: calc(100% - 9 * var(--base-unit, 8px));
|
|
2608
|
+
margin-inline-start: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2609
|
+
width: calc(100% - 9 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2610
2610
|
}
|
|
2611
2611
|
.svc-question__content .sd-question--table .sd-rating {
|
|
2612
2612
|
margin-inline-start: 0;
|
|
@@ -2615,45 +2615,45 @@ svc-question .sv-action-bar,
|
|
|
2615
2615
|
}
|
|
2616
2616
|
.svc-question__content .svc-rating-question-controls {
|
|
2617
2617
|
display: flex;
|
|
2618
|
-
width: calc(8 * var(--base-unit, 8px));
|
|
2618
|
+
width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2619
2619
|
min-width: auto;
|
|
2620
2620
|
justify-content: flex-start;
|
|
2621
2621
|
}
|
|
2622
2622
|
.svc-question__content .sd-rating__item--fixed-size:focus-within {
|
|
2623
2623
|
width: unset;
|
|
2624
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2.5 * var(--base-unit, 8px));
|
|
2624
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2625
2625
|
}
|
|
2626
2626
|
.svc-item-value-wrapper {
|
|
2627
2627
|
position: relative;
|
|
2628
2628
|
display: flex;
|
|
2629
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
2629
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2630
2630
|
align-items: center;
|
|
2631
|
-
margin-left: calc(-5 * var(--base-unit, 8px));
|
|
2631
|
+
margin-left: calc(-5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2632
2632
|
}
|
|
2633
2633
|
|
|
2634
2634
|
.svc-question__dropdown-choice .svc-item-value-wrapper,
|
|
2635
2635
|
.sd-selectbase .svc-item-value-wrapper {
|
|
2636
2636
|
align-items: flex-start;
|
|
2637
|
-
min-width: calc(28 * var(--base-unit, 8px));
|
|
2637
|
+
min-width: calc(28 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2638
2638
|
}
|
|
2639
2639
|
.svc-question__dropdown-choice .svc-item-value__item,
|
|
2640
2640
|
.sd-selectbase .svc-item-value__item {
|
|
2641
|
-
padding-right: calc(1 * var(--base-unit, 8px));
|
|
2641
|
+
padding-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2642
2642
|
}
|
|
2643
2643
|
|
|
2644
2644
|
.svc-question__content .sd-selectbase__column:not(.sd-imagepicker__column):not(:first-of-type) {
|
|
2645
|
-
margin-left: calc(5 * var(--base-unit, 8px));
|
|
2645
|
+
margin-left: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2646
2646
|
}
|
|
2647
2647
|
.svc-question__content .sd-selectbase__column:not(:last-child) {
|
|
2648
2648
|
padding-right: 0;
|
|
2649
2649
|
}
|
|
2650
2650
|
|
|
2651
2651
|
.svc-item-value--dragging {
|
|
2652
|
-
background: var(--background, #fff);
|
|
2653
|
-
box-shadow:
|
|
2654
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
2655
|
-
padding-right: calc(3 * var(--base-unit, 8px));
|
|
2656
|
-
padding-left: calc(0.5 * var(--base-unit, 8px));
|
|
2652
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2653
|
+
box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
|
|
2654
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2655
|
+
padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2656
|
+
padding-left: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2657
2657
|
-moz-user-select: none;
|
|
2658
2658
|
-webkit-user-select: none;
|
|
2659
2659
|
-ms-user-select: none;
|
|
@@ -2662,8 +2662,8 @@ svc-question .sv-action-bar,
|
|
|
2662
2662
|
|
|
2663
2663
|
.svc-item-value-controls {
|
|
2664
2664
|
display: flex;
|
|
2665
|
-
margin: calc(1 * var(--base-unit, 8px)) 0;
|
|
2666
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
2665
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
2666
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2667
2667
|
box-sizing: border-box;
|
|
2668
2668
|
flex-shrink: 0;
|
|
2669
2669
|
min-width: 72px;
|
|
@@ -2672,11 +2672,11 @@ svc-question .sv-action-bar,
|
|
|
2672
2672
|
|
|
2673
2673
|
.svc-item-value-controls__button {
|
|
2674
2674
|
border-radius: 50%;
|
|
2675
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
2675
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2676
2676
|
cursor: pointer;
|
|
2677
2677
|
display: inline-block;
|
|
2678
2678
|
outline: none;
|
|
2679
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
2679
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2680
2680
|
box-sizing: content-box;
|
|
2681
2681
|
}
|
|
2682
2682
|
.svc-item-value-controls__button .sv-svg-icon {
|
|
@@ -2697,7 +2697,7 @@ svc-question .sv-action-bar,
|
|
|
2697
2697
|
}
|
|
2698
2698
|
|
|
2699
2699
|
.svc-item-value-controls__drag {
|
|
2700
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
2700
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2701
2701
|
cursor: move;
|
|
2702
2702
|
opacity: 0.25;
|
|
2703
2703
|
}
|
|
@@ -2705,29 +2705,29 @@ svc-question .sv-action-bar,
|
|
|
2705
2705
|
visibility: hidden;
|
|
2706
2706
|
}
|
|
2707
2707
|
.svc-item-value-controls__drag use {
|
|
2708
|
-
fill: var(--foreground, #161616);
|
|
2708
|
+
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
2709
2709
|
}
|
|
2710
2710
|
|
|
2711
2711
|
.svc-item-value-controls__button--disabled {
|
|
2712
|
-
fill: var(--foreground-light, #909090);
|
|
2712
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2713
2713
|
opacity: 0.25;
|
|
2714
2714
|
cursor: default;
|
|
2715
2715
|
}
|
|
2716
2716
|
|
|
2717
2717
|
.svc-item-value-controls__remove:not(.svc-item-value-controls__button--disabled) use {
|
|
2718
|
-
fill: var(--red, #e60a3e);
|
|
2718
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
2719
2719
|
}
|
|
2720
2720
|
|
|
2721
2721
|
.svc-item-value-controls__add:not(.svc-item-value-controls__button--disabled) use {
|
|
2722
|
-
fill: var(--primary, #19b394);
|
|
2722
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2723
2723
|
}
|
|
2724
2724
|
|
|
2725
2725
|
.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 {
|
|
2726
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
2726
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2727
2727
|
}
|
|
2728
2728
|
|
|
2729
2729
|
.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 {
|
|
2730
|
-
background-color: var(--red-light, rgba(
|
|
2730
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
2731
2731
|
}
|
|
2732
2732
|
|
|
2733
2733
|
.sv-string-editor {
|
|
@@ -2736,13 +2736,13 @@ svc-question .sv-action-bar,
|
|
|
2736
2736
|
|
|
2737
2737
|
.svc-item-value--new .svc-item-value__item .sd-item__control-label,
|
|
2738
2738
|
.svc-item-value--new .svc-item-value__item .sv-ranking-item__text {
|
|
2739
|
-
color: var(--foreground-light, #909090);
|
|
2739
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2740
2740
|
}
|
|
2741
2741
|
.svc-item-value--new .svc-item-value__item .sd-item__decorator {
|
|
2742
2742
|
opacity: 0.35;
|
|
2743
2743
|
}
|
|
2744
2744
|
.svc-item-value--new .sv-ranking-item__index {
|
|
2745
|
-
background: var(--background-dim, #f3f3f3);
|
|
2745
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2746
2746
|
}
|
|
2747
2747
|
.svc-item-value--new .sv-ranking-item__index.sv-ranking-item__index--empty:empty {
|
|
2748
2748
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAACCAYAAABhYU3QAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAaSURBVHgBjcABDQAACAKwa2X6b1Tghxi8UQEkAAB3NR3N2gAAAABJRU5ErkJggg==);
|
|
@@ -2750,7 +2750,7 @@ svc-question .sv-action-bar,
|
|
|
2750
2750
|
|
|
2751
2751
|
.sv-ranking .svc-item-value-wrapper {
|
|
2752
2752
|
align-items: center;
|
|
2753
|
-
min-width: calc(27 * var(--base-unit, 8px));
|
|
2753
|
+
min-width: calc(27 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2754
2754
|
}
|
|
2755
2755
|
.sv-ranking .svc-item-value__item {
|
|
2756
2756
|
padding-right: 0;
|
|
@@ -2803,9 +2803,9 @@ svc-question .sv-action-bar,
|
|
|
2803
2803
|
}
|
|
2804
2804
|
.svc-item-value__ghost {
|
|
2805
2805
|
display: none;
|
|
2806
|
-
background: var(--background-dim, #f3f3f3);
|
|
2807
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
2808
|
-
width: calc(25 * var(--base-unit, 8px));
|
|
2806
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2807
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2808
|
+
width: calc(25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2809
2809
|
height: 40px;
|
|
2810
2810
|
z-index: 11;
|
|
2811
2811
|
position: absolute;
|
|
@@ -2822,12 +2822,12 @@ svc-question .sv-action-bar,
|
|
|
2822
2822
|
}
|
|
2823
2823
|
.svc-image-item-value--new .sd-imagepicker__image {
|
|
2824
2824
|
box-sizing: border-box;
|
|
2825
|
-
border: 1px dashed var(--border, #d6d6d6);
|
|
2825
|
+
border: 1px dashed var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2826
2826
|
}
|
|
2827
2827
|
|
|
2828
2828
|
.svc-image-item-value--file-dragging .sd-imagepicker__image {
|
|
2829
|
-
border: 2px solid var(--primary, #19b394);
|
|
2830
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
2829
|
+
border: 2px solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2830
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2831
2831
|
}
|
|
2832
2832
|
.svc-image-item-value--file-dragging .svc-image-item-value__item {
|
|
2833
2833
|
position: relative;
|
|
@@ -2840,13 +2840,13 @@ svc-question .sv-action-bar,
|
|
|
2840
2840
|
|
|
2841
2841
|
.svc-image-item-value-controls {
|
|
2842
2842
|
position: absolute;
|
|
2843
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
2844
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
2843
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2844
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2845
2845
|
}
|
|
2846
2846
|
|
|
2847
2847
|
.svc-image-item-value--new .svc-image-item-value-controls {
|
|
2848
|
-
top: calc(50% - 3 * var(--base-unit, 8px));
|
|
2849
|
-
left: calc(50% - 3 * var(--base-unit, 8px));
|
|
2848
|
+
top: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2849
|
+
left: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2850
2850
|
}
|
|
2851
2851
|
|
|
2852
2852
|
.svc-image-item-value--new .svc-image-item-value-controls__button {
|
|
@@ -2854,11 +2854,11 @@ svc-question .sv-action-bar,
|
|
|
2854
2854
|
}
|
|
2855
2855
|
|
|
2856
2856
|
.svc-image-item-value-controls__add use {
|
|
2857
|
-
fill: var(--primary, #19b394);
|
|
2857
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
2858
2858
|
}
|
|
2859
2859
|
|
|
2860
2860
|
.svc-image-item-value-controls__add:hover, .svc-image-item-value-controls__add:focus {
|
|
2861
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
2861
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
2862
2862
|
}
|
|
2863
2863
|
|
|
2864
2864
|
.svc-choose-file-input {
|
|
@@ -2877,8 +2877,8 @@ svc-question .sv-action-bar,
|
|
|
2877
2877
|
display: none;
|
|
2878
2878
|
cursor: move;
|
|
2879
2879
|
position: absolute;
|
|
2880
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
2881
|
-
left: calc(1 * var(--base-unit, 8px));
|
|
2880
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2881
|
+
left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2882
2882
|
}
|
|
2883
2883
|
|
|
2884
2884
|
.svc-question__content--selected .svc-image-item-value-wrapper:hover .svc-image-item-value-controls__drag-area-indicator {
|
|
@@ -2894,31 +2894,31 @@ svc-question .sv-action-bar,
|
|
|
2894
2894
|
|
|
2895
2895
|
.svc-image-item-value-wrapper__ghost {
|
|
2896
2896
|
display: none;
|
|
2897
|
-
background: var(--background-dim, #f3f3f3);
|
|
2897
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
2898
2898
|
}
|
|
2899
2899
|
|
|
2900
2900
|
.svc-image-item-value--single {
|
|
2901
2901
|
width: 100%;
|
|
2902
2902
|
}
|
|
2903
2903
|
.svc-image-item-value--single .sd-imagepicker__image {
|
|
2904
|
-
height: calc(30 * var(--base-unit, 8px));
|
|
2904
|
+
height: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2905
2905
|
}
|
|
2906
2906
|
.svc-matrix-cell {
|
|
2907
2907
|
position: relative;
|
|
2908
2908
|
}
|
|
2909
2909
|
|
|
2910
2910
|
.sd-table thead tr th .svc-matrix-cell {
|
|
2911
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
2911
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2912
2912
|
}
|
|
2913
2913
|
|
|
2914
2914
|
.svc-matrix-cell--selected {
|
|
2915
2915
|
position: absolute;
|
|
2916
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--secondary, #ff9814);
|
|
2917
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
2918
|
-
top: calc(0 * var(--base-unit, 8px));
|
|
2919
|
-
left: calc(0 * var(--base-unit, 8px));
|
|
2920
|
-
right: calc(0 * var(--base-unit, 8px));
|
|
2921
|
-
bottom: calc(0 * var(--base-unit, 8px));
|
|
2916
|
+
border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
2917
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2918
|
+
top: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2919
|
+
left: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2920
|
+
right: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2921
|
+
bottom: calc(0 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2922
2922
|
display: none;
|
|
2923
2923
|
}
|
|
2924
2924
|
.svc-matrix-cell--selected.svc-visible {
|
|
@@ -2926,32 +2926,32 @@ svc-question .sv-action-bar,
|
|
|
2926
2926
|
}
|
|
2927
2927
|
|
|
2928
2928
|
.svc-hovered > .svc-matrix-cell--selected:not(.svc-visible) {
|
|
2929
|
-
border: calc(0.25 * var(--base-unit, 8px)) solid var(--secondary-light, rgba(255, 152, 20, 0.25));
|
|
2930
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
2929
|
+
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)));
|
|
2930
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2931
2931
|
display: block;
|
|
2932
2932
|
}
|
|
2933
2933
|
|
|
2934
2934
|
.svc-matrix-cell__question-controls {
|
|
2935
2935
|
display: none;
|
|
2936
2936
|
position: absolute;
|
|
2937
|
-
top: calc(50% - 3 * var(--base-unit, 8px));
|
|
2938
|
-
left: calc(50% - 3 * var(--base-unit, 8px));
|
|
2937
|
+
top: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2938
|
+
left: calc(50% - 3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2939
2939
|
z-index: 2;
|
|
2940
2940
|
}
|
|
2941
2941
|
|
|
2942
2942
|
.svc-matrix-cell__question-controls-button {
|
|
2943
2943
|
display: block;
|
|
2944
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
2945
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
2946
|
-
background: var(--background, #fff);
|
|
2947
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
2944
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2945
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2946
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2947
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
2948
2948
|
box-sizing: border-box;
|
|
2949
2949
|
border-radius: 50%;
|
|
2950
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
2950
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2951
2951
|
cursor: pointer;
|
|
2952
2952
|
}
|
|
2953
2953
|
.svc-matrix-cell__question-controls-button use {
|
|
2954
|
-
fill: var(--foreground-light, #909090);
|
|
2954
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2955
2955
|
}
|
|
2956
2956
|
|
|
2957
2957
|
.svc-matrix-cell:hover .svc-matrix-cell__question-controls {
|
|
@@ -2959,13 +2959,13 @@ svc-question .sv-action-bar,
|
|
|
2959
2959
|
}
|
|
2960
2960
|
|
|
2961
2961
|
.svc-question__content--in-popup {
|
|
2962
|
-
width: calc(100% - 25 * var(--base-unit, 8px));
|
|
2963
|
-
min-width: calc(70 * var(--base-unit, 8px));
|
|
2964
|
-
padding: calc(5 * var(--base-unit, 8px));
|
|
2962
|
+
width: calc(100% - 25 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2963
|
+
min-width: calc(70 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2964
|
+
padding: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2965
2965
|
}
|
|
2966
2966
|
|
|
2967
2967
|
.svc-matrix-cell__popup .sv-popup__scrolling-content {
|
|
2968
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
2968
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2969
2969
|
padding-top: 0;
|
|
2970
2970
|
}
|
|
2971
2971
|
.svc-matrix-cell__popup .svc-question__content {
|
|
@@ -2982,31 +2982,31 @@ svc-question .sv-action-bar,
|
|
|
2982
2982
|
font-family: var(--font-family);
|
|
2983
2983
|
width: 80%;
|
|
2984
2984
|
margin: auto;
|
|
2985
|
-
margin-bottom: calc(5 * var(--base-unit, 8px));
|
|
2986
|
-
background-color: var(--background, #fff);
|
|
2987
|
-
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
|
|
2985
|
+
margin-bottom: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2986
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
2987
|
+
box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
|
|
2988
2988
|
border-radius: 4px;
|
|
2989
2989
|
}
|
|
2990
2990
|
.svd-test-results .svd-test-results__header {
|
|
2991
2991
|
display: flex;
|
|
2992
2992
|
justify-content: space-between;
|
|
2993
2993
|
align-items: center;
|
|
2994
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
2995
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
2996
|
-
color: var(--foreground-light, #909090);
|
|
2997
|
-
border-bottom: 2px solid var(--border-light, #eaeaea);
|
|
2994
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2995
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
2996
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
2997
|
+
border-bottom: 2px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
2998
2998
|
}
|
|
2999
2999
|
.svd-test-results .svd-test-results__header .svd-test-results__header-text {
|
|
3000
3000
|
margin: 0;
|
|
3001
3001
|
}
|
|
3002
3002
|
.svd-test-results .svd-test-results__header .svd-test-results__header-types {
|
|
3003
3003
|
display: flex;
|
|
3004
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
3004
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3005
3005
|
}
|
|
3006
3006
|
.svd-test-results .svd-test-results__text {
|
|
3007
3007
|
display: flex;
|
|
3008
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3009
|
-
width: calc(100% - (6 * var(--base-unit, 8px)));
|
|
3008
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3009
|
+
width: calc(100% - (6 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
3010
3010
|
overflow: auto;
|
|
3011
3011
|
user-select: text;
|
|
3012
3012
|
white-space: pre-wrap;
|
|
@@ -3020,34 +3020,34 @@ svc-question .sv-action-bar,
|
|
|
3020
3020
|
}
|
|
3021
3021
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker {
|
|
3022
3022
|
position: absolute;
|
|
3023
|
-
top: calc(1.5 * var(--base-unit, 8px));
|
|
3023
|
+
top: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3024
3024
|
}
|
|
3025
3025
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker .sv-svg-icon {
|
|
3026
3026
|
transition: transform 0.2s ease-in-out;
|
|
3027
3027
|
}
|
|
3028
3028
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker .sv-svg-icon use {
|
|
3029
|
-
fill: var(--foreground-light, #909090);
|
|
3029
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3030
3030
|
}
|
|
3031
3031
|
.svd-test-results .svd-test-results__table table .svd-test-results__marker.svd-test-results__marker--expanded .sv-svg-icon {
|
|
3032
3032
|
transform-origin: center;
|
|
3033
3033
|
transform: rotate(90deg);
|
|
3034
3034
|
}
|
|
3035
3035
|
.svd-test-results .svd-test-results__table table th {
|
|
3036
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
3037
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3036
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3037
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3038
3038
|
text-align: left;
|
|
3039
3039
|
font-weight: 600;
|
|
3040
3040
|
font-size: 12px;
|
|
3041
|
-
color: var(--foreground-light, #909090);
|
|
3041
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3042
3042
|
}
|
|
3043
3043
|
.svd-test-results .svd-test-results__table table th:nth-child(1) {
|
|
3044
|
-
padding-left: calc(3 * var(--base-unit, 8px));
|
|
3044
|
+
padding-left: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3045
3045
|
}
|
|
3046
3046
|
.svd-test-results .svd-test-results__table table td {
|
|
3047
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
3048
|
-
max-width: calc(50 * var(--base-unit, 8px));
|
|
3047
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3048
|
+
max-width: calc(50 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3049
3049
|
overflow: auto;
|
|
3050
|
-
border-top: 2px solid var(--border-light, #eaeaea);
|
|
3050
|
+
border-top: 2px solid var(--sjs-border-light, var(--border-light, #eaeaea));
|
|
3051
3051
|
user-select: text;
|
|
3052
3052
|
}
|
|
3053
3053
|
.svd-test-results .svd-test-results__table table td:nth-child(1) {
|
|
@@ -3057,7 +3057,7 @@ svc-question .sv-action-bar,
|
|
|
3057
3057
|
}
|
|
3058
3058
|
.svd-test-results .svd-test-results__table table td:nth-child(2) {
|
|
3059
3059
|
width: 50%;
|
|
3060
|
-
padding-right: calc(3 * var(--base-unit, 8px));
|
|
3060
|
+
padding-right: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3061
3061
|
}
|
|
3062
3062
|
.svd-test-results .svd-test-results__table table .survey-result-value {
|
|
3063
3063
|
word-break: break-all;
|
|
@@ -3066,11 +3066,11 @@ svc-question .sv-action-bar,
|
|
|
3066
3066
|
vertical-align: top;
|
|
3067
3067
|
}
|
|
3068
3068
|
.svd-test-results .svd-test-results__table table tr .svd-test-results__node-value {
|
|
3069
|
-
color: var(--foreground-light, #909090);
|
|
3069
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3070
3070
|
}
|
|
3071
3071
|
.svc-designer-header .sd-container-modern__title {
|
|
3072
3072
|
gap: 0;
|
|
3073
|
-
column-gap: calc(6 * var(--base-unit, 8px));
|
|
3073
|
+
column-gap: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3074
3074
|
}
|
|
3075
3075
|
|
|
3076
3076
|
.svc-logo-image {
|
|
@@ -3083,39 +3083,39 @@ svc-question .sv-action-bar,
|
|
|
3083
3083
|
}
|
|
3084
3084
|
.svc-logo-image .svc-image-item-value-controls {
|
|
3085
3085
|
display: block;
|
|
3086
|
-
top: calc(2.5 * var(--base-unit, 8px));
|
|
3087
|
-
right: calc(1.5 * var(--base-unit, 8px));
|
|
3086
|
+
top: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3087
|
+
right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3088
3088
|
}
|
|
3089
3089
|
|
|
3090
3090
|
.svc-logo-image-placeholder {
|
|
3091
|
-
font-size: calc(4 * var(--base-unit, 8px));
|
|
3092
|
-
color: var(--foreground-light, #909090);
|
|
3091
|
+
font-size: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3092
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3093
3093
|
opacity: 0.25;
|
|
3094
3094
|
white-space: nowrap;
|
|
3095
3095
|
word-break: keep-all;
|
|
3096
3096
|
padding: 0;
|
|
3097
|
-
width: calc(8 * var(--base-unit, 8px));
|
|
3098
|
-
height: calc(8 * var(--base-unit, 8px));
|
|
3097
|
+
width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3098
|
+
height: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3099
3099
|
display: flex;
|
|
3100
3100
|
justify-content: center;
|
|
3101
3101
|
align-items: center;
|
|
3102
|
-
margin-right: calc(-2 * var(--base-unit, 8px));
|
|
3103
|
-
border-radius: calc(4 * var(--base-unit, 8px));
|
|
3102
|
+
margin-right: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3103
|
+
border-radius: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3104
3104
|
}
|
|
3105
3105
|
.svc-logo-image-placeholder:hover {
|
|
3106
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3106
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3107
3107
|
opacity: unset;
|
|
3108
3108
|
}
|
|
3109
3109
|
.svc-logo-image-placeholder:hover use {
|
|
3110
|
-
fill: var(--primary, #19b394);
|
|
3110
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3111
3111
|
}
|
|
3112
3112
|
.svc-logo-image-placeholder svg {
|
|
3113
|
-
width: calc(4 * var(--base-unit, 8px));
|
|
3114
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
3113
|
+
width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3114
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3115
3115
|
}
|
|
3116
3116
|
|
|
3117
3117
|
.svc-logo-image-placeholder use {
|
|
3118
|
-
fill: var(--foreground-light, #909090);
|
|
3118
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3119
3119
|
}
|
|
3120
3120
|
|
|
3121
3121
|
.svc-logo-image-container {
|
|
@@ -3152,21 +3152,21 @@ svc-question .sv-action-bar,
|
|
|
3152
3152
|
}
|
|
3153
3153
|
|
|
3154
3154
|
.svc-link-value-button {
|
|
3155
|
-
margin-left: calc(-2 * var(--base-unit, 8px));
|
|
3155
|
+
margin-left: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3156
3156
|
}
|
|
3157
3157
|
|
|
3158
3158
|
.svc-question-link__clear-button {
|
|
3159
|
-
color: var(--red, #e60a3e);
|
|
3159
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
3160
3160
|
font-weight: 600;
|
|
3161
3161
|
cursor: pointer;
|
|
3162
3162
|
}
|
|
3163
3163
|
|
|
3164
3164
|
.svc-question-link__clear-button:focus,
|
|
3165
3165
|
.svc-question-link__clear-button:hover {
|
|
3166
|
-
background-color: var(--red-light, rgba(
|
|
3166
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
3167
3167
|
}
|
|
3168
3168
|
.svc-property-panel__item {
|
|
3169
|
-
margin: calc(2 * var(--base-unit, 8px)) 0;
|
|
3169
|
+
margin: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
3170
3170
|
width: 100%;
|
|
3171
3171
|
}
|
|
3172
3172
|
.svc-property-panel__group {
|
|
@@ -3174,67 +3174,67 @@ svc-question .sv-action-bar,
|
|
|
3174
3174
|
-moz-appearance: none;
|
|
3175
3175
|
appearance: none;
|
|
3176
3176
|
width: 100%;
|
|
3177
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
3177
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3178
3178
|
border: none;
|
|
3179
3179
|
outline: none;
|
|
3180
|
-
color: var(--foreground-light, #909090);
|
|
3180
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3181
3181
|
cursor: pointer;
|
|
3182
3182
|
text-align: left;
|
|
3183
|
-
background: var(--background, #fff);
|
|
3184
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
3183
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3184
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3185
3185
|
font-family: var(--font-family);
|
|
3186
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3186
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3187
3187
|
}
|
|
3188
3188
|
|
|
3189
3189
|
.svc-property-panel__group:disabled,
|
|
3190
3190
|
.svc-property-panel__group:disabled:hover {
|
|
3191
|
-
background-color: var(--background, #fff);
|
|
3192
|
-
color: var(--foreground, #161616);
|
|
3191
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3192
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3193
3193
|
opacity: 0.25;
|
|
3194
3194
|
cursor: default;
|
|
3195
3195
|
}
|
|
3196
3196
|
|
|
3197
3197
|
.svc-property-panel__group:hover {
|
|
3198
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3199
|
-
color: var(--foreground-light, #909090);
|
|
3198
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3199
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3200
3200
|
font-weight: 400;
|
|
3201
3201
|
}
|
|
3202
3202
|
|
|
3203
3203
|
.svc-property-panel__group--active,
|
|
3204
3204
|
.svc-property-panel__group--active:hover {
|
|
3205
|
-
color: var(--foreground, #161616);
|
|
3205
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3206
3206
|
font-weight: 600;
|
|
3207
|
-
background-color: var(--background, #fff);
|
|
3207
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3208
3208
|
}
|
|
3209
3209
|
.svc-tabbed-menu-item {
|
|
3210
|
-
padding: calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3211
|
-
height: calc(8 * var(--base-unit, 8px));
|
|
3212
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
3210
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3211
|
+
height: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3212
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3213
3213
|
box-sizing: border-box;
|
|
3214
3214
|
cursor: pointer;
|
|
3215
3215
|
}
|
|
3216
3216
|
.svc-tabbed-menu-item:hover, .svc-tabbed-menu-item:focus {
|
|
3217
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3218
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
3217
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3218
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3219
3219
|
outline: none;
|
|
3220
3220
|
}
|
|
3221
3221
|
|
|
3222
3222
|
.svc-tabbed-menu-item--selected {
|
|
3223
|
-
background: var(--background, #fff);
|
|
3224
|
-
box-shadow: inset 0px -2px 0px var(--primary, #19b394);
|
|
3223
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3224
|
+
box-shadow: inset 0px -2px 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3225
3225
|
}
|
|
3226
3226
|
.svc-tabbed-menu-item--selected:hover, .svc-tabbed-menu-item--selected:focus {
|
|
3227
|
-
background: var(--background, #fff);
|
|
3228
|
-
box-shadow: inset 0px -2px 0px var(--primary, #19b394);
|
|
3227
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3228
|
+
box-shadow: inset 0px -2px 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3229
3229
|
}
|
|
3230
3230
|
|
|
3231
3231
|
.svc-tabbed-menu-item--disabled {
|
|
3232
3232
|
cursor: default;
|
|
3233
|
-
color: var(--foreground, #161616);
|
|
3233
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3234
3234
|
opacity: 0.25;
|
|
3235
3235
|
}
|
|
3236
3236
|
.svc-tabbed-menu-item--disabled:hover {
|
|
3237
|
-
background-color: var(--background, #fff);
|
|
3237
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3238
3238
|
}
|
|
3239
3239
|
|
|
3240
3240
|
.svc-tabbed-menu-item--hidden {
|
|
@@ -3243,7 +3243,7 @@ svc-question .sv-action-bar,
|
|
|
3243
3243
|
|
|
3244
3244
|
.svc-tabbed-menu-item .svc-tabbed-menu-item__text {
|
|
3245
3245
|
white-space: nowrap;
|
|
3246
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
3246
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3247
3247
|
}
|
|
3248
3248
|
|
|
3249
3249
|
.svc-tabbed-menu-item-container .sv-dots__item {
|
|
@@ -3254,7 +3254,7 @@ svc-question .sv-action-bar,
|
|
|
3254
3254
|
white-space: nowrap;
|
|
3255
3255
|
overflow: hidden;
|
|
3256
3256
|
align-items: center;
|
|
3257
|
-
height: calc(8 * var(--base-unit, 8px));
|
|
3257
|
+
height: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3258
3258
|
}
|
|
3259
3259
|
|
|
3260
3260
|
.svc-tabbed-menu-wrapper {
|
|
@@ -3267,19 +3267,19 @@ svc-question .sv-action-bar,
|
|
|
3267
3267
|
align-items: center;
|
|
3268
3268
|
z-index: 20;
|
|
3269
3269
|
outline: none;
|
|
3270
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
3270
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3271
3271
|
}
|
|
3272
3272
|
.svc-toolbox__item sv-svg-icon,
|
|
3273
3273
|
.svc-toolbox__item .sv-svg-icon {
|
|
3274
3274
|
display: block;
|
|
3275
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
3275
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3276
3276
|
}
|
|
3277
3277
|
|
|
3278
3278
|
.svc-toolbox__item-container {
|
|
3279
3279
|
outline: none;
|
|
3280
3280
|
}
|
|
3281
3281
|
.svc-toolbox__item-container .sv-svg-icon use {
|
|
3282
|
-
fill: var(--foreground-light, #909090);
|
|
3282
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3283
3283
|
}
|
|
3284
3284
|
|
|
3285
3285
|
.svc-toolbox__item-banner {
|
|
@@ -3288,19 +3288,19 @@ svc-question .sv-action-bar,
|
|
|
3288
3288
|
box-sizing: border-box;
|
|
3289
3289
|
align-items: center;
|
|
3290
3290
|
margin-right: 0;
|
|
3291
|
-
margin-left: calc(-1.5 * var(--base-unit, 8px));
|
|
3291
|
+
margin-left: calc(-1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3292
3292
|
}
|
|
3293
3293
|
.svc-toolbox__item-banner .svc-toolbox__item-icon {
|
|
3294
3294
|
position: absolute;
|
|
3295
3295
|
display: block;
|
|
3296
|
-
left: calc(1.5 * var(--base-unit, 8px));
|
|
3297
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
3296
|
+
left: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3297
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3298
3298
|
}
|
|
3299
3299
|
.svc-toolbox__item-banner .svc-toolbox__item-title {
|
|
3300
|
-
color: var(--foreground, #161616);
|
|
3300
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3301
3301
|
}
|
|
3302
3302
|
.svc-toolbox__item-banner .sv-svg-icon use {
|
|
3303
|
-
fill: var(--primary, #19b394);
|
|
3303
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3304
3304
|
}
|
|
3305
3305
|
|
|
3306
3306
|
.svc-creator__toolbox--right .svc-toolbox__item:hover .svc-toolbox__item-banner,
|
|
@@ -3312,11 +3312,11 @@ svc-question .sv-action-bar,
|
|
|
3312
3312
|
[style*="direction: rtl"] .svc-toolbox__item:hover .svc-toolbox__item-banner,
|
|
3313
3313
|
[style*="direction: rtl"] .svc-toolbox__item:focus .svc-toolbox__item-banner {
|
|
3314
3314
|
flex-direction: row-reverse;
|
|
3315
|
-
padding-right: calc(1.5 * var(--base-unit, 8px));
|
|
3316
|
-
padding-left: calc(2 * var(--base-unit, 8px));
|
|
3315
|
+
padding-right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3316
|
+
padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3317
3317
|
margin-left: 0;
|
|
3318
3318
|
margin-right: 0;
|
|
3319
|
-
transform: translateX(calc(1.5 * var(--base-unit, 8px)));
|
|
3319
|
+
transform: translateX(calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
3320
3320
|
}
|
|
3321
3321
|
.svc-creator__toolbox--right .svc-toolbox__item:hover .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3322
3322
|
.svc-creator__toolbox--right .svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
@@ -3326,8 +3326,8 @@ svc-question .sv-action-bar,
|
|
|
3326
3326
|
[style*="direction:rtl"] .svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3327
3327
|
[style*="direction: rtl"] .svc-toolbox__item:hover .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3328
3328
|
[style*="direction: rtl"] .svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title {
|
|
3329
|
-
padding-left: calc(1 * var(--base-unit, 8px));
|
|
3330
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
3329
|
+
padding-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3330
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3331
3331
|
}
|
|
3332
3332
|
.svc-creator__toolbox--right .svc-toolbox__item,
|
|
3333
3333
|
[dir=rtl] .svc-toolbox__item,
|
|
@@ -3358,61 +3358,61 @@ svc-question .sv-action-bar,
|
|
|
3358
3358
|
[style*="direction:rtl"] .svc-toolbox__item-banner .svc-toolbox__item-icon,
|
|
3359
3359
|
[style*="direction: rtl"] .svc-toolbox__item-banner .svc-toolbox__item-icon {
|
|
3360
3360
|
left: auto;
|
|
3361
|
-
right: calc(1.5 * var(--base-unit, 8px));
|
|
3361
|
+
right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3362
3362
|
}
|
|
3363
3363
|
|
|
3364
3364
|
.svc-toolbox__item-title {
|
|
3365
|
-
font-family: var(--font-family);
|
|
3365
|
+
font-family: var(--font-family, var(--font-family));
|
|
3366
3366
|
font-style: normal;
|
|
3367
3367
|
font-weight: 600;
|
|
3368
|
-
font-size: calc(
|
|
3369
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
3368
|
+
font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
3369
|
+
line-height: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
|
|
3370
3370
|
display: block;
|
|
3371
|
-
padding-left: calc(1 * var(--base-unit, 8px));
|
|
3372
|
-
padding-right: calc(1.5 * var(--base-unit, 8px));
|
|
3371
|
+
padding-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3372
|
+
padding-right: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3373
3373
|
white-space: nowrap;
|
|
3374
|
-
color: var(--foreground-light, #909090);
|
|
3374
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3375
3375
|
}
|
|
3376
3376
|
|
|
3377
3377
|
.svc-toolbox__item:hover .svc-toolbox__item-banner,
|
|
3378
3378
|
.svc-toolbox__item:focus .svc-toolbox__item-banner {
|
|
3379
|
-
max-width: calc(100 * var(--base-unit, 8px));
|
|
3380
|
-
padding-left: calc(1.5 * var(--base-unit, 8px));
|
|
3381
|
-
padding-right: calc(2 * var(--base-unit, 8px));
|
|
3379
|
+
max-width: calc(100 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3380
|
+
padding-left: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3381
|
+
padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3382
3382
|
opacity: 1;
|
|
3383
3383
|
}
|
|
3384
3384
|
.svc-toolbox__item:hover .svc-toolbox__item-banner .svc-toolbox__item-title,
|
|
3385
3385
|
.svc-toolbox__item:focus .svc-toolbox__item-banner .svc-toolbox__item-title {
|
|
3386
|
-
padding-left: calc(4 * var(--base-unit, 8px));
|
|
3386
|
+
padding-left: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3387
3387
|
}
|
|
3388
3388
|
|
|
3389
3389
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):focus,
|
|
3390
3390
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):hover {
|
|
3391
3391
|
overflow: hidden;
|
|
3392
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3393
|
-
background-color: var(--background, #fff);
|
|
3394
|
-
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
|
|
3392
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3393
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3394
|
+
box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
|
|
3395
3395
|
transition: 0.1s ease-in-out;
|
|
3396
3396
|
}
|
|
3397
3397
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):focus .svc-toolbox__item-title,
|
|
3398
3398
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):hover .svc-toolbox__item-title {
|
|
3399
|
-
color: var(--foreground, #161616);
|
|
3399
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3400
3400
|
}
|
|
3401
3401
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):focus .sv-svg-icon use,
|
|
3402
3402
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__item:not(.sv-dots):hover .sv-svg-icon use {
|
|
3403
|
-
fill: var(--primary, #19b394);
|
|
3403
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3404
3404
|
}
|
|
3405
3405
|
|
|
3406
3406
|
.svc-toolbox__tool .sv-dots__item:hover:enabled,
|
|
3407
3407
|
.svc-toolbox__tool .sv-dots__item:focus:enabled,
|
|
3408
3408
|
.svc-toolbox__tool .sv-dots__item.sv-action-bar-item--pressed {
|
|
3409
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3410
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3409
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3410
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3411
3411
|
}
|
|
3412
3412
|
.svc-toolbox__tool .sv-dots__item:hover:enabled .sv-svg-icon use,
|
|
3413
3413
|
.svc-toolbox__tool .sv-dots__item:focus:enabled .sv-svg-icon use,
|
|
3414
3414
|
.svc-toolbox__tool .sv-dots__item.sv-action-bar-item--pressed .sv-svg-icon use {
|
|
3415
|
-
fill: var(--primary, #19b394);
|
|
3415
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3416
3416
|
}
|
|
3417
3417
|
|
|
3418
3418
|
[dir=rtl] .svc-toolbox-popup,
|
|
@@ -3425,24 +3425,24 @@ svc-question .sv-action-bar,
|
|
|
3425
3425
|
display: none;
|
|
3426
3426
|
}
|
|
3427
3427
|
.svc-toolbox-popup .sv-list__item .sv-list__item-body {
|
|
3428
|
-
padding-top: calc(1.5 * var(--base-unit, 8px));
|
|
3429
|
-
padding-bottom: calc(1.5 * var(--base-unit, 8px));
|
|
3430
|
-
padding-inline-start: calc(2 * var(--base-unit, 8px));
|
|
3431
|
-
padding-inline-end: calc(5 * var(--base-unit, 8px));
|
|
3428
|
+
padding-top: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3429
|
+
padding-bottom: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3430
|
+
padding-inline-start: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3431
|
+
padding-inline-end: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3432
3432
|
}
|
|
3433
3433
|
|
|
3434
3434
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots),
|
|
3435
3435
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover,
|
|
3436
3436
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots),
|
|
3437
3437
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover {
|
|
3438
|
-
color: var(--foreground, #161616);
|
|
3438
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3439
3439
|
opacity: 0.5;
|
|
3440
3440
|
}
|
|
3441
3441
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots) .sv-svg-icon use,
|
|
3442
3442
|
.svc-toolbox .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover .sv-svg-icon use,
|
|
3443
3443
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots) .sv-svg-icon use,
|
|
3444
3444
|
.svc-toolbox:not(.svc-toolbox--compact) .svc-toolbox__tool--pressed .svc-toolbox__item:not(.sv-dots):hover .sv-svg-icon use {
|
|
3445
|
-
fill: var(--foreground, #161616);
|
|
3445
|
+
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3446
3446
|
opacity: 0.5;
|
|
3447
3447
|
}
|
|
3448
3448
|
svc-toolbox {
|
|
@@ -3453,14 +3453,14 @@ svc-toolbox {
|
|
|
3453
3453
|
|
|
3454
3454
|
.svc-toolbox {
|
|
3455
3455
|
height: 100%;
|
|
3456
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
3456
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3457
3457
|
box-sizing: border-box;
|
|
3458
3458
|
overflow-y: auto;
|
|
3459
3459
|
direction: rtl;
|
|
3460
3460
|
}
|
|
3461
3461
|
|
|
3462
3462
|
.svc-toolbox--compact {
|
|
3463
|
-
width: calc(10.5 * var(--base-unit, 8px));
|
|
3463
|
+
width: calc(10.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3464
3464
|
overflow: visible;
|
|
3465
3465
|
direction: ltr;
|
|
3466
3466
|
}
|
|
@@ -3481,25 +3481,25 @@ svc-toolbox {
|
|
|
3481
3481
|
}
|
|
3482
3482
|
|
|
3483
3483
|
.svc-toolbox__tool .sv-dots__item {
|
|
3484
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
3485
|
-
margin-top: calc(0.5 * var(--base-unit, 8px));
|
|
3484
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3485
|
+
margin-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3486
3486
|
}
|
|
3487
3487
|
|
|
3488
3488
|
.svc-toolbox__category-separator {
|
|
3489
3489
|
height: 1px;
|
|
3490
|
-
width: calc(6 * var(--base-unit, 8px));
|
|
3491
|
-
background-color: var(--border, #d6d6d6);
|
|
3492
|
-
margin: calc(1 * var(--base-unit, 8px)) 0 calc(1.5 * var(--base-unit, 8px));
|
|
3490
|
+
width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3491
|
+
background-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3492
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0 calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3493
3493
|
}
|
|
3494
3494
|
|
|
3495
3495
|
.svc-toolbox__category-header {
|
|
3496
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
3497
|
-
padding: calc(1.5 * var(--base-unit, 8px));
|
|
3498
|
-
background: var(--background-dim, #f3f3f3);
|
|
3499
|
-
border-bottom: 1px solid var(--border, #d6d6d6);
|
|
3496
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3497
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3498
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3499
|
+
border-bottom: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3500
3500
|
box-sizing: border-box;
|
|
3501
3501
|
width: 100%;
|
|
3502
|
-
min-width: calc(20 * var(--base-unit, 8px));
|
|
3502
|
+
min-width: calc(20 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3503
3503
|
position: relative;
|
|
3504
3504
|
}
|
|
3505
3505
|
|
|
@@ -3509,23 +3509,23 @@ svc-toolbox {
|
|
|
3509
3509
|
|
|
3510
3510
|
.svc-toolbox__category-title {
|
|
3511
3511
|
font-family: var(--font-family);
|
|
3512
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
3512
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3513
3513
|
font-weight: bold;
|
|
3514
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
3515
|
-
color: var(--foreground, #161616);
|
|
3514
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3515
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3516
3516
|
vertical-align: middle;
|
|
3517
3517
|
display: block;
|
|
3518
3518
|
}
|
|
3519
3519
|
|
|
3520
3520
|
.svc-toolbox__category-header__controls {
|
|
3521
3521
|
position: absolute;
|
|
3522
|
-
right: calc(1 * var(--base-unit, 8px));
|
|
3523
|
-
top: calc(1 * var(--base-unit, 8px));
|
|
3522
|
+
right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3523
|
+
top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3524
3524
|
display: none;
|
|
3525
3525
|
}
|
|
3526
3526
|
|
|
3527
3527
|
.svc-toolbox__category-header__button {
|
|
3528
|
-
fill: var(--foreground-light, #909090);
|
|
3528
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3529
3529
|
}
|
|
3530
3530
|
|
|
3531
3531
|
.svc-toolbox__category-header:hover .svc-toolbox__category-header__controls {
|
|
@@ -3537,7 +3537,7 @@ svc-toolbox {
|
|
|
3537
3537
|
}
|
|
3538
3538
|
.svc-toolbox__tool .sv-action__content {
|
|
3539
3539
|
display: flex;
|
|
3540
|
-
padding-top: calc(0.5 * var(--base-unit, 8px));
|
|
3540
|
+
padding-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3541
3541
|
flex-direction: column;
|
|
3542
3542
|
align-items: flex-start;
|
|
3543
3543
|
}
|
|
@@ -3577,9 +3577,9 @@ svc-toolbox {
|
|
|
3577
3577
|
}
|
|
3578
3578
|
|
|
3579
3579
|
.svc-side-bar__container-header {
|
|
3580
|
-
background: var(--background, #fff);
|
|
3581
|
-
box-shadow: inset 0px -2px 0px var(--primary, #19b394);
|
|
3582
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3580
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3581
|
+
box-shadow: inset 0px -2px 0px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3582
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3583
3583
|
display: flex;
|
|
3584
3584
|
}
|
|
3585
3585
|
|
|
@@ -3587,9 +3587,9 @@ svc-toolbox {
|
|
|
3587
3587
|
display: flex;
|
|
3588
3588
|
flex-direction: column;
|
|
3589
3589
|
align-items: flex-start;
|
|
3590
|
-
height: calc(100% - (8 * var(--base-unit, 8px)));
|
|
3590
|
+
height: calc(100% - (8 * var(--sjs-base-unit, var(--base-unit, 8px))));
|
|
3591
3591
|
overflow-y: auto;
|
|
3592
|
-
background-color: var(--background, #fff);
|
|
3592
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3593
3593
|
}
|
|
3594
3594
|
|
|
3595
3595
|
.svc-side-bar__container-container {
|
|
@@ -3597,24 +3597,24 @@ svc-toolbox {
|
|
|
3597
3597
|
flex-direction: column;
|
|
3598
3598
|
align-items: flex-start;
|
|
3599
3599
|
width: 100%;
|
|
3600
|
-
padding: 0px calc(2 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3600
|
+
padding: 0px calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3601
3601
|
box-sizing: border-box;
|
|
3602
|
-
background: var(--background-dim, #f3f3f3);
|
|
3603
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
3602
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3603
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3604
3604
|
}
|
|
3605
3605
|
|
|
3606
3606
|
.svc-side-bar__container-title {
|
|
3607
3607
|
display: flex;
|
|
3608
|
-
line-height: calc(4.5 * var(--base-unit, 8px));
|
|
3608
|
+
line-height: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3609
3609
|
flex-grow: 1;
|
|
3610
3610
|
flex-shrink: 0;
|
|
3611
3611
|
justify-content: flex-end;
|
|
3612
|
-
padding: calc(1.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3612
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3613
3613
|
}
|
|
3614
3614
|
|
|
3615
3615
|
.svc-side-bar__container-actions {
|
|
3616
3616
|
width: 100%;
|
|
3617
|
-
padding: calc(1.5 * var(--base-unit, 8px)) calc(1 * var(--base-unit, 8px));
|
|
3617
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3618
3618
|
}
|
|
3619
3619
|
.svc-side-bar__container-actions .sv-action-bar {
|
|
3620
3620
|
justify-content: flex-end;
|
|
@@ -3627,9 +3627,9 @@ svc-toolbox {
|
|
|
3627
3627
|
|
|
3628
3628
|
.svc-flex-column.svc-side-bar__wrapper {
|
|
3629
3629
|
width: auto;
|
|
3630
|
-
border-left: 1px solid var(--border, #d6d6d6);
|
|
3630
|
+
border-left: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3631
3631
|
height: 100%;
|
|
3632
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3632
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3633
3633
|
}
|
|
3634
3634
|
|
|
3635
3635
|
.svc-side-bar {
|
|
@@ -3641,7 +3641,7 @@ svc-toolbox {
|
|
|
3641
3641
|
overflow: visible;
|
|
3642
3642
|
}
|
|
3643
3643
|
.svc-flyout-side-bar .svc-side-bar__shadow {
|
|
3644
|
-
background-color: var(--foreground-light, #909090);
|
|
3644
|
+
background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3645
3645
|
opacity: 0.75;
|
|
3646
3646
|
position: absolute;
|
|
3647
3647
|
top: 0;
|
|
@@ -3689,12 +3689,12 @@ svc-toolbox {
|
|
|
3689
3689
|
.sv-mobile-side-bar .svc-side-bar__container-title {
|
|
3690
3690
|
display: block;
|
|
3691
3691
|
font-weight: bold;
|
|
3692
|
-
font-size: calc(3 * var(--base-unit, 8px));
|
|
3693
|
-
line-height: calc(4 * var(--base-unit, 8px));
|
|
3692
|
+
font-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3693
|
+
line-height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3694
3694
|
flex: unset;
|
|
3695
3695
|
}
|
|
3696
3696
|
.sv-mobile-side-bar .svc-side-bar__wrapper {
|
|
3697
|
-
top: calc(2 * var(--base-unit, 8px));
|
|
3697
|
+
top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3698
3698
|
background: none;
|
|
3699
3699
|
}
|
|
3700
3700
|
.sv-mobile-side-bar .svc-side-bar__container {
|
|
@@ -3703,20 +3703,20 @@ svc-toolbox {
|
|
|
3703
3703
|
}
|
|
3704
3704
|
.sv-mobile-side-bar .svc-side-bar__container-header {
|
|
3705
3705
|
border: unset;
|
|
3706
|
-
box-shadow: 0px calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3707
|
-
border-radius: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) 0px 0px;
|
|
3706
|
+
box-shadow: 0px calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3707
|
+
border-radius: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) 0px 0px;
|
|
3708
3708
|
}
|
|
3709
3709
|
.sv-mobile-side-bar .svc-side-bar__container-content {
|
|
3710
|
-
height: calc(100% - 20 * var(--base-unit, 8px));
|
|
3711
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3710
|
+
height: calc(100% - 20 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3711
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3712
3712
|
}
|
|
3713
3713
|
.sv-mobile-side-bar .svc-side-bar__container-close {
|
|
3714
3714
|
display: flex;
|
|
3715
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
3715
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
3716
3716
|
}
|
|
3717
3717
|
.sv-mobile-side-bar .svc-side-bar__container-close .svc-side-bar__container-close-button {
|
|
3718
3718
|
width: 100%;
|
|
3719
|
-
margin: calc(2 * var(--base-unit, 8px));
|
|
3719
|
+
margin: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3720
3720
|
}
|
|
3721
3721
|
|
|
3722
3722
|
.svc-side-bar .svc-toolbox {
|
|
@@ -3725,7 +3725,7 @@ svc-toolbox {
|
|
|
3725
3725
|
.spg-action-bar {
|
|
3726
3726
|
display: flex;
|
|
3727
3727
|
box-sizing: content-box;
|
|
3728
|
-
padding-right: calc(0.5 * var(--base-unit, 8px));
|
|
3728
|
+
padding-right: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3729
3729
|
position: relative;
|
|
3730
3730
|
align-items: center;
|
|
3731
3731
|
margin-left: auto;
|
|
@@ -3741,46 +3741,46 @@ svc-toolbox {
|
|
|
3741
3741
|
-moz-appearance: none;
|
|
3742
3742
|
appearance: none;
|
|
3743
3743
|
display: flex;
|
|
3744
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
3744
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3745
3745
|
box-sizing: border-box;
|
|
3746
3746
|
border: none;
|
|
3747
|
-
color: var(--primary, #19b394);
|
|
3747
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3748
3748
|
font-weight: 600;
|
|
3749
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3750
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3749
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3750
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3751
3751
|
font-family: var(--font-family);
|
|
3752
|
-
border-radius: calc(12.5 * var(--base-unit, 8px));
|
|
3752
|
+
border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3753
3753
|
background-color: transparent;
|
|
3754
3754
|
cursor: pointer;
|
|
3755
3755
|
}
|
|
3756
3756
|
.spg-action-button:hover, .spg-action-button:focus {
|
|
3757
3757
|
opacity: 1;
|
|
3758
3758
|
outline: none;
|
|
3759
|
-
background-color: var(--primary-light, rgba(25, 179, 148, 0.1));
|
|
3759
|
+
background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
|
|
3760
3760
|
}
|
|
3761
3761
|
.spg-action-button:hover use, .spg-action-button:focus use {
|
|
3762
|
-
fill: var(--primary, #19b394);
|
|
3762
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3763
3763
|
}
|
|
3764
3764
|
|
|
3765
3765
|
.spg-action-button__icon {
|
|
3766
3766
|
display: block;
|
|
3767
3767
|
}
|
|
3768
3768
|
.spg-action-button__icon use {
|
|
3769
|
-
fill: var(--foreground-light, #909090);
|
|
3769
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3770
3770
|
}
|
|
3771
3771
|
|
|
3772
3772
|
.spg-action-button--danger {
|
|
3773
|
-
color: var(--red, #e60a3e);
|
|
3773
|
+
color: var(--sjs-special-red, var(--red, #e60a3e));
|
|
3774
3774
|
}
|
|
3775
3775
|
.spg-action-button--danger:hover, .spg-action-button--danger:focus {
|
|
3776
|
-
background-color: var(--red-light, rgba(
|
|
3776
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
3777
3777
|
}
|
|
3778
3778
|
.spg-action-button--danger:hover use, .spg-action-button--danger:focus use {
|
|
3779
|
-
fill: var(--red, #e60a3e);
|
|
3779
|
+
fill: var(--sjs-special-red, var(--red, #e60a3e));
|
|
3780
3780
|
}
|
|
3781
3781
|
|
|
3782
3782
|
button.spg-action-button--large {
|
|
3783
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3783
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3784
3784
|
}
|
|
3785
3785
|
|
|
3786
3786
|
.spg-action-button:disabled {
|
|
@@ -3798,7 +3798,7 @@ button.spg-action-button--large {
|
|
|
3798
3798
|
}
|
|
3799
3799
|
|
|
3800
3800
|
.spg-action-button--text {
|
|
3801
|
-
padding: calc(0.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3801
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3802
3802
|
}
|
|
3803
3803
|
|
|
3804
3804
|
.spg-question {
|
|
@@ -3815,18 +3815,18 @@ button.spg-action-button--large {
|
|
|
3815
3815
|
.spg-question__title {
|
|
3816
3816
|
width: 100%;
|
|
3817
3817
|
margin: 0;
|
|
3818
|
-
padding: calc(1 * var(--base-unit, 8px)) 0;
|
|
3819
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3820
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3818
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
3819
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3820
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3821
3821
|
font-family: var(--font-family);
|
|
3822
|
-
color: var(--foreground-light, #909090);
|
|
3822
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3823
3823
|
font-weight: normal;
|
|
3824
3824
|
box-sizing: border-box;
|
|
3825
3825
|
}
|
|
3826
3826
|
|
|
3827
3827
|
.spg-question__content {
|
|
3828
3828
|
width: 100%;
|
|
3829
|
-
color: var(--primary, #19b394);
|
|
3829
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3830
3830
|
cursor: pointer;
|
|
3831
3831
|
}
|
|
3832
3832
|
|
|
@@ -3846,40 +3846,40 @@ button.spg-action-button--large {
|
|
|
3846
3846
|
align-items: flex-end;
|
|
3847
3847
|
padding: 0px;
|
|
3848
3848
|
font-family: var(--font-family);
|
|
3849
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
3850
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
3851
|
-
color: var(--foreground-light, #909090);
|
|
3849
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3850
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3851
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3852
3852
|
position: absolute;
|
|
3853
|
-
inset-inline-end: calc(0.75 * var(--base-unit, 8px));
|
|
3854
|
-
inset-block-end: calc(0.5 * var(--base-unit, 8px));
|
|
3853
|
+
inset-inline-end: calc(0.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3854
|
+
inset-block-end: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3855
3855
|
}
|
|
3856
3856
|
|
|
3857
3857
|
.spg-question__description {
|
|
3858
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3859
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3860
|
-
color: var(--foreground, #161616);
|
|
3861
|
-
padding-bottom: calc(2 * var(--base-unit, 8px));
|
|
3858
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3859
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3860
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3861
|
+
padding-bottom: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3862
3862
|
white-space: normal;
|
|
3863
3863
|
}
|
|
3864
3864
|
|
|
3865
3865
|
.spg-row-narrow__question {
|
|
3866
|
-
margin-top: calc(-2 * var(--base-unit, 8px));
|
|
3866
|
+
margin-top: calc(-2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3867
3867
|
}
|
|
3868
3868
|
|
|
3869
3869
|
.spg-row--multiple > div > .spg-row-narrow__question {
|
|
3870
|
-
margin-top: calc(-1 * var(--base-unit, 8px));
|
|
3870
|
+
margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3871
3871
|
}
|
|
3872
3872
|
|
|
3873
3873
|
.spg-question--location--left {
|
|
3874
3874
|
flex-direction: row;
|
|
3875
|
-
background: var(--background, #fff);
|
|
3876
|
-
box-shadow: inset 0 0 0 1px var(--border-inside, rgba(0, 0, 0, 0.16));
|
|
3877
|
-
line-height: calc(6 * var(--base-unit, 8px));
|
|
3875
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3876
|
+
box-shadow: inset 0 0 0 1px var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
|
|
3877
|
+
line-height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3878
3878
|
vertical-align: middle;
|
|
3879
3879
|
align-items: stretch;
|
|
3880
3880
|
}
|
|
3881
3881
|
.spg-question--location--left:focus-within {
|
|
3882
|
-
box-shadow: inset 0 0 0 2px var(--primary, #19b394);
|
|
3882
|
+
box-shadow: inset 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3883
3883
|
}
|
|
3884
3884
|
|
|
3885
3885
|
.spg-question__header--location--left {
|
|
@@ -3891,8 +3891,8 @@ button.spg-action-button--large {
|
|
|
3891
3891
|
align-items: center;
|
|
3892
3892
|
}
|
|
3893
3893
|
.spg-question__header--location--left .spg-question__title {
|
|
3894
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3895
|
-
border-right: 1px solid var(--border, #d6d6d6);
|
|
3894
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3895
|
+
border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
3896
3896
|
display: inline-block;
|
|
3897
3897
|
}
|
|
3898
3898
|
|
|
@@ -3910,48 +3910,48 @@ button.spg-action-button--large {
|
|
|
3910
3910
|
|
|
3911
3911
|
.spg-row--multiple {
|
|
3912
3912
|
display: flex;
|
|
3913
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
3913
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3914
3914
|
flex-wrap: wrap;
|
|
3915
3915
|
}
|
|
3916
3916
|
.spg-row--multiple > div {
|
|
3917
3917
|
flex-grow: 1;
|
|
3918
|
-
min-width: calc(25.5 * var(--base-unit, 8px));
|
|
3918
|
+
min-width: calc(25.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3919
3919
|
}
|
|
3920
3920
|
.spg-row--multiple > div .spg-question__header--location--left {
|
|
3921
|
-
min-width: calc(8 * var(--base-unit, 8px));
|
|
3921
|
+
min-width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3922
3922
|
}
|
|
3923
3923
|
.spg-row--multiple > div input {
|
|
3924
|
-
min-width: max(17 * var(--base-unit, 8px), 100%);
|
|
3924
|
+
min-width: max(17 * var(--sjs-base-unit, var(--base-unit, 8px)), 100%);
|
|
3925
3925
|
width: 0;
|
|
3926
3926
|
}
|
|
3927
3927
|
|
|
3928
3928
|
.spg-question__erbox {
|
|
3929
|
-
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));
|
|
3930
|
-
color: var(--foreground, #161616);
|
|
3931
|
-
background-color: var(--red-light, rgba(
|
|
3932
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
3933
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3929
|
+
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)));
|
|
3930
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3931
|
+
background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
|
|
3932
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3933
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3934
3934
|
}
|
|
3935
3935
|
.spg-question__erbox > div {
|
|
3936
3936
|
display: flex;
|
|
3937
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
3937
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3938
3938
|
}
|
|
3939
3939
|
|
|
3940
3940
|
.spg-question__erbox-icon {
|
|
3941
3941
|
display: block;
|
|
3942
3942
|
flex-grow: 0;
|
|
3943
3943
|
flex-shrink: 0;
|
|
3944
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
3945
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
3946
|
-
background-size: calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
3944
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3945
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3946
|
+
background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3947
3947
|
background-repeat: no-repeat;
|
|
3948
3948
|
background-position: 0 0;
|
|
3949
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
3949
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3950
3950
|
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");
|
|
3951
3951
|
}
|
|
3952
3952
|
|
|
3953
3953
|
.spg-question__erbox--location--bottom {
|
|
3954
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
3954
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3955
3955
|
}
|
|
3956
3956
|
|
|
3957
3957
|
.spg-input {
|
|
@@ -3959,63 +3959,63 @@ button.spg-action-button--large {
|
|
|
3959
3959
|
-moz-appearance: none;
|
|
3960
3960
|
appearance: none;
|
|
3961
3961
|
display: block;
|
|
3962
|
-
background-color: var(--background, #fff);
|
|
3962
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
3963
3963
|
box-sizing: border-box;
|
|
3964
3964
|
width: 100%;
|
|
3965
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
3965
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3966
3966
|
border: none;
|
|
3967
|
-
box-shadow: inset 0 0 0 1px var(--border-inside, rgba(0, 0, 0, 0.16));
|
|
3968
|
-
padding: calc(1.5 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
3967
|
+
box-shadow: inset 0 0 0 1px var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
|
|
3968
|
+
padding: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3969
3969
|
outline: none;
|
|
3970
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
3970
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3971
3971
|
font-family: var(--font-family);
|
|
3972
|
-
color: var(--foreground, #161616);
|
|
3972
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3973
3973
|
}
|
|
3974
3974
|
|
|
3975
3975
|
.spg-input::placeholder {
|
|
3976
|
-
color: var(--foreground-light, #909090);
|
|
3976
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
3977
3977
|
}
|
|
3978
3978
|
|
|
3979
3979
|
.spg-input:focus,
|
|
3980
3980
|
.spg-input.spg-dropdown:focus,
|
|
3981
3981
|
.spg-input.spg-dropdown:focus-within,
|
|
3982
3982
|
.spg-input-container:focus-within {
|
|
3983
|
-
box-shadow: inset 0 0 0 2px var(--primary, #19b394);
|
|
3983
|
+
box-shadow: inset 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
3984
3984
|
}
|
|
3985
3985
|
|
|
3986
3986
|
.spg-input:disabled,
|
|
3987
3987
|
.spg-input:disabled::placeholder {
|
|
3988
|
-
color: var(--foreground, #161616);
|
|
3988
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
3989
3989
|
opacity: 0.25;
|
|
3990
3990
|
}
|
|
3991
3991
|
|
|
3992
3992
|
.spg-input[type=color] {
|
|
3993
3993
|
padding-left: 0;
|
|
3994
3994
|
padding-right: 0;
|
|
3995
|
-
min-width: calc(8 * var(--base-unit, 8px));
|
|
3995
|
+
min-width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
3996
3996
|
}
|
|
3997
3997
|
|
|
3998
3998
|
.spg-input__edit-button {
|
|
3999
3999
|
position: relative;
|
|
4000
4000
|
box-sizing: border-box;
|
|
4001
4001
|
appearance: none;
|
|
4002
|
-
background: var(--background, #fff);
|
|
4002
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4003
4003
|
border: none;
|
|
4004
4004
|
outline: none;
|
|
4005
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
4006
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
4007
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
4005
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4006
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4007
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4008
4008
|
line-height: 0;
|
|
4009
4009
|
}
|
|
4010
4010
|
.spg-input__edit-button:hover {
|
|
4011
|
-
background: var(--background-dim, #f3f3f3);
|
|
4011
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4012
4012
|
}
|
|
4013
4013
|
.spg-input__edit-button:active {
|
|
4014
4014
|
opacity: 0.5;
|
|
4015
4015
|
}
|
|
4016
4016
|
.spg-input__edit-button:disabled {
|
|
4017
4017
|
opacity: 0.25;
|
|
4018
|
-
background: var(--background, #fff);
|
|
4018
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4019
4019
|
}
|
|
4020
4020
|
.spg-input__edit-button svg {
|
|
4021
4021
|
height: 24px;
|
|
@@ -4024,43 +4024,43 @@ button.spg-action-button--large {
|
|
|
4024
4024
|
}
|
|
4025
4025
|
|
|
4026
4026
|
.spg-input.spg-input--error {
|
|
4027
|
-
box-shadow: 0 0 0 1px inset var(--red, #e60a3e);
|
|
4027
|
+
box-shadow: 0 0 0 1px inset var(--sjs-special-red, var(--red, #e60a3e));
|
|
4028
4028
|
}
|
|
4029
4029
|
|
|
4030
4030
|
.spg-input-container {
|
|
4031
4031
|
display: flex;
|
|
4032
4032
|
justify-content: space-between;
|
|
4033
4033
|
cursor: default;
|
|
4034
|
-
padding: calc(0.5 * var(--base-unit, 8px));
|
|
4034
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4035
4035
|
align-items: center;
|
|
4036
|
-
gap: calc(0.5 * var(--base-unit, 8px));
|
|
4037
|
-
box-shadow: 0 0 0 1px inset var(--border-inside, rgba(0, 0, 0, 0.16));
|
|
4036
|
+
gap: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4037
|
+
box-shadow: 0 0 0 1px inset var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
|
|
4038
4038
|
}
|
|
4039
4039
|
|
|
4040
4040
|
.spg-input-container__input {
|
|
4041
4041
|
flex-grow: 1;
|
|
4042
4042
|
width: 100%;
|
|
4043
|
-
padding: calc(1 * var(--base-unit, 8px)) calc(1.5 * var(--base-unit, 8px));
|
|
4044
|
-
color: var(--foreground, #161616);
|
|
4045
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4043
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4044
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4045
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4046
4046
|
font-family: var(--font-family);
|
|
4047
4047
|
outline: none;
|
|
4048
4048
|
border: none;
|
|
4049
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4049
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4050
4050
|
background-color: transparent;
|
|
4051
4051
|
}
|
|
4052
4052
|
|
|
4053
4053
|
.spg-input-container__buttons-container {
|
|
4054
4054
|
display: flex;
|
|
4055
|
-
gap: calc(0.5 * var(--base-unit, 8px));
|
|
4055
|
+
gap: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4056
4056
|
}
|
|
4057
4057
|
|
|
4058
4058
|
.spg-dropdown {
|
|
4059
4059
|
border-radius: 0;
|
|
4060
4060
|
display: flex;
|
|
4061
|
-
padding-right: calc(5.5 * var(--base-unit, 8px));
|
|
4061
|
+
padding-right: calc(5.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4062
4062
|
line-height: normal;
|
|
4063
|
-
background-position: right calc(1.625 * var(--base-unit, 8px)) top 50%, 0 0;
|
|
4063
|
+
background-position: right calc(1.625 * var(--sjs-base-unit, var(--base-unit, 8px))) top 50%, 0 0;
|
|
4064
4064
|
}
|
|
4065
4065
|
|
|
4066
4066
|
.spg-dropdown__filter-string-input {
|
|
@@ -4068,11 +4068,11 @@ button.spg-action-button--large {
|
|
|
4068
4068
|
}
|
|
4069
4069
|
|
|
4070
4070
|
.spg-comment {
|
|
4071
|
-
height: calc(9 * var(--base-unit, 8px));
|
|
4071
|
+
height: calc(9 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4072
4072
|
max-width: 100%;
|
|
4073
|
-
min-width: calc(6 * var(--base-unit, 8px));
|
|
4074
|
-
min-height: calc(6 * var(--base-unit, 8px));
|
|
4075
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4073
|
+
min-width: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4074
|
+
min-height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4075
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4076
4076
|
}
|
|
4077
4077
|
|
|
4078
4078
|
.spg-panel__title {
|
|
@@ -4081,34 +4081,34 @@ button.spg-action-button--large {
|
|
|
4081
4081
|
appearance: none;
|
|
4082
4082
|
box-sizing: border-box;
|
|
4083
4083
|
width: 100%;
|
|
4084
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
4084
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4085
4085
|
border: none;
|
|
4086
4086
|
outline: none;
|
|
4087
|
-
color: var(--foreground-light, #909090);
|
|
4087
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4088
4088
|
cursor: pointer;
|
|
4089
4089
|
text-align: left;
|
|
4090
|
-
background-color: var(--background, #fff);
|
|
4091
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
4090
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4091
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4092
4092
|
font-family: var(--font-family);
|
|
4093
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4093
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4094
4094
|
font-weight: 400;
|
|
4095
4095
|
margin: 0;
|
|
4096
4096
|
}
|
|
4097
4097
|
|
|
4098
4098
|
.spg-panel__title:disabled,
|
|
4099
4099
|
.spg-panel__title:disabled:hover {
|
|
4100
|
-
color: var(--foreground, #161616);
|
|
4100
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4101
4101
|
opacity: 0.25;
|
|
4102
4102
|
cursor: default;
|
|
4103
4103
|
}
|
|
4104
4104
|
|
|
4105
4105
|
.spg-panel__title--expandable:not(.spg-panel__title[aria-expanded=true]):hover, .spg-panel__title--expandable:not(.spg-panel__title[aria-expanded=true]):focus {
|
|
4106
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
4106
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4107
4107
|
}
|
|
4108
4108
|
|
|
4109
4109
|
.spg-panel__title[aria-expanded=true],
|
|
4110
4110
|
.spg-panel__title--expanded {
|
|
4111
|
-
color: var(--foreground, #161616);
|
|
4111
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4112
4112
|
font-weight: 600;
|
|
4113
4113
|
}
|
|
4114
4114
|
|
|
@@ -4117,27 +4117,27 @@ button.spg-action-button--large {
|
|
|
4117
4117
|
flex-direction: column;
|
|
4118
4118
|
align-items: flex-start;
|
|
4119
4119
|
width: 100%;
|
|
4120
|
-
padding: 0 calc(4 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px));
|
|
4120
|
+
padding: 0 calc(4 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4121
4121
|
box-sizing: border-box;
|
|
4122
|
-
background: var(--background-dim, #f3f3f3);
|
|
4123
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
4122
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4123
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4124
4124
|
}
|
|
4125
4125
|
|
|
4126
4126
|
.spg-panel__content .spg-row {
|
|
4127
4127
|
width: 100%;
|
|
4128
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
4128
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4129
4129
|
}
|
|
4130
4130
|
.spg-panel__content .spg-row--multiple {
|
|
4131
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4131
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4132
4132
|
}
|
|
4133
4133
|
|
|
4134
4134
|
.sv-mobile-side-bar .spg-panel__content {
|
|
4135
|
-
padding: 0 calc(2 * var(--base-unit, 8px)) calc(5 * var(--base-unit, 8px));
|
|
4135
|
+
padding: 0 calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4136
4136
|
}
|
|
4137
4137
|
|
|
4138
4138
|
.spg-checkbox {
|
|
4139
4139
|
cursor: pointer;
|
|
4140
|
-
margin-top: calc(2 * var(--base-unit, 8px));
|
|
4140
|
+
margin-top: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4141
4141
|
}
|
|
4142
4142
|
|
|
4143
4143
|
.spg-checkbox--disabled {
|
|
@@ -4147,36 +4147,36 @@ button.spg-action-button--large {
|
|
|
4147
4147
|
cursor: default;
|
|
4148
4148
|
}
|
|
4149
4149
|
.spg-checkbox--disabled .spg-checkbox__caption {
|
|
4150
|
-
color: var(--foreground-light, #909090);
|
|
4150
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4151
4151
|
}
|
|
4152
4152
|
|
|
4153
4153
|
.spg-checkbox__caption {
|
|
4154
4154
|
font-family: var(--font-family);
|
|
4155
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4156
|
-
color: var(--foreground, #161616);
|
|
4157
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4155
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4156
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4157
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4158
4158
|
}
|
|
4159
4159
|
|
|
4160
4160
|
.spg-checkbox__rectangle {
|
|
4161
|
-
background: var(--background, #fff);
|
|
4162
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
4161
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4162
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4163
4163
|
box-sizing: border-box;
|
|
4164
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4165
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4164
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4165
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4166
4166
|
flex-shrink: 0;
|
|
4167
4167
|
padding: 1px 1px;
|
|
4168
4168
|
}
|
|
4169
4169
|
|
|
4170
4170
|
.spg-checkbox:hover .spg-checkbox__rectangle {
|
|
4171
|
-
background-color: var(--background-dim, #f3f3f3);
|
|
4171
|
+
background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4172
4172
|
}
|
|
4173
4173
|
|
|
4174
4174
|
.spg-checkbox--disabled .spg-checkbox__rectangle:hover {
|
|
4175
|
-
background: var(--background, #fff);
|
|
4175
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4176
4176
|
}
|
|
4177
4177
|
|
|
4178
4178
|
.spg-checkbox__control:focus + .spg-checkbox__rectangle {
|
|
4179
|
-
outline: 2px solid var(--primary, #19b394);
|
|
4179
|
+
outline: 2px solid var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4180
4180
|
outline-offset: -2px;
|
|
4181
4181
|
}
|
|
4182
4182
|
|
|
@@ -4186,15 +4186,15 @@ button.spg-action-button--large {
|
|
|
4186
4186
|
|
|
4187
4187
|
.spg-checkbox--checked .spg-checkbox__svg {
|
|
4188
4188
|
display: block;
|
|
4189
|
-
width: calc(2.5 * var(--base-unit, 8px));
|
|
4190
|
-
height: calc(2.5 * var(--base-unit, 8px));
|
|
4189
|
+
width: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4190
|
+
height: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4191
4191
|
background-repeat: no-repeat;
|
|
4192
|
-
background-size: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px));
|
|
4193
|
-
fill: var(--primary, #19b394);
|
|
4192
|
+
background-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4193
|
+
fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4194
4194
|
}
|
|
4195
4195
|
|
|
4196
4196
|
.spg-checkbox--disabled.spg-checkbox--checked .spg-checkbox__svg {
|
|
4197
|
-
fill: var(--border, #d6d6d6);
|
|
4197
|
+
fill: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4198
4198
|
}
|
|
4199
4199
|
|
|
4200
4200
|
.spg-checkbox__control {
|
|
@@ -4219,30 +4219,30 @@ button.spg-action-button--large {
|
|
|
4219
4219
|
.spg-selectbase__label {
|
|
4220
4220
|
display: flex;
|
|
4221
4221
|
align-items: flex-start;
|
|
4222
|
-
gap: calc(1 * var(--base-unit, 8px));
|
|
4222
|
+
gap: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4223
4223
|
}
|
|
4224
4224
|
|
|
4225
4225
|
.spg-matrixdynamic__drag-element {
|
|
4226
|
-
padding: calc(2 * var(--base-unit, 8px));
|
|
4226
|
+
padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4227
4227
|
}
|
|
4228
4228
|
.spg-matrixdynamic__drag-element:hover {
|
|
4229
|
-
background-color: var(--background, #fff);
|
|
4229
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4230
4230
|
}
|
|
4231
4231
|
.spg-matrixdynamic__drag-element:after {
|
|
4232
4232
|
content: " ";
|
|
4233
4233
|
display: block;
|
|
4234
|
-
height: calc(0.5 * var(--base-unit, 8px));
|
|
4234
|
+
height: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4235
4235
|
}
|
|
4236
4236
|
|
|
4237
4237
|
.spg-drag-element__svg {
|
|
4238
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4239
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4240
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
4238
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4239
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4240
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4241
4241
|
display: block;
|
|
4242
4242
|
opacity: 0.5;
|
|
4243
4243
|
}
|
|
4244
4244
|
.spg-drag-element__svg use {
|
|
4245
|
-
fill: var(--foreground-light, #909090);
|
|
4245
|
+
fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4246
4246
|
}
|
|
4247
4247
|
|
|
4248
4248
|
.spg-matrixdynamic__drag-drop-ghost-position-top,
|
|
@@ -4254,8 +4254,8 @@ button.spg-action-button--large {
|
|
|
4254
4254
|
.spg-matrixdynamic__drag-drop-ghost-position-bottom::after {
|
|
4255
4255
|
content: "";
|
|
4256
4256
|
width: 100%;
|
|
4257
|
-
height: calc(0.5 * var(--base-unit, 8px));
|
|
4258
|
-
background-color: var(--secondary, #ff9814);
|
|
4257
|
+
height: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4258
|
+
background-color: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
|
|
4259
4259
|
position: absolute;
|
|
4260
4260
|
left: 0;
|
|
4261
4261
|
}
|
|
@@ -4269,13 +4269,13 @@ button.spg-action-button--large {
|
|
|
4269
4269
|
}
|
|
4270
4270
|
|
|
4271
4271
|
.spg-matrixdynamic__placeholder {
|
|
4272
|
-
padding: calc(6 * var(--base-unit, 8px)) 0;
|
|
4272
|
+
padding: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4273
4273
|
display: flex;
|
|
4274
4274
|
flex-direction: column;
|
|
4275
4275
|
justify-content: center;
|
|
4276
4276
|
align-items: center;
|
|
4277
|
-
background: var(--background, #fff);
|
|
4278
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
4277
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4278
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4279
4279
|
box-sizing: border-box;
|
|
4280
4280
|
}
|
|
4281
4281
|
.spg-matrixdynamic__placeholder .spg-matrixdynamic__add-btn {
|
|
@@ -4283,64 +4283,64 @@ button.spg-action-button--large {
|
|
|
4283
4283
|
}
|
|
4284
4284
|
|
|
4285
4285
|
.spg-matrixdynamic__placeholder-text {
|
|
4286
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4287
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4288
|
-
color: var(--foreground-light, #909090);
|
|
4286
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4287
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4288
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4289
4289
|
}
|
|
4290
4290
|
|
|
4291
4291
|
.spg-matrixdynamic__add-btn {
|
|
4292
4292
|
display: none;
|
|
4293
4293
|
appearance: none;
|
|
4294
4294
|
border: none;
|
|
4295
|
-
margin-top: calc(0.5 * var(--base-unit, 8px));
|
|
4295
|
+
margin-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4296
4296
|
background: transparent;
|
|
4297
|
-
color: var(--primary, #19b394);
|
|
4297
|
+
color: var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4298
4298
|
font-family: var(--font-family);
|
|
4299
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4299
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4300
4300
|
font-weight: 600;
|
|
4301
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4301
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4302
4302
|
}
|
|
4303
4303
|
|
|
4304
4304
|
.spg-smiley-icon {
|
|
4305
|
-
width: calc(3 * var(--base-unit, 8px));
|
|
4306
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4307
|
-
margin: calc(1 * var(--base-unit, 8px));
|
|
4305
|
+
width: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4306
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4307
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4308
4308
|
border-radius: 100px;
|
|
4309
|
-
border: 1px solid var(--foreground, #161616);
|
|
4309
|
+
border: 1px solid var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4310
4310
|
display: flex;
|
|
4311
4311
|
justify-content: center;
|
|
4312
4312
|
align-items: center;
|
|
4313
|
-
margin-right: calc(4 * var(--base-unit, 8px));
|
|
4313
|
+
margin-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4314
4314
|
}
|
|
4315
4315
|
.spg-smiley-icon svg {
|
|
4316
|
-
width: calc(1.5 * var(--base-unit, 8px));
|
|
4317
|
-
height: calc(1.5 * var(--base-unit, 8px));
|
|
4318
|
-
fill: var(--foreground, #161616);
|
|
4316
|
+
width: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4317
|
+
height: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4318
|
+
fill: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4319
4319
|
}
|
|
4320
4320
|
|
|
4321
4321
|
.spg-table-wrapper {
|
|
4322
|
-
border: 1px solid var(--border, #d6d6d6);
|
|
4322
|
+
border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4323
4323
|
border-bottom: none;
|
|
4324
4324
|
}
|
|
4325
4325
|
|
|
4326
4326
|
.spg-table {
|
|
4327
4327
|
width: 100%;
|
|
4328
|
-
background-color: var(--background, #fff);
|
|
4328
|
+
background-color: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4329
4329
|
border-collapse: collapse;
|
|
4330
4330
|
}
|
|
4331
4331
|
.spg-table tr {
|
|
4332
|
-
border-bottom: 1px solid var(--border, #d6d6d6);
|
|
4332
|
+
border-bottom: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4333
4333
|
}
|
|
4334
4334
|
|
|
4335
4335
|
.spg-table__cell {
|
|
4336
4336
|
padding: 0;
|
|
4337
4337
|
}
|
|
4338
4338
|
.spg-table__cell .spg-checkbox {
|
|
4339
|
-
margin: 0 calc(2 * var(--base-unit, 8px));
|
|
4339
|
+
margin: 0 calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4340
4340
|
}
|
|
4341
4341
|
|
|
4342
4342
|
.spg-table__cell--detail-panel {
|
|
4343
|
-
background: var(--background-dim, #f3f3f3);
|
|
4343
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4344
4344
|
}
|
|
4345
4345
|
.spg-table__cell--detail-panel .spg-panel__content {
|
|
4346
4346
|
box-shadow: none;
|
|
@@ -4352,35 +4352,35 @@ button.spg-action-button--large {
|
|
|
4352
4352
|
|
|
4353
4353
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-input {
|
|
4354
4354
|
appearance: none;
|
|
4355
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4356
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4355
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4356
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4357
4357
|
box-shadow: none;
|
|
4358
|
-
border-radius: calc(0.5 * var(--base-unit, 8px));
|
|
4358
|
+
border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4359
4359
|
background-color: transparent;
|
|
4360
|
-
padding: calc(1 * var(--base-unit, 8px));
|
|
4360
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4361
4361
|
height: auto;
|
|
4362
4362
|
}
|
|
4363
4363
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-input[type=color] {
|
|
4364
4364
|
padding-right: 0;
|
|
4365
4365
|
}
|
|
4366
4366
|
.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 {
|
|
4367
|
-
box-shadow: inset 0 0 0 2px var(--primary, #19b394);
|
|
4367
|
+
box-shadow: inset 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
|
|
4368
4368
|
}
|
|
4369
4369
|
|
|
4370
4370
|
.spg-table__cell:not(.spg-table__cell--detail-panel) .spg-dropdown {
|
|
4371
4371
|
width: max-content;
|
|
4372
|
-
padding-right: calc(4 * var(--base-unit, 8px));
|
|
4373
|
-
background-size: calc(3 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
|
|
4374
|
-
background-position: right calc(0.5 * var(--base-unit, 8px)) top 50%, 0 0;
|
|
4372
|
+
padding-right: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4373
|
+
background-size: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4374
|
+
background-position: right calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) top 50%, 0 0;
|
|
4375
4375
|
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");
|
|
4376
4376
|
}
|
|
4377
4377
|
|
|
4378
4378
|
.spg-table__cell:not(.spg-table__cell--detail-panel):first-of-type .spg-text {
|
|
4379
|
-
padding-left: calc(2 * var(--base-unit, 8px));
|
|
4379
|
+
padding-left: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4380
4380
|
}
|
|
4381
4381
|
|
|
4382
4382
|
.spg-table__cell--actions:first-of-type {
|
|
4383
|
-
width: calc(5 * var(--base-unit, 8px));
|
|
4383
|
+
width: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4384
4384
|
}
|
|
4385
4385
|
|
|
4386
4386
|
.spg-table__cell--actions:last-of-type .spg-action-bar {
|
|
@@ -4389,16 +4389,16 @@ button.spg-action-button--large {
|
|
|
4389
4389
|
|
|
4390
4390
|
.spg-table__cell--actions > .spg-matrixdynamic__drag-element {
|
|
4391
4391
|
display: inline-block;
|
|
4392
|
-
margin-top: calc(0.5 * var(--base-unit, 8px));
|
|
4392
|
+
margin-top: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4393
4393
|
cursor: move;
|
|
4394
4394
|
}
|
|
4395
4395
|
|
|
4396
4396
|
.spg-table__cell--header {
|
|
4397
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
4397
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4398
4398
|
font-weight: normal;
|
|
4399
|
-
color: var(--foreground-light, #909090);
|
|
4400
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4401
|
-
background: var(--background-dim, #f3f3f3);
|
|
4399
|
+
color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
|
|
4400
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4401
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4402
4402
|
text-align: left;
|
|
4403
4403
|
white-space: nowrap;
|
|
4404
4404
|
text-overflow: ellipsis;
|
|
@@ -4407,14 +4407,14 @@ button.spg-action-button--large {
|
|
|
4407
4407
|
}
|
|
4408
4408
|
|
|
4409
4409
|
.spg-table__question-wrapper {
|
|
4410
|
-
padding: calc(0.5 * var(--base-unit, 8px)) 0;
|
|
4410
|
+
padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4411
4411
|
}
|
|
4412
4412
|
|
|
4413
4413
|
.spg-question-group .spg-row {
|
|
4414
4414
|
margin-top: 0;
|
|
4415
4415
|
}
|
|
4416
4416
|
.spg-question-group .spg-row:not(:first-of-type) {
|
|
4417
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4417
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4418
4418
|
}
|
|
4419
4419
|
|
|
4420
4420
|
.spg-color-editor__color-input {
|
|
@@ -4431,7 +4431,7 @@ button.spg-action-button--large {
|
|
|
4431
4431
|
|
|
4432
4432
|
.spg-color-editor__color-item {
|
|
4433
4433
|
display: flex;
|
|
4434
|
-
gap: calc(2 * var(--base-unit, 8px));
|
|
4434
|
+
gap: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4435
4435
|
}
|
|
4436
4436
|
.spg-color-editor__color-item .spg-color-editor__color-swatch {
|
|
4437
4437
|
margin-left: 0;
|
|
@@ -4442,24 +4442,24 @@ button.spg-action-button--large {
|
|
|
4442
4442
|
flex-shrink: 0;
|
|
4443
4443
|
flex-grow: 0;
|
|
4444
4444
|
border-radius: 3px;
|
|
4445
|
-
width: calc(4 * var(--base-unit, 8px));
|
|
4446
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4445
|
+
width: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4446
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4447
4447
|
box-sizing: border-box;
|
|
4448
4448
|
border: 1px solid rgba(0, 0, 0, 0.16);
|
|
4449
|
-
margin-left: calc(1.5 * var(--base-unit, 8px));
|
|
4449
|
+
margin-left: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4450
4450
|
}
|
|
4451
4451
|
.spg-color-editor__color-swatch .sv-svg-icon {
|
|
4452
4452
|
position: absolute;
|
|
4453
|
-
width: calc(2 * var(--base-unit, 8px));
|
|
4454
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
4453
|
+
width: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4454
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4455
4455
|
left: 50%;
|
|
4456
4456
|
top: 50%;
|
|
4457
4457
|
transform: translate(-50%, -50%);
|
|
4458
|
-
fill: var(--background, #fff);
|
|
4458
|
+
fill: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4459
4459
|
}
|
|
4460
4460
|
|
|
4461
4461
|
.spg-color-editor .spg-input__edit-button + * {
|
|
4462
|
-
margin-inline-end: calc(-0.5 * var(--base-unit, 8px));
|
|
4462
|
+
margin-inline-end: calc(-0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4463
4463
|
}
|
|
4464
4464
|
|
|
4465
4465
|
.spg-file-edit__choose-button {
|
|
@@ -4473,10 +4473,10 @@ button.spg-action-button--large {
|
|
|
4473
4473
|
.spg-theme-builder-root .spg-paneldynamic__separator {
|
|
4474
4474
|
border: none;
|
|
4475
4475
|
margin: 0;
|
|
4476
|
-
height: calc(2 * var(--base-unit, 8px));
|
|
4476
|
+
height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4477
4477
|
}
|
|
4478
4478
|
.spg-theme-builder-root .spg-panel__footer {
|
|
4479
|
-
margin: calc(1 * var(--base-unit, 8px)) auto 0;
|
|
4479
|
+
margin: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) auto 0;
|
|
4480
4480
|
}
|
|
4481
4481
|
.spg-theme-builder-root .spg-paneldynamic__add-btn {
|
|
4482
4482
|
margin: 0 auto;
|
|
@@ -4489,13 +4489,13 @@ button.spg-action-button--large {
|
|
|
4489
4489
|
}
|
|
4490
4490
|
.spg-theme-builder-root .spg-row--multiple > div {
|
|
4491
4491
|
flex: 1 1 0;
|
|
4492
|
-
min-width: calc(12.5 * var(--base-unit, 8px));
|
|
4492
|
+
min-width: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4493
4493
|
}
|
|
4494
4494
|
.spg-theme-builder-root .spg-row--multiple > div input {
|
|
4495
4495
|
min-width: 0;
|
|
4496
4496
|
}
|
|
4497
4497
|
.spg-theme-builder-root .spg-row--multiple > div .spg-question--location--left {
|
|
4498
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4498
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4499
4499
|
box-sizing: border-box;
|
|
4500
4500
|
}
|
|
4501
4501
|
.spg-theme-builder-root .spg-row--multiple > div .spg-question--location--left .spg-input {
|
|
@@ -4515,23 +4515,23 @@ button.spg-action-button--large {
|
|
|
4515
4515
|
}
|
|
4516
4516
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content {
|
|
4517
4517
|
padding: 0;
|
|
4518
|
-
padding-bottom: calc(5 * var(--base-unit, 8px));
|
|
4518
|
+
padding-bottom: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4519
4519
|
box-shadow: none;
|
|
4520
4520
|
}
|
|
4521
4521
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content .spg-panel__title {
|
|
4522
4522
|
background-color: transparent;
|
|
4523
4523
|
box-shadow: none;
|
|
4524
|
-
padding: calc(1 * var(--base-unit, 8px)) 0;
|
|
4524
|
+
padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) 0;
|
|
4525
4525
|
}
|
|
4526
4526
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content::after {
|
|
4527
4527
|
content: " ";
|
|
4528
4528
|
display: block;
|
|
4529
4529
|
position: relative;
|
|
4530
|
-
left: calc(-4 * var(--base-unit, 8px));
|
|
4531
|
-
top: calc(5 * var(--base-unit, 8px));
|
|
4532
|
-
width: calc(8 * var(--base-unit, 8px) + 100%);
|
|
4530
|
+
left: calc(-4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4531
|
+
top: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4532
|
+
width: calc(8 * var(--sjs-base-unit, var(--base-unit, 8px)) + 100%);
|
|
4533
4533
|
height: 1px;
|
|
4534
|
-
background-color: var(--border, #d6d6d6);
|
|
4534
|
+
background-color: var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4535
4535
|
}
|
|
4536
4536
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content > .spg-row:first-of-type {
|
|
4537
4537
|
margin-top: 0;
|
|
@@ -4543,7 +4543,7 @@ button.spg-action-button--large {
|
|
|
4543
4543
|
content: none;
|
|
4544
4544
|
}
|
|
4545
4545
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content .spg-panel__content .spg-row {
|
|
4546
|
-
margin-top: calc(1 * var(--base-unit, 8px));
|
|
4546
|
+
margin-top: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4547
4547
|
}
|
|
4548
4548
|
.spg-theme-builder-root .spg-panel__content .spg-panel__content .spg-panel__content .spg-row:first-of-type {
|
|
4549
4549
|
margin-top: 0;
|
|
@@ -4575,12 +4575,12 @@ button.spg-action-button--large {
|
|
|
4575
4575
|
|
|
4576
4576
|
.spg-root-modern {
|
|
4577
4577
|
width: 100%;
|
|
4578
|
-
border-right: 1px solid var(--border, #d6d6d6);
|
|
4578
|
+
border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4579
4579
|
box-sizing: border-box;
|
|
4580
4580
|
}
|
|
4581
4581
|
|
|
4582
4582
|
.sv-popup--modal {
|
|
4583
|
-
padding: calc(4 * var(--base-unit, 8px));
|
|
4583
|
+
padding: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4584
4584
|
}
|
|
4585
4585
|
.sv-popup--modal.sv-property-editor .sv-popup__container .sv-popup_shadow {
|
|
4586
4586
|
background-color: transparent;
|
|
@@ -4597,7 +4597,7 @@ button.spg-action-button--large {
|
|
|
4597
4597
|
}
|
|
4598
4598
|
.sv-popup--modal .sd-body,
|
|
4599
4599
|
.sv-popup--modal .sl-body {
|
|
4600
|
-
min-width: calc(78 * var(--base-unit, 8px));
|
|
4600
|
+
min-width: calc(78 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4601
4601
|
}
|
|
4602
4602
|
|
|
4603
4603
|
.sv-popup.sv-property-editor .sd-root-modern {
|
|
@@ -4605,8 +4605,8 @@ button.spg-action-button--large {
|
|
|
4605
4605
|
}
|
|
4606
4606
|
|
|
4607
4607
|
.svc-object-selector .sv-popup__container {
|
|
4608
|
-
margin-left: calc(1 * var(--base-unit, 8px));
|
|
4609
|
-
margin-right: calc(1 * var(--base-unit, 8px));
|
|
4608
|
+
margin-left: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4609
|
+
margin-right: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4610
4610
|
}
|
|
4611
4611
|
|
|
4612
4612
|
.svc-object-selector__content {
|
|
@@ -4618,8 +4618,8 @@ button.spg-action-button--large {
|
|
|
4618
4618
|
}
|
|
4619
4619
|
|
|
4620
4620
|
.spg-title .spg-action-bar {
|
|
4621
|
-
margin-top: calc(-1 * var(--base-unit, 8px));
|
|
4622
|
-
margin-bottom: calc(-1 * var(--base-unit, 8px));
|
|
4621
|
+
margin-top: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4622
|
+
margin-bottom: calc(-1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4623
4623
|
margin-right: 1px;
|
|
4624
4624
|
}
|
|
4625
4625
|
|
|
@@ -4628,23 +4628,23 @@ button.spg-action-button--large {
|
|
|
4628
4628
|
}
|
|
4629
4629
|
|
|
4630
4630
|
.spg-body--empty {
|
|
4631
|
-
margin: calc(3 * var(--base-unit, 8px));
|
|
4631
|
+
margin: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4632
4632
|
}
|
|
4633
4633
|
.svc-text {
|
|
4634
4634
|
font-family: var(--font-family);
|
|
4635
4635
|
font-style: normal;
|
|
4636
4636
|
font-weight: normal;
|
|
4637
|
-
color: var(--foreground, #161616);
|
|
4637
|
+
color: var(--sjs-general-forecolor, var(--foreground, #161616));
|
|
4638
4638
|
}
|
|
4639
4639
|
|
|
4640
4640
|
.svc-text--normal {
|
|
4641
|
-
font-size: calc(2 * var(--base-unit, 8px));
|
|
4642
|
-
line-height: calc(3 * var(--base-unit, 8px));
|
|
4641
|
+
font-size: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4642
|
+
line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4643
4643
|
}
|
|
4644
4644
|
|
|
4645
4645
|
.svc-text--small {
|
|
4646
|
-
font-size: calc(1.5 * var(--base-unit, 8px));
|
|
4647
|
-
line-height: calc(2 * var(--base-unit, 8px));
|
|
4646
|
+
font-size: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4647
|
+
line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4648
4648
|
}
|
|
4649
4649
|
|
|
4650
4650
|
.svc-text--bold {
|
|
@@ -4657,7 +4657,7 @@ button.spg-action-button--large {
|
|
|
4657
4657
|
.svc-flex-row {
|
|
4658
4658
|
display: flex;
|
|
4659
4659
|
flex-direction: row;
|
|
4660
|
-
background: var(--background-dim, #f3f3f3);
|
|
4660
|
+
background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
|
|
4661
4661
|
}
|
|
4662
4662
|
|
|
4663
4663
|
.svc-full-container {
|
|
@@ -4676,15 +4676,15 @@ button.spg-action-button--large {
|
|
|
4676
4676
|
}
|
|
4677
4677
|
|
|
4678
4678
|
.sv-action-bar--default-size-mode .sv-action-bar-separator {
|
|
4679
|
-
height: calc(5 * var(--base-unit, 8px));
|
|
4679
|
+
height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4680
4680
|
}
|
|
4681
4681
|
|
|
4682
4682
|
.sv-action-bar--small-size-mode .sv-action-bar-separator {
|
|
4683
|
-
height: calc(4 * var(--base-unit, 8px));
|
|
4683
|
+
height: calc(4 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4684
4684
|
}
|
|
4685
4685
|
|
|
4686
4686
|
.svc-creator--mobile .sv-action-bar-separator {
|
|
4687
|
-
height: calc(3 * var(--base-unit, 8px));
|
|
4687
|
+
height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4688
4688
|
}
|
|
4689
4689
|
|
|
4690
4690
|
.sv-action-bar--small-size-mode .sv-action-bar-item {
|
|
@@ -4694,20 +4694,20 @@ button.spg-action-button--large {
|
|
|
4694
4694
|
|
|
4695
4695
|
.svc-top-bar {
|
|
4696
4696
|
display: flex;
|
|
4697
|
-
background: var(--background, #fff);
|
|
4697
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4698
4698
|
box-sizing: border-box;
|
|
4699
|
-
box-shadow: inset 0px -1px 0px var(--border, #d6d6d6);
|
|
4699
|
+
box-shadow: inset 0px -1px 0px var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4700
4700
|
}
|
|
4701
4701
|
.svc-top-bar .svc-toolbar-wrapper {
|
|
4702
4702
|
flex: 0 0 auto;
|
|
4703
4703
|
display: flex;
|
|
4704
4704
|
}
|
|
4705
4705
|
.svc-top-bar .svc-toolbar-wrapper .sv-action-bar {
|
|
4706
|
-
padding: 0 calc(1 * var(--base-unit, 8px));
|
|
4706
|
+
padding: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4707
4707
|
justify-content: flex-end;
|
|
4708
4708
|
}
|
|
4709
4709
|
.svc-top-bar .svc-toolbar-wrapper .sv-action .sv-action-bar-item {
|
|
4710
|
-
margin: 0 calc(1 * var(--base-unit, 8px));
|
|
4710
|
+
margin: 0 calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4711
4711
|
}
|
|
4712
4712
|
|
|
4713
4713
|
.svc-footer-bar .svc-toolbar-wrapper {
|
|
@@ -4715,15 +4715,15 @@ button.spg-action-button--large {
|
|
|
4715
4715
|
left: 0;
|
|
4716
4716
|
right: 0;
|
|
4717
4717
|
bottom: 0;
|
|
4718
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4718
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4719
4719
|
}
|
|
4720
4720
|
.svc-footer-bar .svc-toolbar-wrapper .sv-action-bar {
|
|
4721
4721
|
justify-content: center;
|
|
4722
4722
|
padding: 0;
|
|
4723
4723
|
width: 100%;
|
|
4724
|
-
height: calc(6 * var(--base-unit, 8px));
|
|
4725
|
-
background: var(--background, #fff);
|
|
4726
|
-
border-top: 1px solid var(--border, #d6d6d6);
|
|
4724
|
+
height: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
|
|
4725
|
+
background: var(--sjs-general-backcolor, var(--background, #fff));
|
|
4726
|
+
border-top: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
|
|
4727
4727
|
}
|
|
4728
4728
|
|
|
4729
4729
|
/*# sourceMappingURL=survey-creator-core.fontless.css.map*/
|