@entur/form 5.3.6 → 5.3.9
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/CHANGELOG.md +14 -0
- package/dist/styles.css +297 -301
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,20 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [5.3.9](https://bitbucket.org/enturas/design-system/compare/@entur/form@5.3.8...@entur/form@5.3.9) (2022-07-05)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- **validation exclamation icon:** fix icon colours for validation exclamation icon in react native ([4e64eb8](https://bitbucket.org/enturas/design-system/commits/4e64eb86fd1b98731b47ac040ce578e8ee0aa956))
|
|
11
|
+
|
|
12
|
+
## [5.3.8](https://bitbucket.org/enturas/design-system/compare/@entur/form@5.3.7...@entur/form@5.3.8) (2022-06-28)
|
|
13
|
+
|
|
14
|
+
**Note:** Version bump only for package @entur/form
|
|
15
|
+
|
|
16
|
+
## [5.3.7](https://bitbucket.org/enturas/design-system/compare/@entur/form@5.3.6...@entur/form@5.3.7) (2022-06-24)
|
|
17
|
+
|
|
18
|
+
**Note:** Version bump only for package @entur/form
|
|
19
|
+
|
|
6
20
|
## [5.3.6](https://bitbucket.org/enturas/design-system/compare/@entur/form@5.3.5...@entur/form@5.3.6) (2022-06-02)
|
|
7
21
|
|
|
8
22
|
**Note:** Version bump only for package @entur/form
|
package/dist/styles.css
CHANGED
|
@@ -2,13 +2,193 @@
|
|
|
2
2
|
--eds-form: 1;
|
|
3
3
|
}/* DO NOT CHANGE!*/
|
|
4
4
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
|
-
.eds-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
.eds-feedback-text {
|
|
6
|
+
display: flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
margin-top: 0.25rem;
|
|
9
9
|
}
|
|
10
|
-
.eds-
|
|
11
|
-
|
|
10
|
+
.eds-feedback-text--info {
|
|
11
|
+
padding-left: calc(1rem + 0.125rem);
|
|
12
|
+
}
|
|
13
|
+
.eds-feedback-text__text {
|
|
14
|
+
color: #181c56;
|
|
15
|
+
}
|
|
16
|
+
.eds-contrast .eds-feedback-text__text {
|
|
17
|
+
color: #ffffff;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.eds-feedback-text__icon {
|
|
21
|
+
font-size: 1.5rem;
|
|
22
|
+
min-height: 1.5rem;
|
|
23
|
+
min-width: 1.5rem;
|
|
24
|
+
padding-right: 0.5rem;
|
|
25
|
+
position: relative;
|
|
26
|
+
top: -0.1rem;
|
|
27
|
+
}
|
|
28
|
+
.eds-feedback-text__icon--success {
|
|
29
|
+
color: #1a8e60;
|
|
30
|
+
}
|
|
31
|
+
.eds-contrast .eds-feedback-text__icon--success {
|
|
32
|
+
color: #5ac39a;
|
|
33
|
+
}
|
|
34
|
+
.eds-feedback-text__icon--error {
|
|
35
|
+
color: #d31b1b;
|
|
36
|
+
}
|
|
37
|
+
.eds-contrast .eds-feedback-text__icon--error {
|
|
38
|
+
color: #ff9494;
|
|
39
|
+
}
|
|
40
|
+
.eds-feedback-text__icon--info {
|
|
41
|
+
color: #0082b9;
|
|
42
|
+
}
|
|
43
|
+
.eds-contrast .eds-feedback-text__icon--info {
|
|
44
|
+
color: #64b3e7;
|
|
45
|
+
}
|
|
46
|
+
.eds-feedback-text__icon--warning {
|
|
47
|
+
color: #ffca28;
|
|
48
|
+
}
|
|
49
|
+
.eds-feedback-text__icon--warning circle {
|
|
50
|
+
fill: #181c56;
|
|
51
|
+
}
|
|
52
|
+
.eds-contrast .eds-feedback-text__icon--warning {
|
|
53
|
+
color: #ffe082;
|
|
54
|
+
}/* DO NOT CHANGE!*/
|
|
55
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
56
|
+
.eds-checkbox__container {
|
|
57
|
+
display: flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
position: relative;
|
|
60
|
+
-webkit-appearance: none;
|
|
61
|
+
-moz-appearance: none;
|
|
62
|
+
appearance: none;
|
|
63
|
+
cursor: pointer;
|
|
64
|
+
height: 2rem;
|
|
65
|
+
-webkit-user-select: none;
|
|
66
|
+
-moz-user-select: none;
|
|
67
|
+
-ms-user-select: none;
|
|
68
|
+
user-select: none;
|
|
69
|
+
width: -webkit-fit-content;
|
|
70
|
+
width: -moz-fit-content;
|
|
71
|
+
width: fit-content;
|
|
72
|
+
}
|
|
73
|
+
.eds-checkbox__container--reduced-click-area {
|
|
74
|
+
height: -webkit-fit-content;
|
|
75
|
+
height: -moz-fit-content;
|
|
76
|
+
height: fit-content;
|
|
77
|
+
}
|
|
78
|
+
.eds-checkbox__container input {
|
|
79
|
+
position: absolute;
|
|
80
|
+
opacity: 0;
|
|
81
|
+
height: 0;
|
|
82
|
+
width: 0;
|
|
83
|
+
}
|
|
84
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
85
|
+
background-color: #181c56;
|
|
86
|
+
}
|
|
87
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
|
|
88
|
+
visibility: visible;
|
|
89
|
+
}
|
|
90
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon__path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon__path {
|
|
91
|
+
stroke: #ffffff;
|
|
92
|
+
-webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
93
|
+
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
94
|
+
}
|
|
95
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
|
|
96
|
+
opacity: 0.5;
|
|
97
|
+
}
|
|
98
|
+
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled .eds-checkbox-icon__path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled .eds-checkbox-icon__path {
|
|
99
|
+
opacity: 0.5;
|
|
100
|
+
}
|
|
101
|
+
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
102
|
+
background: #54568c;
|
|
103
|
+
}
|
|
104
|
+
.eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
105
|
+
border-color: #54568c;
|
|
106
|
+
background: #f3f3f3;
|
|
107
|
+
}
|
|
108
|
+
.eds-contrast .eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
109
|
+
border-color: #656782;
|
|
110
|
+
background: #292b6a;
|
|
111
|
+
}
|
|
112
|
+
.eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
|
|
113
|
+
.eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
|
|
114
|
+
border-color: #54568c;
|
|
115
|
+
background-color: #54568c;
|
|
116
|
+
}
|
|
117
|
+
.eds-contrast .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
|
|
118
|
+
.eds-contrast .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
|
|
119
|
+
background: #8285a8;
|
|
120
|
+
border-color: #8285a8;
|
|
121
|
+
}
|
|
122
|
+
.eds-checkbox__container:focus + .eds-checkbox__icon,
|
|
123
|
+
.eds-checkbox__container [focus-within] + .eds-checkbox__icon {
|
|
124
|
+
outline: none;
|
|
125
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
126
|
+
outline-offset: 0.125rem;
|
|
127
|
+
}
|
|
128
|
+
.eds-checkbox__container:focus + .eds-checkbox__icon,
|
|
129
|
+
.eds-checkbox__container :focus-within + .eds-checkbox__icon {
|
|
130
|
+
outline: none;
|
|
131
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
132
|
+
outline-offset: 0.125rem;
|
|
133
|
+
}
|
|
134
|
+
.eds-contrast .eds-checkbox__container:focus + .eds-checkbox__icon,
|
|
135
|
+
.eds-contrast .eds-checkbox__container [focus-within] + .eds-checkbox__icon {
|
|
136
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
137
|
+
}
|
|
138
|
+
.eds-contrast .eds-checkbox__container:focus + .eds-checkbox__icon,
|
|
139
|
+
.eds-contrast .eds-checkbox__container :focus-within + .eds-checkbox__icon {
|
|
140
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
141
|
+
}
|
|
142
|
+
.eds-checkbox--disabled {
|
|
143
|
+
pointer-events: none;
|
|
144
|
+
}
|
|
145
|
+
.eds-checkbox--disabled .eds-checkbox__label {
|
|
146
|
+
opacity: 0.5;
|
|
147
|
+
}
|
|
148
|
+
.eds-checkbox--disabled .eds-checkbox__icon {
|
|
149
|
+
opacity: 0.5;
|
|
150
|
+
}
|
|
151
|
+
.eds-checkbox__icon {
|
|
152
|
+
display: inline-flex;
|
|
153
|
+
justify-content: center;
|
|
154
|
+
align-items: center;
|
|
155
|
+
position: relative;
|
|
156
|
+
margin-right: 1rem;
|
|
157
|
+
height: 1.25rem;
|
|
158
|
+
width: 1.25rem;
|
|
159
|
+
border: 0.125rem solid #181c56;
|
|
160
|
+
border-radius: 0.0625rem;
|
|
161
|
+
background-color: transparent;
|
|
162
|
+
color: #ffffff;
|
|
163
|
+
}
|
|
164
|
+
.eds-checkbox__icon--reduced-click-area {
|
|
165
|
+
margin-right: 0;
|
|
166
|
+
}
|
|
167
|
+
.eds-contrast .eds-checkbox__icon {
|
|
168
|
+
border-color: #54568c;
|
|
169
|
+
}
|
|
170
|
+
.eds-checkbox__icon .eds-checkbox-icon {
|
|
171
|
+
height: 1rem;
|
|
172
|
+
width: 1rem;
|
|
173
|
+
visibility: hidden;
|
|
174
|
+
}
|
|
175
|
+
.eds-checkbox__icon .eds-checkbox-icon__path {
|
|
176
|
+
transform-origin: 50% 50%;
|
|
177
|
+
stroke-dasharray: 48;
|
|
178
|
+
stroke-dashoffset: 48;
|
|
179
|
+
stroke-width: 0.375rem;
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
@-webkit-keyframes stroke {
|
|
183
|
+
100% {
|
|
184
|
+
stroke-dashoffset: 0;
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
@keyframes stroke {
|
|
189
|
+
100% {
|
|
190
|
+
stroke-dashoffset: 0;
|
|
191
|
+
}
|
|
12
192
|
}/* DO NOT CHANGE!*/
|
|
13
193
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
14
194
|
.eds-form-control-wrapper {
|
|
@@ -267,142 +447,139 @@
|
|
|
267
447
|
margin-left: 0;
|
|
268
448
|
}/* DO NOT CHANGE!*/
|
|
269
449
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
270
|
-
.eds-
|
|
271
|
-
|
|
272
|
-
|
|
450
|
+
.eds-fieldset {
|
|
451
|
+
margin: 0;
|
|
452
|
+
padding: 0;
|
|
453
|
+
border: 0;
|
|
454
|
+
}
|
|
455
|
+
.eds-fieldset .eds-legend {
|
|
456
|
+
margin: 0 0 0.5rem;
|
|
457
|
+
}/* DO NOT CHANGE!*/
|
|
458
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
459
|
+
.eds-input-group {
|
|
460
|
+
color: inherit;
|
|
461
|
+
display: block;
|
|
273
462
|
position: relative;
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
463
|
+
}
|
|
464
|
+
.eds-input-group__label {
|
|
465
|
+
color: #656782;
|
|
466
|
+
display: flex;
|
|
467
|
+
font-size: 1rem;
|
|
468
|
+
position: absolute;
|
|
469
|
+
line-height: 1rem;
|
|
470
|
+
height: 3rem;
|
|
471
|
+
padding: 1rem;
|
|
472
|
+
padding-left: 0;
|
|
473
|
+
margin-left: 1rem;
|
|
474
|
+
top: -0.125rem;
|
|
475
|
+
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;
|
|
279
476
|
-webkit-user-select: none;
|
|
280
477
|
-moz-user-select: none;
|
|
281
478
|
-ms-user-select: none;
|
|
282
479
|
user-select: none;
|
|
283
|
-
|
|
284
|
-
width: -moz-fit-content;
|
|
285
|
-
width: fit-content;
|
|
286
|
-
}
|
|
287
|
-
.eds-checkbox__container--reduced-click-area {
|
|
288
|
-
height: -webkit-fit-content;
|
|
289
|
-
height: -moz-fit-content;
|
|
290
|
-
height: fit-content;
|
|
291
|
-
}
|
|
292
|
-
.eds-checkbox__container input {
|
|
293
|
-
position: absolute;
|
|
294
|
-
opacity: 0;
|
|
295
|
-
height: 0;
|
|
296
|
-
width: 0;
|
|
297
|
-
}
|
|
298
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
299
|
-
background-color: #181c56;
|
|
300
|
-
}
|
|
301
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
|
|
302
|
-
visibility: visible;
|
|
303
|
-
}
|
|
304
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon__path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon__path {
|
|
305
|
-
stroke: #ffffff;
|
|
306
|
-
-webkit-animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
307
|
-
animation: stroke ease-in-out 0.2s 0.1s forwards;
|
|
308
|
-
}
|
|
309
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
|
|
310
|
-
opacity: 0.5;
|
|
311
|
-
}
|
|
312
|
-
.eds-checkbox__container input:checked + .eds-checkbox__icon--disabled .eds-checkbox-icon__path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled .eds-checkbox-icon__path {
|
|
313
|
-
opacity: 0.5;
|
|
314
|
-
}
|
|
315
|
-
.eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
|
|
316
|
-
background: #54568c;
|
|
317
|
-
}
|
|
318
|
-
.eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
319
|
-
border-color: #54568c;
|
|
320
|
-
background: #f3f3f3;
|
|
321
|
-
}
|
|
322
|
-
.eds-contrast .eds-checkbox__container:hover input + .eds-checkbox__icon {
|
|
323
|
-
border-color: #656782;
|
|
324
|
-
background: #292b6a;
|
|
480
|
+
pointer-events: none;
|
|
325
481
|
}
|
|
326
|
-
.eds-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
482
|
+
.eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
483
|
+
top: calc(0.5rem - 0.125rem);
|
|
484
|
+
font-size: 0.75rem;
|
|
485
|
+
line-height: 0.75rem;
|
|
486
|
+
height: 10px;
|
|
487
|
+
padding: 0;
|
|
488
|
+
margin-left: 1rem;
|
|
330
489
|
}
|
|
331
|
-
.eds-
|
|
332
|
-
|
|
333
|
-
background:
|
|
334
|
-
|
|
490
|
+
.eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
491
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
492
|
+
background: var(--textarea-label-background);
|
|
493
|
+
width: calc( 100% - 1rem - 1rem - 4px );
|
|
335
494
|
}
|
|
336
|
-
.eds-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
495
|
+
.eds-form-control-wrapper--size-large .eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
496
|
+
top: 0.5rem;
|
|
497
|
+
font-size: 0.875rem;
|
|
498
|
+
line-height: 1rem;
|
|
499
|
+
padding: 0;
|
|
500
|
+
margin-left: 1rem;
|
|
341
501
|
}
|
|
342
|
-
.eds-
|
|
343
|
-
|
|
344
|
-
outline: none;
|
|
345
|
-
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
346
|
-
outline-offset: 0.125rem;
|
|
502
|
+
.eds-contrast .eds-input-group__label {
|
|
503
|
+
color: #8285a8;
|
|
347
504
|
}
|
|
348
|
-
.eds-contrast .eds-
|
|
349
|
-
|
|
350
|
-
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
505
|
+
.eds-contrast .eds-form-control-wrapper--dark .eds-input-group__label {
|
|
506
|
+
color: #aeb7e2;
|
|
351
507
|
}
|
|
352
|
-
.eds-
|
|
353
|
-
|
|
354
|
-
|
|
508
|
+
.eds-form-control-wrapper--size-large .eds-input-group__label {
|
|
509
|
+
font-size: 1.5rem;
|
|
510
|
+
line-height: 2.25rem;
|
|
511
|
+
height: 4rem;
|
|
355
512
|
}
|
|
356
|
-
.eds-
|
|
357
|
-
|
|
513
|
+
.eds-input-group__label--filled {
|
|
514
|
+
top: calc(0.5rem - 0.125rem);
|
|
515
|
+
font-size: 0.75rem;
|
|
516
|
+
line-height: 0.75rem;
|
|
517
|
+
height: 10px;
|
|
518
|
+
padding: 0;
|
|
519
|
+
margin-left: 1rem;
|
|
358
520
|
}
|
|
359
|
-
.eds-
|
|
360
|
-
|
|
521
|
+
.eds-textarea__label .eds-input-group__label--filled {
|
|
522
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
523
|
+
background: var(--textarea-label-background);
|
|
524
|
+
width: calc( 100% - 1rem - 1rem - 4px );
|
|
361
525
|
}
|
|
362
|
-
.eds-
|
|
363
|
-
|
|
526
|
+
.eds-form-control-wrapper--size-large .eds-input-group__label--filled {
|
|
527
|
+
top: 0.5rem;
|
|
528
|
+
font-size: 0.875rem;
|
|
529
|
+
line-height: 1rem;
|
|
530
|
+
padding: 0;
|
|
531
|
+
margin-left: 1rem;
|
|
364
532
|
}
|
|
365
|
-
.eds-
|
|
366
|
-
|
|
367
|
-
|
|
533
|
+
.eds-input-group__label-tooltip-icon {
|
|
534
|
+
color: #0082b9;
|
|
535
|
+
padding-left: 0.25rem;
|
|
536
|
+
padding-right: 0.25rem;
|
|
537
|
+
display: flex;
|
|
368
538
|
align-items: center;
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
height: 1.25rem;
|
|
372
|
-
width: 1.25rem;
|
|
373
|
-
border: 0.125rem solid #181c56;
|
|
374
|
-
border-radius: 0.0625rem;
|
|
375
|
-
background-color: transparent;
|
|
376
|
-
color: #ffffff;
|
|
539
|
+
cursor: help;
|
|
540
|
+
font-size: 1rem;
|
|
377
541
|
}
|
|
378
|
-
|
|
379
|
-
|
|
542
|
+
|
|
543
|
+
.eds-form-control-wrapper[focus-within] .eds-input-group__label {
|
|
544
|
+
top: calc(0.5rem - 0.125rem);
|
|
545
|
+
font-size: 0.75rem;
|
|
546
|
+
line-height: 0.75rem;
|
|
547
|
+
height: 10px;
|
|
548
|
+
padding: 0;
|
|
549
|
+
margin-left: 1rem;
|
|
380
550
|
}
|
|
381
|
-
|
|
382
|
-
|
|
551
|
+
|
|
552
|
+
.eds-form-control-wrapper:focus-within .eds-input-group__label {
|
|
553
|
+
top: calc(0.5rem - 0.125rem);
|
|
554
|
+
font-size: 0.75rem;
|
|
555
|
+
line-height: 0.75rem;
|
|
556
|
+
height: 10px;
|
|
557
|
+
padding: 0;
|
|
558
|
+
margin-left: 1rem;
|
|
383
559
|
}
|
|
384
|
-
.eds-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
560
|
+
.eds-textarea__label .eds-form-control-wrapper[focus-within] .eds-input-group__label {
|
|
561
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
562
|
+
background: var(--textarea-label-background);
|
|
563
|
+
width: calc( 100% - 1rem - 1rem - 4px );
|
|
388
564
|
}
|
|
389
|
-
.eds-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
stroke-width: 0.375rem;
|
|
565
|
+
.eds-textarea__label .eds-form-control-wrapper:focus-within .eds-input-group__label {
|
|
566
|
+
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
567
|
+
background: var(--textarea-label-background);
|
|
568
|
+
width: calc( 100% - 1rem - 1rem - 4px );
|
|
394
569
|
}
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
570
|
+
.eds-form-control-wrapper--size-large[focus-within] .eds-input-group__label {
|
|
571
|
+
top: 0.5rem;
|
|
572
|
+
font-size: 0.875rem;
|
|
573
|
+
line-height: 1rem;
|
|
574
|
+
padding: 0;
|
|
575
|
+
margin-left: 1rem;
|
|
400
576
|
}
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
577
|
+
.eds-form-control-wrapper--size-large:focus-within .eds-input-group__label {
|
|
578
|
+
top: 0.5rem;
|
|
579
|
+
font-size: 0.875rem;
|
|
580
|
+
line-height: 1rem;
|
|
581
|
+
padding: 0;
|
|
582
|
+
margin-left: 1rem;
|
|
406
583
|
}/* DO NOT CHANGE!*/
|
|
407
584
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
408
585
|
textarea.eds-form-control.eds-textarea {
|
|
@@ -447,61 +624,6 @@ textarea.eds-form-control.eds-textarea {
|
|
|
447
624
|
background-color: #8285a8;
|
|
448
625
|
}/* DO NOT CHANGE!*/
|
|
449
626
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
450
|
-
.eds-feedback-text {
|
|
451
|
-
display: flex;
|
|
452
|
-
align-items: center;
|
|
453
|
-
margin-top: 0.25rem;
|
|
454
|
-
}
|
|
455
|
-
.eds-feedback-text--info {
|
|
456
|
-
padding-left: calc(1rem + 0.125rem);
|
|
457
|
-
}
|
|
458
|
-
.eds-feedback-text__text {
|
|
459
|
-
color: #181c56;
|
|
460
|
-
}
|
|
461
|
-
.eds-contrast .eds-feedback-text__text {
|
|
462
|
-
color: #ffffff;
|
|
463
|
-
}
|
|
464
|
-
|
|
465
|
-
.eds-feedback-text__icon {
|
|
466
|
-
font-size: 1.5rem;
|
|
467
|
-
min-height: 1.5rem;
|
|
468
|
-
min-width: 1.5rem;
|
|
469
|
-
padding-right: 0.5rem;
|
|
470
|
-
position: relative;
|
|
471
|
-
top: -0.1rem;
|
|
472
|
-
}
|
|
473
|
-
.eds-feedback-text__icon--success {
|
|
474
|
-
color: #1a8e60;
|
|
475
|
-
}
|
|
476
|
-
.eds-contrast .eds-feedback-text__icon--success {
|
|
477
|
-
color: #5ac39a;
|
|
478
|
-
}
|
|
479
|
-
.eds-feedback-text__icon--error {
|
|
480
|
-
color: #d31b1b;
|
|
481
|
-
}
|
|
482
|
-
.eds-contrast .eds-feedback-text__icon--error {
|
|
483
|
-
color: #ff9494;
|
|
484
|
-
}
|
|
485
|
-
.eds-feedback-text__icon--info {
|
|
486
|
-
color: #0082b9;
|
|
487
|
-
}
|
|
488
|
-
.eds-contrast .eds-feedback-text__icon--info {
|
|
489
|
-
color: #64b3e7;
|
|
490
|
-
}
|
|
491
|
-
.eds-feedback-text__icon--warning.eds-icon__ValidationExclamationIcon {
|
|
492
|
-
color: #ffca28;
|
|
493
|
-
}
|
|
494
|
-
.eds-feedback-text__icon--warning.eds-icon__ValidationExclamationIcon circle {
|
|
495
|
-
color: #181c56;
|
|
496
|
-
fill-opacity: 1;
|
|
497
|
-
}
|
|
498
|
-
.eds-contrast .eds-feedback-text__icon--warning.eds-icon__ValidationExclamationIcon {
|
|
499
|
-
color: #ffe082;
|
|
500
|
-
}
|
|
501
|
-
.eds-contrast .eds-feedback-text__icon--warning.eds-icon__ValidationExclamationIcon circle {
|
|
502
|
-
fill-opacity: 0;
|
|
503
|
-
}/* DO NOT CHANGE!*/
|
|
504
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
505
627
|
.eds-form-component--radio__container {
|
|
506
628
|
display: flex;
|
|
507
629
|
justify-content: center;
|
|
@@ -845,132 +967,6 @@ textarea.eds-form-control.eds-textarea {
|
|
|
845
967
|
stroke-width: 0.375rem;
|
|
846
968
|
}/* DO NOT CHANGE!*/
|
|
847
969
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
848
|
-
.eds-input-group {
|
|
849
|
-
color: inherit;
|
|
850
|
-
display: block;
|
|
851
|
-
position: relative;
|
|
852
|
-
}
|
|
853
|
-
.eds-input-group__label {
|
|
854
|
-
color: #656782;
|
|
855
|
-
display: flex;
|
|
856
|
-
font-size: 1rem;
|
|
857
|
-
position: absolute;
|
|
858
|
-
line-height: 1rem;
|
|
859
|
-
height: 3rem;
|
|
860
|
-
padding: 1rem;
|
|
861
|
-
padding-left: 0;
|
|
862
|
-
margin-left: 1rem;
|
|
863
|
-
top: -0.125rem;
|
|
864
|
-
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;
|
|
865
|
-
-webkit-user-select: none;
|
|
866
|
-
-moz-user-select: none;
|
|
867
|
-
-ms-user-select: none;
|
|
868
|
-
user-select: none;
|
|
869
|
-
pointer-events: none;
|
|
870
|
-
}
|
|
871
|
-
.eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
872
|
-
top: calc(0.5rem - 0.125rem);
|
|
873
|
-
font-size: 0.75rem;
|
|
874
|
-
line-height: 0.75rem;
|
|
875
|
-
height: 10px;
|
|
876
|
-
padding: 0;
|
|
877
|
-
margin-left: 1rem;
|
|
878
|
-
}
|
|
879
|
-
.eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
880
|
-
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
881
|
-
background: var(--textarea-label-background);
|
|
882
|
-
width: calc( 100% - 1rem - 1rem - 4px );
|
|
883
|
-
}
|
|
884
|
-
.eds-form-control-wrapper--size-large .eds-form-control-wrapper--is-filled .eds-input-group__label {
|
|
885
|
-
top: 0.5rem;
|
|
886
|
-
font-size: 0.875rem;
|
|
887
|
-
line-height: 1rem;
|
|
888
|
-
padding: 0;
|
|
889
|
-
margin-left: 1rem;
|
|
890
|
-
}
|
|
891
|
-
.eds-contrast .eds-input-group__label {
|
|
892
|
-
color: #8285a8;
|
|
893
|
-
}
|
|
894
|
-
.eds-contrast .eds-form-control-wrapper--dark .eds-input-group__label {
|
|
895
|
-
color: #aeb7e2;
|
|
896
|
-
}
|
|
897
|
-
.eds-form-control-wrapper--size-large .eds-input-group__label {
|
|
898
|
-
font-size: 1.5rem;
|
|
899
|
-
line-height: 2.25rem;
|
|
900
|
-
height: 4rem;
|
|
901
|
-
}
|
|
902
|
-
.eds-input-group__label--filled {
|
|
903
|
-
top: calc(0.5rem - 0.125rem);
|
|
904
|
-
font-size: 0.75rem;
|
|
905
|
-
line-height: 0.75rem;
|
|
906
|
-
height: 10px;
|
|
907
|
-
padding: 0;
|
|
908
|
-
margin-left: 1rem;
|
|
909
|
-
}
|
|
910
|
-
.eds-textarea__label .eds-input-group__label--filled {
|
|
911
|
-
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
912
|
-
background: var(--textarea-label-background);
|
|
913
|
-
width: calc( 100% - 1rem - 1rem - 4px );
|
|
914
|
-
}
|
|
915
|
-
.eds-form-control-wrapper--size-large .eds-input-group__label--filled {
|
|
916
|
-
top: 0.5rem;
|
|
917
|
-
font-size: 0.875rem;
|
|
918
|
-
line-height: 1rem;
|
|
919
|
-
padding: 0;
|
|
920
|
-
margin-left: 1rem;
|
|
921
|
-
}
|
|
922
|
-
.eds-input-group__label-tooltip-icon {
|
|
923
|
-
color: #0082b9;
|
|
924
|
-
padding-left: 0.25rem;
|
|
925
|
-
padding-right: 0.25rem;
|
|
926
|
-
display: flex;
|
|
927
|
-
align-items: center;
|
|
928
|
-
cursor: help;
|
|
929
|
-
font-size: 1rem;
|
|
930
|
-
}
|
|
931
|
-
|
|
932
|
-
.eds-form-control-wrapper[focus-within] .eds-input-group__label {
|
|
933
|
-
top: calc(0.5rem - 0.125rem);
|
|
934
|
-
font-size: 0.75rem;
|
|
935
|
-
line-height: 0.75rem;
|
|
936
|
-
height: 10px;
|
|
937
|
-
padding: 0;
|
|
938
|
-
margin-left: 1rem;
|
|
939
|
-
}
|
|
940
|
-
|
|
941
|
-
.eds-form-control-wrapper:focus-within .eds-input-group__label {
|
|
942
|
-
top: calc(0.5rem - 0.125rem);
|
|
943
|
-
font-size: 0.75rem;
|
|
944
|
-
line-height: 0.75rem;
|
|
945
|
-
height: 10px;
|
|
946
|
-
padding: 0;
|
|
947
|
-
margin-left: 1rem;
|
|
948
|
-
}
|
|
949
|
-
.eds-textarea__label .eds-form-control-wrapper[focus-within] .eds-input-group__label {
|
|
950
|
-
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
951
|
-
background: var(--textarea-label-background);
|
|
952
|
-
width: calc( 100% - 1rem - 1rem - 4px );
|
|
953
|
-
}
|
|
954
|
-
.eds-textarea__label .eds-form-control-wrapper:focus-within .eds-input-group__label {
|
|
955
|
-
box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
|
|
956
|
-
background: var(--textarea-label-background);
|
|
957
|
-
width: calc( 100% - 1rem - 1rem - 4px );
|
|
958
|
-
}
|
|
959
|
-
.eds-form-control-wrapper--size-large[focus-within] .eds-input-group__label {
|
|
960
|
-
top: 0.5rem;
|
|
961
|
-
font-size: 0.875rem;
|
|
962
|
-
line-height: 1rem;
|
|
963
|
-
padding: 0;
|
|
964
|
-
margin-left: 1rem;
|
|
965
|
-
}
|
|
966
|
-
.eds-form-control-wrapper--size-large:focus-within .eds-input-group__label {
|
|
967
|
-
top: 0.5rem;
|
|
968
|
-
font-size: 0.875rem;
|
|
969
|
-
line-height: 1rem;
|
|
970
|
-
padding: 0;
|
|
971
|
-
margin-left: 1rem;
|
|
972
|
-
}/* DO NOT CHANGE!*/
|
|
973
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
974
970
|
.eds-segmented-control {
|
|
975
971
|
margin-top: 0.25rem;
|
|
976
972
|
display: flex;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/form",
|
|
3
|
-
"version": "5.3.
|
|
3
|
+
"version": "5.3.9",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/form.esm.js",
|
|
@@ -27,12 +27,12 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/icons": "^4.
|
|
30
|
+
"@entur/icons": "^4.3.0",
|
|
31
31
|
"@entur/tokens": "^3.3.2",
|
|
32
|
-
"@entur/tooltip": "^2.5.
|
|
32
|
+
"@entur/tooltip": "^2.5.12",
|
|
33
33
|
"@entur/typography": "^1.6.14",
|
|
34
34
|
"@entur/utils": "^0.4.3",
|
|
35
35
|
"classnames": "^2.3.1"
|
|
36
36
|
},
|
|
37
|
-
"gitHead": "
|
|
37
|
+
"gitHead": "c58969a2ac3a5429137f84f9fe91888f4c4bcc4b"
|
|
38
38
|
}
|