@entur/form 8.2.6 → 8.2.8
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/dist/styles.css +418 -418
- package/package.json +6 -6
package/dist/styles.css
CHANGED
|
@@ -1,5 +1,148 @@
|
|
|
1
1
|
/* DO NOT CHANGE!*/
|
|
2
2
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
3
|
+
.eds-checkbox__container {
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
position: relative;
|
|
7
|
+
-webkit-appearance: none;
|
|
8
|
+
-moz-appearance: none;
|
|
9
|
+
appearance: none;
|
|
10
|
+
cursor: pointer;
|
|
11
|
+
-webkit-user-select: none;
|
|
12
|
+
-moz-user-select: none;
|
|
13
|
+
user-select: none;
|
|
14
|
+
width: -moz-fit-content;
|
|
15
|
+
width: fit-content;
|
|
16
|
+
margin: 0.5rem 0;
|
|
17
|
+
}
|
|
18
|
+
.eds-checkbox__container--reduced-click-area {
|
|
19
|
+
height: -moz-fit-content;
|
|
20
|
+
height: fit-content;
|
|
21
|
+
}
|
|
22
|
+
.eds-checkbox__container input {
|
|
23
|
+
position: absolute;
|
|
24
|
+
opacity: 0;
|
|
25
|
+
height: 0;
|
|
26
|
+
width: 0;
|
|
27
|
+
}
|
|
28
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
29
|
+
background-color: var(--components-form-checkbox-standard-fill-selected);
|
|
30
|
+
}
|
|
31
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
|
|
32
|
+
visibility: visible;
|
|
33
|
+
}
|
|
34
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon path {
|
|
35
|
+
stroke: var(--components-form-checkbox-standard-icon);
|
|
36
|
+
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
37
|
+
}
|
|
38
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon rect {
|
|
39
|
+
fill: var(--components-form-checkbox-standard-icon);
|
|
40
|
+
}
|
|
41
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
|
|
42
|
+
opacity: 0.5;
|
|
43
|
+
}
|
|
44
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled path {
|
|
45
|
+
opacity: 0.5;
|
|
46
|
+
}
|
|
47
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled rect {
|
|
48
|
+
opacity: 0.5;
|
|
49
|
+
}
|
|
50
|
+
.eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled path {
|
|
51
|
+
opacity: 0.5;
|
|
52
|
+
}
|
|
53
|
+
.eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled rect {
|
|
54
|
+
opacity: 0.5;
|
|
55
|
+
}
|
|
56
|
+
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
57
|
+
background-color: var(--components-form-checkbox-contrast-fill-selected);
|
|
58
|
+
}
|
|
59
|
+
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon path, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon path {
|
|
60
|
+
stroke: var(--components-form-checkbox-contrast-icon);
|
|
61
|
+
}
|
|
62
|
+
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon rect, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon rect {
|
|
63
|
+
fill: var(--components-form-checkbox-contrast-icon);
|
|
64
|
+
}
|
|
65
|
+
.eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
66
|
+
border-color: var(--components-form-checkbox-standard-border);
|
|
67
|
+
background-color: var(--components-form-checkbox-standard-fill-hover);
|
|
68
|
+
}
|
|
69
|
+
.eds-contrast .eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
70
|
+
border-color: var(--components-form-checkbox-contrast-border);
|
|
71
|
+
background-color: var(--components-form-checkbox-contrast-fill-hover);
|
|
72
|
+
}
|
|
73
|
+
.eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
|
|
74
|
+
.eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
|
|
75
|
+
border-color: transparent;
|
|
76
|
+
background-color: var(--components-form-checkbox-standard-fill-selectedhover);
|
|
77
|
+
}
|
|
78
|
+
.eds-contrast .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
|
|
79
|
+
.eds-contrast .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
|
|
80
|
+
background-color: var(--components-form-checkbox-contrast-fill-selectedhover);
|
|
81
|
+
}
|
|
82
|
+
.eds-checkbox__container:active input:checked + .eds-checkbox__icon,
|
|
83
|
+
.eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
|
|
84
|
+
background-color: var(--components-form-checkbox-standard-fill-selected);
|
|
85
|
+
}
|
|
86
|
+
.eds-contrast .eds-checkbox__container:active input:checked + .eds-checkbox__icon,
|
|
87
|
+
.eds-contrast .eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
|
|
88
|
+
background-color: var(--components-form-checkbox-contrast-fill-selected);
|
|
89
|
+
}
|
|
90
|
+
.eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon {
|
|
91
|
+
outline: 2px solid #181c56;
|
|
92
|
+
outline-color: var(--basecolors-stroke-focus-standard);
|
|
93
|
+
outline-offset: 0.125rem;
|
|
94
|
+
}
|
|
95
|
+
.eds-contrast .eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon {
|
|
96
|
+
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
97
|
+
}
|
|
98
|
+
.eds-checkbox--disabled {
|
|
99
|
+
pointer-events: none;
|
|
100
|
+
}
|
|
101
|
+
.eds-checkbox--disabled .eds-checkbox__label {
|
|
102
|
+
opacity: 0.5;
|
|
103
|
+
}
|
|
104
|
+
.eds-checkbox--disabled .eds-checkbox__icon {
|
|
105
|
+
opacity: 0.5;
|
|
106
|
+
}
|
|
107
|
+
.eds-checkbox__icon {
|
|
108
|
+
box-sizing: border-box;
|
|
109
|
+
display: inline-flex;
|
|
110
|
+
justify-content: center;
|
|
111
|
+
align-items: center;
|
|
112
|
+
position: relative;
|
|
113
|
+
margin-right: 1rem;
|
|
114
|
+
height: 1.25rem;
|
|
115
|
+
width: 1.25rem;
|
|
116
|
+
border: 0.125rem solid var(--components-form-checkbox-standard-border);
|
|
117
|
+
border-radius: 0.125rem;
|
|
118
|
+
background-color: transparent;
|
|
119
|
+
transition: border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
|
|
120
|
+
}
|
|
121
|
+
.eds-checkbox__icon--reduced-click-area {
|
|
122
|
+
margin-right: 0;
|
|
123
|
+
}
|
|
124
|
+
.eds-contrast .eds-checkbox__icon {
|
|
125
|
+
border-color: var(--components-form-checkbox-contrast-border);
|
|
126
|
+
}
|
|
127
|
+
.eds-checkbox__icon .eds-checkbox-icon {
|
|
128
|
+
height: 1rem;
|
|
129
|
+
width: 1rem;
|
|
130
|
+
visibility: hidden;
|
|
131
|
+
}
|
|
132
|
+
.eds-checkbox__icon .eds-checkbox-icon path {
|
|
133
|
+
transform-origin: 50% 50%;
|
|
134
|
+
stroke-dasharray: 48;
|
|
135
|
+
stroke-dashoffset: 48;
|
|
136
|
+
stroke-width: 0.375rem;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
@keyframes stroke {
|
|
140
|
+
100% {
|
|
141
|
+
stroke-dashoffset: 0;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
/* DO NOT CHANGE!*/
|
|
145
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
3
146
|
.eds-form-control__field-and-feedback-text {
|
|
4
147
|
display: flex;
|
|
5
148
|
flex-direction: column;
|
|
@@ -206,105 +349,90 @@
|
|
|
206
349
|
margin-right: 0;
|
|
207
350
|
margin-left: 0.75rem;
|
|
208
351
|
}
|
|
209
|
-
.eds-fieldset {
|
|
210
|
-
margin: 0;
|
|
211
|
-
padding: 0;
|
|
212
|
-
border: 0;
|
|
213
|
-
}
|
|
214
352
|
/* DO NOT CHANGE!*/
|
|
215
353
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
216
|
-
.eds-
|
|
217
|
-
color: inherit;
|
|
218
|
-
display: block;
|
|
219
|
-
position: relative;
|
|
220
|
-
}
|
|
221
|
-
.eds-input-group__label {
|
|
222
|
-
color: var(--components-form-baseform-standard-text-label);
|
|
354
|
+
.eds-feedback-text {
|
|
223
355
|
display: flex;
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
line-height: 1rem;
|
|
227
|
-
height: 3rem;
|
|
228
|
-
padding-left: 0;
|
|
229
|
-
top: 1rem;
|
|
230
|
-
transition: top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
|
|
231
|
-
-webkit-user-select: none;
|
|
232
|
-
-moz-user-select: none;
|
|
233
|
-
user-select: none;
|
|
234
|
-
pointer-events: none;
|
|
356
|
+
align-items: center;
|
|
357
|
+
margin-top: 0.25rem;
|
|
235
358
|
}
|
|
236
|
-
.eds-
|
|
237
|
-
|
|
238
|
-
font-size: 0.75rem;
|
|
239
|
-
line-height: 0.75rem;
|
|
240
|
-
height: 10px;
|
|
241
|
-
padding: 0;
|
|
359
|
+
.eds-feedback-text--info, .eds-feedback-text--information {
|
|
360
|
+
padding-left: calc(1rem + 0.125rem);
|
|
242
361
|
}
|
|
243
|
-
.eds-
|
|
244
|
-
|
|
245
|
-
background: var(--textarea-label-background);
|
|
246
|
-
width: calc(100% - 1rem - 1rem - 4px);
|
|
362
|
+
.eds-feedback-text__text {
|
|
363
|
+
color: var(--components-form-feedbacktext-information-standard-text);
|
|
247
364
|
}
|
|
248
|
-
.eds-
|
|
249
|
-
|
|
250
|
-
font-size: 0.875rem;
|
|
251
|
-
line-height: 1rem;
|
|
252
|
-
padding: 0;
|
|
365
|
+
.eds-contrast .eds-feedback-text__text {
|
|
366
|
+
color: var(--components-form-feedbacktext-information-contrast-text);
|
|
253
367
|
}
|
|
254
|
-
|
|
255
|
-
|
|
368
|
+
|
|
369
|
+
.eds-feedback-text__icon {
|
|
256
370
|
font-size: 1.5rem;
|
|
257
|
-
|
|
371
|
+
min-height: 1.5rem;
|
|
372
|
+
min-width: 1.5rem;
|
|
373
|
+
padding-right: 0.5rem;
|
|
374
|
+
position: relative;
|
|
375
|
+
top: -0.1rem;
|
|
258
376
|
}
|
|
259
|
-
.eds-
|
|
260
|
-
|
|
261
|
-
font-size: 0.75rem;
|
|
262
|
-
line-height: 0.75rem;
|
|
263
|
-
height: 10px;
|
|
264
|
-
padding: 0;
|
|
377
|
+
.eds-feedback-text__icon--success {
|
|
378
|
+
color: var(--components-form-feedbacktext-success-standard-icon-fill);
|
|
265
379
|
}
|
|
266
|
-
.eds-
|
|
267
|
-
|
|
268
|
-
background: var(--textarea-label-background);
|
|
269
|
-
width: calc(100% - 1rem - 1rem - 4px);
|
|
380
|
+
.eds-feedback-text__icon--success circle {
|
|
381
|
+
fill: var(--components-form-feedbacktext-success-standard-icon-symbol);
|
|
270
382
|
}
|
|
271
|
-
.eds-
|
|
272
|
-
|
|
273
|
-
font-size: 0.875rem;
|
|
274
|
-
line-height: 1rem;
|
|
275
|
-
padding: 0;
|
|
383
|
+
.eds-contrast .eds-feedback-text__icon--success {
|
|
384
|
+
color: var(--components-form-feedbacktext-success-contrast-icon-fill);
|
|
276
385
|
}
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
top: 0.375rem;
|
|
280
|
-
font-size: 0.75rem;
|
|
281
|
-
line-height: 0.75rem;
|
|
282
|
-
height: 10px;
|
|
283
|
-
padding: 0;
|
|
386
|
+
.eds-contrast .eds-feedback-text__icon--success circle {
|
|
387
|
+
fill: var(--components-form-feedbacktext-success-contrast-icon-symbol);
|
|
284
388
|
}
|
|
285
|
-
.eds-
|
|
286
|
-
|
|
287
|
-
background: var(--textarea-label-background);
|
|
288
|
-
width: calc(100% - 1rem - 1rem - 4px);
|
|
389
|
+
.eds-feedback-text__icon--error, .eds-feedback-text__icon--negative {
|
|
390
|
+
color: var(--components-form-feedbacktext-negative-standard-icon-fill);
|
|
289
391
|
}
|
|
290
|
-
.eds-
|
|
291
|
-
|
|
292
|
-
font-size: 0.875rem;
|
|
293
|
-
line-height: 1rem;
|
|
294
|
-
padding: 0;
|
|
392
|
+
.eds-feedback-text__icon--error circle, .eds-feedback-text__icon--negative circle {
|
|
393
|
+
fill: var(--components-form-feedbacktext-negative-standard-icon-symbol);
|
|
295
394
|
}
|
|
296
|
-
.eds-
|
|
297
|
-
|
|
298
|
-
font-size: 1rem;
|
|
299
|
-
height: 3rem;
|
|
300
|
-
line-height: 1rem;
|
|
395
|
+
.eds-contrast .eds-feedback-text__icon--error, .eds-contrast .eds-feedback-text__icon--negative {
|
|
396
|
+
color: var(--components-form-feedbacktext-negative-contrast-icon-fill);
|
|
301
397
|
}
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
398
|
+
.eds-contrast .eds-feedback-text__icon--error circle, .eds-contrast .eds-feedback-text__icon--negative circle {
|
|
399
|
+
fill: var(--components-form-feedbacktext-negative-contrast-icon-symbol);
|
|
400
|
+
}
|
|
401
|
+
.eds-feedback-text__icon--info, .eds-feedback-text__icon--information {
|
|
402
|
+
color: var(--components-form-feedbacktext-information-standard-icon-fill);
|
|
403
|
+
}
|
|
404
|
+
.eds-feedback-text__icon--info circle, .eds-feedback-text__icon--information circle {
|
|
405
|
+
fill: var(--components-form-feedbacktext-information-standard-icon-symbol);
|
|
406
|
+
}
|
|
407
|
+
.eds-contrast .eds-feedback-text__icon--info, .eds-contrast .eds-feedback-text__icon--information {
|
|
408
|
+
color: var(--components-form-feedbacktext-information-contrast-icon-fill);
|
|
409
|
+
}
|
|
410
|
+
.eds-contrast .eds-feedback-text__icon--info circle, .eds-contrast .eds-feedback-text__icon--information circle {
|
|
411
|
+
fill: var(--components-form-feedbacktext-information-contrast-icon-symbol);
|
|
412
|
+
}
|
|
413
|
+
.eds-feedback-text__icon--warning {
|
|
414
|
+
color: var(--components-form-feedbacktext-warning-standard-icon-fill);
|
|
415
|
+
}
|
|
416
|
+
.eds-feedback-text__icon--warning .svg-exclamation {
|
|
417
|
+
fill: var(--components-form-feedbacktext-warning-standard-icon-symbol);
|
|
418
|
+
}
|
|
419
|
+
.eds-contrast .eds-feedback-text__icon--warning {
|
|
420
|
+
color: var(--components-form-feedbacktext-warning-contrast-icon-fill);
|
|
421
|
+
}
|
|
422
|
+
.eds-contrast .eds-feedback-text__icon--warning circle {
|
|
423
|
+
fill: var(--components-form-feedbacktext-warning-contrast-icon-symbol);
|
|
424
|
+
}
|
|
425
|
+
.eds-fieldset {
|
|
426
|
+
margin: 0;
|
|
427
|
+
padding: 0;
|
|
428
|
+
border: 0;
|
|
429
|
+
}
|
|
430
|
+
/* DO NOT CHANGE!*/
|
|
431
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
432
|
+
.eds-form-component--radio__container {
|
|
433
|
+
display: flex;
|
|
434
|
+
justify-content: center;
|
|
435
|
+
align-items: center;
|
|
308
436
|
position: relative;
|
|
309
437
|
cursor: pointer;
|
|
310
438
|
height: 2rem;
|
|
@@ -383,222 +511,6 @@
|
|
|
383
511
|
}
|
|
384
512
|
/* DO NOT CHANGE!*/
|
|
385
513
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
386
|
-
.eds-feedback-text {
|
|
387
|
-
display: flex;
|
|
388
|
-
align-items: center;
|
|
389
|
-
margin-top: 0.25rem;
|
|
390
|
-
}
|
|
391
|
-
.eds-feedback-text--info, .eds-feedback-text--information {
|
|
392
|
-
padding-left: calc(1rem + 0.125rem);
|
|
393
|
-
}
|
|
394
|
-
.eds-feedback-text__text {
|
|
395
|
-
color: var(--components-form-feedbacktext-information-standard-text);
|
|
396
|
-
}
|
|
397
|
-
.eds-contrast .eds-feedback-text__text {
|
|
398
|
-
color: var(--components-form-feedbacktext-information-contrast-text);
|
|
399
|
-
}
|
|
400
|
-
|
|
401
|
-
.eds-feedback-text__icon {
|
|
402
|
-
font-size: 1.5rem;
|
|
403
|
-
min-height: 1.5rem;
|
|
404
|
-
min-width: 1.5rem;
|
|
405
|
-
padding-right: 0.5rem;
|
|
406
|
-
position: relative;
|
|
407
|
-
top: -0.1rem;
|
|
408
|
-
}
|
|
409
|
-
.eds-feedback-text__icon--success {
|
|
410
|
-
color: var(--components-form-feedbacktext-success-standard-icon-fill);
|
|
411
|
-
}
|
|
412
|
-
.eds-feedback-text__icon--success circle {
|
|
413
|
-
fill: var(--components-form-feedbacktext-success-standard-icon-symbol);
|
|
414
|
-
}
|
|
415
|
-
.eds-contrast .eds-feedback-text__icon--success {
|
|
416
|
-
color: var(--components-form-feedbacktext-success-contrast-icon-fill);
|
|
417
|
-
}
|
|
418
|
-
.eds-contrast .eds-feedback-text__icon--success circle {
|
|
419
|
-
fill: var(--components-form-feedbacktext-success-contrast-icon-symbol);
|
|
420
|
-
}
|
|
421
|
-
.eds-feedback-text__icon--error, .eds-feedback-text__icon--negative {
|
|
422
|
-
color: var(--components-form-feedbacktext-negative-standard-icon-fill);
|
|
423
|
-
}
|
|
424
|
-
.eds-feedback-text__icon--error circle, .eds-feedback-text__icon--negative circle {
|
|
425
|
-
fill: var(--components-form-feedbacktext-negative-standard-icon-symbol);
|
|
426
|
-
}
|
|
427
|
-
.eds-contrast .eds-feedback-text__icon--error, .eds-contrast .eds-feedback-text__icon--negative {
|
|
428
|
-
color: var(--components-form-feedbacktext-negative-contrast-icon-fill);
|
|
429
|
-
}
|
|
430
|
-
.eds-contrast .eds-feedback-text__icon--error circle, .eds-contrast .eds-feedback-text__icon--negative circle {
|
|
431
|
-
fill: var(--components-form-feedbacktext-negative-contrast-icon-symbol);
|
|
432
|
-
}
|
|
433
|
-
.eds-feedback-text__icon--info, .eds-feedback-text__icon--information {
|
|
434
|
-
color: var(--components-form-feedbacktext-information-standard-icon-fill);
|
|
435
|
-
}
|
|
436
|
-
.eds-feedback-text__icon--info circle, .eds-feedback-text__icon--information circle {
|
|
437
|
-
fill: var(--components-form-feedbacktext-information-standard-icon-symbol);
|
|
438
|
-
}
|
|
439
|
-
.eds-contrast .eds-feedback-text__icon--info, .eds-contrast .eds-feedback-text__icon--information {
|
|
440
|
-
color: var(--components-form-feedbacktext-information-contrast-icon-fill);
|
|
441
|
-
}
|
|
442
|
-
.eds-contrast .eds-feedback-text__icon--info circle, .eds-contrast .eds-feedback-text__icon--information circle {
|
|
443
|
-
fill: var(--components-form-feedbacktext-information-contrast-icon-symbol);
|
|
444
|
-
}
|
|
445
|
-
.eds-feedback-text__icon--warning {
|
|
446
|
-
color: var(--components-form-feedbacktext-warning-standard-icon-fill);
|
|
447
|
-
}
|
|
448
|
-
.eds-feedback-text__icon--warning .svg-exclamation {
|
|
449
|
-
fill: var(--components-form-feedbacktext-warning-standard-icon-symbol);
|
|
450
|
-
}
|
|
451
|
-
.eds-contrast .eds-feedback-text__icon--warning {
|
|
452
|
-
color: var(--components-form-feedbacktext-warning-contrast-icon-fill);
|
|
453
|
-
}
|
|
454
|
-
.eds-contrast .eds-feedback-text__icon--warning circle {
|
|
455
|
-
fill: var(--components-form-feedbacktext-warning-contrast-icon-symbol);
|
|
456
|
-
}
|
|
457
|
-
/* DO NOT CHANGE!*/
|
|
458
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
459
|
-
.eds-checkbox__container {
|
|
460
|
-
display: flex;
|
|
461
|
-
align-items: center;
|
|
462
|
-
position: relative;
|
|
463
|
-
-webkit-appearance: none;
|
|
464
|
-
-moz-appearance: none;
|
|
465
|
-
appearance: none;
|
|
466
|
-
cursor: pointer;
|
|
467
|
-
-webkit-user-select: none;
|
|
468
|
-
-moz-user-select: none;
|
|
469
|
-
user-select: none;
|
|
470
|
-
width: -moz-fit-content;
|
|
471
|
-
width: fit-content;
|
|
472
|
-
margin: 0.5rem 0;
|
|
473
|
-
}
|
|
474
|
-
.eds-checkbox__container--reduced-click-area {
|
|
475
|
-
height: -moz-fit-content;
|
|
476
|
-
height: fit-content;
|
|
477
|
-
}
|
|
478
|
-
.eds-checkbox__container input {
|
|
479
|
-
position: absolute;
|
|
480
|
-
opacity: 0;
|
|
481
|
-
height: 0;
|
|
482
|
-
width: 0;
|
|
483
|
-
}
|
|
484
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
485
|
-
background-color: var(--components-form-checkbox-standard-fill-selected);
|
|
486
|
-
}
|
|
487
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
|
|
488
|
-
visibility: visible;
|
|
489
|
-
}
|
|
490
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon path {
|
|
491
|
-
stroke: var(--components-form-checkbox-standard-icon);
|
|
492
|
-
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
493
|
-
}
|
|
494
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon rect {
|
|
495
|
-
fill: var(--components-form-checkbox-standard-icon);
|
|
496
|
-
}
|
|
497
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
|
|
498
|
-
opacity: 0.5;
|
|
499
|
-
}
|
|
500
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled path {
|
|
501
|
-
opacity: 0.5;
|
|
502
|
-
}
|
|
503
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled rect {
|
|
504
|
-
opacity: 0.5;
|
|
505
|
-
}
|
|
506
|
-
.eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled path {
|
|
507
|
-
opacity: 0.5;
|
|
508
|
-
}
|
|
509
|
-
.eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled rect {
|
|
510
|
-
opacity: 0.5;
|
|
511
|
-
}
|
|
512
|
-
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
513
|
-
background-color: var(--components-form-checkbox-contrast-fill-selected);
|
|
514
|
-
}
|
|
515
|
-
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon path, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon path {
|
|
516
|
-
stroke: var(--components-form-checkbox-contrast-icon);
|
|
517
|
-
}
|
|
518
|
-
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon rect, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon rect {
|
|
519
|
-
fill: var(--components-form-checkbox-contrast-icon);
|
|
520
|
-
}
|
|
521
|
-
.eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
522
|
-
border-color: var(--components-form-checkbox-standard-border);
|
|
523
|
-
background-color: var(--components-form-checkbox-standard-fill-hover);
|
|
524
|
-
}
|
|
525
|
-
.eds-contrast .eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
526
|
-
border-color: var(--components-form-checkbox-contrast-border);
|
|
527
|
-
background-color: var(--components-form-checkbox-contrast-fill-hover);
|
|
528
|
-
}
|
|
529
|
-
.eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
|
|
530
|
-
.eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
|
|
531
|
-
border-color: transparent;
|
|
532
|
-
background-color: var(--components-form-checkbox-standard-fill-selectedhover);
|
|
533
|
-
}
|
|
534
|
-
.eds-contrast .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
|
|
535
|
-
.eds-contrast .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
|
|
536
|
-
background-color: var(--components-form-checkbox-contrast-fill-selectedhover);
|
|
537
|
-
}
|
|
538
|
-
.eds-checkbox__container:active input:checked + .eds-checkbox__icon,
|
|
539
|
-
.eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
|
|
540
|
-
background-color: var(--components-form-checkbox-standard-fill-selected);
|
|
541
|
-
}
|
|
542
|
-
.eds-contrast .eds-checkbox__container:active input:checked + .eds-checkbox__icon,
|
|
543
|
-
.eds-contrast .eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
|
|
544
|
-
background-color: var(--components-form-checkbox-contrast-fill-selected);
|
|
545
|
-
}
|
|
546
|
-
.eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon {
|
|
547
|
-
outline: 2px solid #181c56;
|
|
548
|
-
outline-color: var(--basecolors-stroke-focus-standard);
|
|
549
|
-
outline-offset: 0.125rem;
|
|
550
|
-
}
|
|
551
|
-
.eds-contrast .eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon {
|
|
552
|
-
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
553
|
-
}
|
|
554
|
-
.eds-checkbox--disabled {
|
|
555
|
-
pointer-events: none;
|
|
556
|
-
}
|
|
557
|
-
.eds-checkbox--disabled .eds-checkbox__label {
|
|
558
|
-
opacity: 0.5;
|
|
559
|
-
}
|
|
560
|
-
.eds-checkbox--disabled .eds-checkbox__icon {
|
|
561
|
-
opacity: 0.5;
|
|
562
|
-
}
|
|
563
|
-
.eds-checkbox__icon {
|
|
564
|
-
box-sizing: border-box;
|
|
565
|
-
display: inline-flex;
|
|
566
|
-
justify-content: center;
|
|
567
|
-
align-items: center;
|
|
568
|
-
position: relative;
|
|
569
|
-
margin-right: 1rem;
|
|
570
|
-
height: 1.25rem;
|
|
571
|
-
width: 1.25rem;
|
|
572
|
-
border: 0.125rem solid var(--components-form-checkbox-standard-border);
|
|
573
|
-
border-radius: 0.125rem;
|
|
574
|
-
background-color: transparent;
|
|
575
|
-
transition: border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
|
|
576
|
-
}
|
|
577
|
-
.eds-checkbox__icon--reduced-click-area {
|
|
578
|
-
margin-right: 0;
|
|
579
|
-
}
|
|
580
|
-
.eds-contrast .eds-checkbox__icon {
|
|
581
|
-
border-color: var(--components-form-checkbox-contrast-border);
|
|
582
|
-
}
|
|
583
|
-
.eds-checkbox__icon .eds-checkbox-icon {
|
|
584
|
-
height: 1rem;
|
|
585
|
-
width: 1rem;
|
|
586
|
-
visibility: hidden;
|
|
587
|
-
}
|
|
588
|
-
.eds-checkbox__icon .eds-checkbox-icon path {
|
|
589
|
-
transform-origin: 50% 50%;
|
|
590
|
-
stroke-dasharray: 48;
|
|
591
|
-
stroke-dashoffset: 48;
|
|
592
|
-
stroke-width: 0.375rem;
|
|
593
|
-
}
|
|
594
|
-
|
|
595
|
-
@keyframes stroke {
|
|
596
|
-
100% {
|
|
597
|
-
stroke-dashoffset: 0;
|
|
598
|
-
}
|
|
599
|
-
}
|
|
600
|
-
/* DO NOT CHANGE!*/
|
|
601
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
602
514
|
/* DO NOT CHANGE!*/
|
|
603
515
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
604
516
|
/* DO NOT CHANGE!*/
|
|
@@ -765,125 +677,6 @@
|
|
|
765
677
|
}
|
|
766
678
|
/* DO NOT CHANGE!*/
|
|
767
679
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
768
|
-
.eds-switch {
|
|
769
|
-
cursor: pointer;
|
|
770
|
-
-webkit-user-select: none;
|
|
771
|
-
-moz-user-select: none;
|
|
772
|
-
user-select: none;
|
|
773
|
-
padding: 0.5rem 0;
|
|
774
|
-
width: -moz-fit-content;
|
|
775
|
-
width: fit-content;
|
|
776
|
-
}
|
|
777
|
-
.eds-switch input {
|
|
778
|
-
opacity: 0;
|
|
779
|
-
pointer-events: none;
|
|
780
|
-
position: absolute;
|
|
781
|
-
}
|
|
782
|
-
.eds-switch--right {
|
|
783
|
-
display: flex;
|
|
784
|
-
flex-direction: row;
|
|
785
|
-
align-items: center;
|
|
786
|
-
}
|
|
787
|
-
.eds-switch--bottom {
|
|
788
|
-
display: flex;
|
|
789
|
-
flex-direction: column;
|
|
790
|
-
align-items: center;
|
|
791
|
-
}
|
|
792
|
-
.eds-switch__circle {
|
|
793
|
-
border-radius: 50%;
|
|
794
|
-
height: 1.25rem;
|
|
795
|
-
width: 1.25rem;
|
|
796
|
-
content: "";
|
|
797
|
-
display: flex;
|
|
798
|
-
align-items: center;
|
|
799
|
-
justify-content: center;
|
|
800
|
-
transition: left 0.1s ease-in-out, background-color 0.1s ease-in-out;
|
|
801
|
-
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
|
|
802
|
-
background-color: var(--components-form-switch-standard-switch);
|
|
803
|
-
top: 0.125rem;
|
|
804
|
-
left: 0.125rem;
|
|
805
|
-
position: relative;
|
|
806
|
-
}
|
|
807
|
-
.eds-switch__switch--large .eds-switch__circle {
|
|
808
|
-
height: 1.75rem;
|
|
809
|
-
width: 1.75rem;
|
|
810
|
-
}
|
|
811
|
-
.eds-contrast .eds-switch__circle {
|
|
812
|
-
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
|
|
813
|
-
}
|
|
814
|
-
.eds-switch__switch {
|
|
815
|
-
position: relative;
|
|
816
|
-
background-color: var(--components-form-switch-standard-fill-false);
|
|
817
|
-
content: "";
|
|
818
|
-
display: block;
|
|
819
|
-
transition: background-color 0.1s ease-in-out;
|
|
820
|
-
height: 1.5rem;
|
|
821
|
-
width: 3rem;
|
|
822
|
-
border-radius: 1.5rem;
|
|
823
|
-
box-shadow: inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
|
|
824
|
-
}
|
|
825
|
-
.eds-contrast .eds-switch__switch {
|
|
826
|
-
background-color: var(--components-form-switch-contrast-fill-false);
|
|
827
|
-
}
|
|
828
|
-
.eds-switch--right .eds-switch__switch {
|
|
829
|
-
margin-right: 0.75rem;
|
|
830
|
-
}
|
|
831
|
-
.eds-switch__switch svg g,
|
|
832
|
-
.eds-switch__switch path {
|
|
833
|
-
fill: var(--components-form-switch-standard-icon-false);
|
|
834
|
-
transition: fill ease-in-out 0.1s;
|
|
835
|
-
}
|
|
836
|
-
.eds-contrast .eds-switch__switch svg g,
|
|
837
|
-
.eds-contrast .eds-switch__switch path {
|
|
838
|
-
fill: var(--components-form-switch-contrast-icon-false);
|
|
839
|
-
}
|
|
840
|
-
:checked + .eds-switch__switch {
|
|
841
|
-
background-color: var(--eds-switch-color);
|
|
842
|
-
}
|
|
843
|
-
:checked + .eds-switch__switch .eds-switch__circle {
|
|
844
|
-
left: 1.625rem;
|
|
845
|
-
}
|
|
846
|
-
:checked + .eds-switch__switch .eds-switch__circle svg g,
|
|
847
|
-
:checked + .eds-switch__switch .eds-switch__circle path {
|
|
848
|
-
fill: var(--eds-switch-color);
|
|
849
|
-
}
|
|
850
|
-
.eds-contrast :checked + .eds-switch__switch {
|
|
851
|
-
background-color: var(--eds-switch-contrast-color);
|
|
852
|
-
}
|
|
853
|
-
:focus-visible + .eds-switch__switch {
|
|
854
|
-
outline: 2px solid #181c56;
|
|
855
|
-
outline-color: var(--basecolors-stroke-focus-standard);
|
|
856
|
-
outline-offset: 0.125rem;
|
|
857
|
-
}
|
|
858
|
-
.eds-contrast :focus-visible + .eds-switch__switch {
|
|
859
|
-
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
860
|
-
}
|
|
861
|
-
.eds-switch__switch--large {
|
|
862
|
-
width: 3.75rem;
|
|
863
|
-
height: 2rem;
|
|
864
|
-
border-radius: 3.75rem;
|
|
865
|
-
}
|
|
866
|
-
:checked + .eds-switch__switch--large .eds-switch__circle {
|
|
867
|
-
left: 1.875rem;
|
|
868
|
-
}
|
|
869
|
-
.eds-switch__switch--large svg {
|
|
870
|
-
position: relative;
|
|
871
|
-
right: 0.05rem;
|
|
872
|
-
}
|
|
873
|
-
.eds-switch__label--large--right {
|
|
874
|
-
font-size: 1rem;
|
|
875
|
-
}
|
|
876
|
-
.eds-switch__label--large--bottom {
|
|
877
|
-
font-size: 0.875rem;
|
|
878
|
-
}
|
|
879
|
-
.eds-switch__label--medium--right {
|
|
880
|
-
font-size: 0.875rem;
|
|
881
|
-
}
|
|
882
|
-
.eds-switch__label--medium--bottom {
|
|
883
|
-
font-size: 0.75rem;
|
|
884
|
-
}
|
|
885
|
-
/* DO NOT CHANGE!*/
|
|
886
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
887
680
|
.eds-input-panel:has(:focus-visible) .eds-input-panel__container {
|
|
888
681
|
outline: 2px solid #181c56;
|
|
889
682
|
outline-color: var(--basecolors-stroke-focus-standard);
|
|
@@ -1032,6 +825,213 @@ input:disabled + .eds-input-panel__container {
|
|
|
1032
825
|
}
|
|
1033
826
|
/* DO NOT CHANGE!*/
|
|
1034
827
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
828
|
+
.eds-switch {
|
|
829
|
+
cursor: pointer;
|
|
830
|
+
-webkit-user-select: none;
|
|
831
|
+
-moz-user-select: none;
|
|
832
|
+
user-select: none;
|
|
833
|
+
padding: 0.5rem 0;
|
|
834
|
+
width: -moz-fit-content;
|
|
835
|
+
width: fit-content;
|
|
836
|
+
}
|
|
837
|
+
.eds-switch input {
|
|
838
|
+
opacity: 0;
|
|
839
|
+
pointer-events: none;
|
|
840
|
+
position: absolute;
|
|
841
|
+
}
|
|
842
|
+
.eds-switch--right {
|
|
843
|
+
display: flex;
|
|
844
|
+
flex-direction: row;
|
|
845
|
+
align-items: center;
|
|
846
|
+
}
|
|
847
|
+
.eds-switch--bottom {
|
|
848
|
+
display: flex;
|
|
849
|
+
flex-direction: column;
|
|
850
|
+
align-items: center;
|
|
851
|
+
}
|
|
852
|
+
.eds-switch__circle {
|
|
853
|
+
border-radius: 50%;
|
|
854
|
+
height: 1.25rem;
|
|
855
|
+
width: 1.25rem;
|
|
856
|
+
content: "";
|
|
857
|
+
display: flex;
|
|
858
|
+
align-items: center;
|
|
859
|
+
justify-content: center;
|
|
860
|
+
transition: left 0.1s ease-in-out, background-color 0.1s ease-in-out;
|
|
861
|
+
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
|
|
862
|
+
background-color: var(--components-form-switch-standard-switch);
|
|
863
|
+
top: 0.125rem;
|
|
864
|
+
left: 0.125rem;
|
|
865
|
+
position: relative;
|
|
866
|
+
}
|
|
867
|
+
.eds-switch__switch--large .eds-switch__circle {
|
|
868
|
+
height: 1.75rem;
|
|
869
|
+
width: 1.75rem;
|
|
870
|
+
}
|
|
871
|
+
.eds-contrast .eds-switch__circle {
|
|
872
|
+
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
|
|
873
|
+
}
|
|
874
|
+
.eds-switch__switch {
|
|
875
|
+
position: relative;
|
|
876
|
+
background-color: var(--components-form-switch-standard-fill-false);
|
|
877
|
+
content: "";
|
|
878
|
+
display: block;
|
|
879
|
+
transition: background-color 0.1s ease-in-out;
|
|
880
|
+
height: 1.5rem;
|
|
881
|
+
width: 3rem;
|
|
882
|
+
border-radius: 1.5rem;
|
|
883
|
+
box-shadow: inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
|
|
884
|
+
}
|
|
885
|
+
.eds-contrast .eds-switch__switch {
|
|
886
|
+
background-color: var(--components-form-switch-contrast-fill-false);
|
|
887
|
+
}
|
|
888
|
+
.eds-switch--right .eds-switch__switch {
|
|
889
|
+
margin-right: 0.75rem;
|
|
890
|
+
}
|
|
891
|
+
.eds-switch__switch svg g,
|
|
892
|
+
.eds-switch__switch path {
|
|
893
|
+
fill: var(--components-form-switch-standard-icon-false);
|
|
894
|
+
transition: fill ease-in-out 0.1s;
|
|
895
|
+
}
|
|
896
|
+
.eds-contrast .eds-switch__switch svg g,
|
|
897
|
+
.eds-contrast .eds-switch__switch path {
|
|
898
|
+
fill: var(--components-form-switch-contrast-icon-false);
|
|
899
|
+
}
|
|
900
|
+
:checked + .eds-switch__switch {
|
|
901
|
+
background-color: var(--eds-switch-color);
|
|
902
|
+
}
|
|
903
|
+
:checked + .eds-switch__switch .eds-switch__circle {
|
|
904
|
+
left: 1.625rem;
|
|
905
|
+
}
|
|
906
|
+
:checked + .eds-switch__switch .eds-switch__circle svg g,
|
|
907
|
+
:checked + .eds-switch__switch .eds-switch__circle path {
|
|
908
|
+
fill: var(--eds-switch-color);
|
|
909
|
+
}
|
|
910
|
+
.eds-contrast :checked + .eds-switch__switch {
|
|
911
|
+
background-color: var(--eds-switch-contrast-color);
|
|
912
|
+
}
|
|
913
|
+
:focus-visible + .eds-switch__switch {
|
|
914
|
+
outline: 2px solid #181c56;
|
|
915
|
+
outline-color: var(--basecolors-stroke-focus-standard);
|
|
916
|
+
outline-offset: 0.125rem;
|
|
917
|
+
}
|
|
918
|
+
.eds-contrast :focus-visible + .eds-switch__switch {
|
|
919
|
+
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
920
|
+
}
|
|
921
|
+
.eds-switch__switch--large {
|
|
922
|
+
width: 3.75rem;
|
|
923
|
+
height: 2rem;
|
|
924
|
+
border-radius: 3.75rem;
|
|
925
|
+
}
|
|
926
|
+
:checked + .eds-switch__switch--large .eds-switch__circle {
|
|
927
|
+
left: 1.875rem;
|
|
928
|
+
}
|
|
929
|
+
.eds-switch__switch--large svg {
|
|
930
|
+
position: relative;
|
|
931
|
+
right: 0.05rem;
|
|
932
|
+
}
|
|
933
|
+
.eds-switch__label--large--right {
|
|
934
|
+
font-size: 1rem;
|
|
935
|
+
}
|
|
936
|
+
.eds-switch__label--large--bottom {
|
|
937
|
+
font-size: 0.875rem;
|
|
938
|
+
}
|
|
939
|
+
.eds-switch__label--medium--right {
|
|
940
|
+
font-size: 0.875rem;
|
|
941
|
+
}
|
|
942
|
+
.eds-switch__label--medium--bottom {
|
|
943
|
+
font-size: 0.75rem;
|
|
944
|
+
}
|
|
945
|
+
/* DO NOT CHANGE!*/
|
|
946
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
947
|
+
.eds-input-group {
|
|
948
|
+
color: inherit;
|
|
949
|
+
display: block;
|
|
950
|
+
position: relative;
|
|
951
|
+
}
|
|
952
|
+
.eds-input-group__label {
|
|
953
|
+
color: var(--components-form-baseform-standard-text-label);
|
|
954
|
+
display: flex;
|
|
955
|
+
font-size: 1rem;
|
|
956
|
+
position: absolute;
|
|
957
|
+
line-height: 1rem;
|
|
958
|
+
height: 3rem;
|
|
959
|
+
padding-left: 0;
|
|
960
|
+
top: 1rem;
|
|
961
|
+
transition: top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
|
|
962
|
+
-webkit-user-select: none;
|
|
963
|
+
-moz-user-select: none;
|
|
964
|
+
user-select: none;
|
|
965
|
+
pointer-events: none;
|
|
966
|
+
}
|
|
967
|
+
.eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
968
|
+
top: 0.375rem;
|
|
969
|
+
font-size: 0.75rem;
|
|
970
|
+
line-height: 0.75rem;
|
|
971
|
+
height: 10px;
|
|
972
|
+
padding: 0;
|
|
973
|
+
}
|
|
974
|
+
.eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
975
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
976
|
+
background: var(--textarea-label-background);
|
|
977
|
+
width: calc(100% - 1rem - 1rem - 4px);
|
|
978
|
+
}
|
|
979
|
+
.eds-form-control-wrapper--is-filled.eds-form-control-wrapper--size-large .eds-input-group__label {
|
|
980
|
+
top: 0.5rem;
|
|
981
|
+
font-size: 0.875rem;
|
|
982
|
+
line-height: 1rem;
|
|
983
|
+
padding: 0;
|
|
984
|
+
}
|
|
985
|
+
.eds-form-control-wrapper--size-large .eds-input-group__label {
|
|
986
|
+
top: 0.75rem;
|
|
987
|
+
font-size: 1.5rem;
|
|
988
|
+
line-height: 2.25rem;
|
|
989
|
+
}
|
|
990
|
+
.eds-input-group__label--filled {
|
|
991
|
+
top: 0.375rem;
|
|
992
|
+
font-size: 0.75rem;
|
|
993
|
+
line-height: 0.75rem;
|
|
994
|
+
height: 10px;
|
|
995
|
+
padding: 0;
|
|
996
|
+
}
|
|
997
|
+
.eds-textarea__label .eds-input-group__label--filled {
|
|
998
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
999
|
+
background: var(--textarea-label-background);
|
|
1000
|
+
width: calc(100% - 1rem - 1rem - 4px);
|
|
1001
|
+
}
|
|
1002
|
+
.eds-form-control-wrapper--size-large .eds-input-group__label--filled {
|
|
1003
|
+
top: 0.5rem;
|
|
1004
|
+
font-size: 0.875rem;
|
|
1005
|
+
line-height: 1rem;
|
|
1006
|
+
padding: 0;
|
|
1007
|
+
}
|
|
1008
|
+
|
|
1009
|
+
.eds-form-control-wrapper:focus-within .eds-input-group__label {
|
|
1010
|
+
top: 0.375rem;
|
|
1011
|
+
font-size: 0.75rem;
|
|
1012
|
+
line-height: 0.75rem;
|
|
1013
|
+
height: 10px;
|
|
1014
|
+
padding: 0;
|
|
1015
|
+
}
|
|
1016
|
+
.eds-textarea__label .eds-form-control-wrapper:focus-within .eds-input-group__label {
|
|
1017
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
1018
|
+
background: var(--textarea-label-background);
|
|
1019
|
+
width: calc(100% - 1rem - 1rem - 4px);
|
|
1020
|
+
}
|
|
1021
|
+
.eds-form-control-wrapper--size-large:focus-within .eds-input-group__label {
|
|
1022
|
+
top: 0.5rem;
|
|
1023
|
+
font-size: 0.875rem;
|
|
1024
|
+
line-height: 1rem;
|
|
1025
|
+
padding: 0;
|
|
1026
|
+
}
|
|
1027
|
+
.eds-form-control-wrapper--disabled:focus-within .eds-input-group__label {
|
|
1028
|
+
top: 1rem;
|
|
1029
|
+
font-size: 1rem;
|
|
1030
|
+
height: 3rem;
|
|
1031
|
+
line-height: 1rem;
|
|
1032
|
+
}
|
|
1033
|
+
/* DO NOT CHANGE!*/
|
|
1034
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
1035
1035
|
.eds-textfield__clear-button {
|
|
1036
1036
|
background: none;
|
|
1037
1037
|
border: none;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/form",
|
|
3
|
-
"version": "8.2.
|
|
3
|
+
"version": "8.2.8",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/form.esm.js",
|
|
@@ -27,16 +27,16 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/button": "^3.3.
|
|
31
|
-
"@entur/icons": "^7.
|
|
30
|
+
"@entur/button": "^3.3.8",
|
|
31
|
+
"@entur/icons": "^7.11.1",
|
|
32
32
|
"@entur/tokens": "^3.19.0",
|
|
33
|
-
"@entur/tooltip": "^5.2.
|
|
34
|
-
"@entur/typography": "^1.9.
|
|
33
|
+
"@entur/tooltip": "^5.2.8",
|
|
34
|
+
"@entur/typography": "^1.9.8",
|
|
35
35
|
"@entur/utils": "^0.12.3",
|
|
36
36
|
"classnames": "^2.3.1"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
39
|
"dts-cli": "2.0.5"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "af6fc58f70a8e98b774cd4c19478392c802b071f"
|
|
42
42
|
}
|