@entur/form 8.1.4 → 8.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/styles.css +289 -289
  2. package/package.json +6 -6
package/dist/styles.css CHANGED
@@ -5,215 +5,6 @@
5
5
  }
6
6
  /* DO NOT CHANGE!*/
7
7
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
8
- .eds-form-control__field-and-feedback-text {
9
- display: flex;
10
- flex-direction: column;
11
- height: -moz-fit-content;
12
- height: fit-content;
13
- width: 100%;
14
- }
15
- .eds-form-control__field-and-feedback-text--has-tooltip {
16
- padding-right: 2rem;
17
- }
18
- .eds-form-control-wrapper {
19
- display: flex;
20
- align-items: center;
21
- position: relative;
22
- flex: 1;
23
- min-height: 3rem;
24
- padding-left: 1rem;
25
- padding-right: 1rem;
26
- background-color: var(--components-form-baseform-standard-fill-default);
27
- border-radius: 0.25rem;
28
- border: 0.125rem solid var(--components-form-baseform-standard-border-default);
29
- box-shadow: 0 0 0 transparent;
30
- color: var(--components-form-baseform-standard-text-content);
31
- transition: border-color 0.1s ease-in-out;
32
- }
33
- .eds-form-control-wrapper[focus-within], .eds-form-control-wrapper:hover {
34
- border-color: var(--components-form-baseform-standard-border-interactive);
35
- }
36
- .eds-form-control-wrapper:focus-within, .eds-form-control-wrapper:hover {
37
- border-color: var(--components-form-baseform-standard-border-interactive);
38
- }
39
- .eds-contrast .eds-form-control-wrapper:hover {
40
- border-color: var(--components-form-baseform-contrast-border-interactive);
41
- }
42
- .eds-form-control-wrapper[focus-within] {
43
- outline: 1px solid var(--components-form-baseform-standard-border-interactive);
44
- }
45
- .eds-form-control-wrapper:focus-within {
46
- outline: 1px solid var(--components-form-baseform-standard-border-interactive);
47
- }
48
- .eds-contrast .eds-form-control-wrapper[focus-within] {
49
- outline: var(--components-form-baseform-contrast-border-interactive);
50
- }
51
- .eds-contrast .eds-form-control-wrapper:focus-within {
52
- outline: var(--components-form-baseform-contrast-border-interactive);
53
- }
54
- .eds-form-control-wrapper ::-moz-placeholder {
55
- color: var(--components-form-baseform-standard-text-label);
56
- }
57
- .eds-form-control-wrapper ::placeholder {
58
- color: var(--components-form-baseform-standard-text-label);
59
- }
60
- .eds-form-control-wrapper--disabled {
61
- border-color: transparent;
62
- background-color: var(--components-form-baseform-standard-fill-disabled);
63
- pointer-events: none;
64
- color: var(--components-form-baseform-standard-text-disabled);
65
- }
66
- .eds-form-control-wrapper--disabled .eds-input-group__label {
67
- color: var(--components-form-baseform-standard-text-disabled);
68
- }
69
- .eds-contrast .eds-form-control-wrapper--disabled {
70
- border-color: transparent;
71
- background-color: var(--components-form-baseform-contrast-fill-disabled);
72
- color: var(--components-form-baseform-contrast-text-disabled);
73
- }
74
- .eds-contrast .eds-form-control-wrapper--disabled .eds-input-group__label {
75
- color: var(--components-form-baseform-contrast-text-disabled);
76
- }
77
- .eds-form-control-wrapper--disabled::before, .eds-form-control-wrapper--disabled::after {
78
- display: none;
79
- }
80
- .eds-form-control-wrapper--readonly {
81
- border-color: transparent;
82
- pointer-events: none;
83
- cursor: default;
84
- background: var(--components-form-baseform-standard-fill-readonly);
85
- border: var(--components-form-baseform-standard-fill-readonly);
86
- }
87
- .eds-contrast .eds-form-control-wrapper--readonly {
88
- background: var(--components-form-baseform-contrast-fill-readonly);
89
- color: var(--components-form-baseform-contrast-text-description);
90
- border: var(--components-form-baseform-contrast-fill-readonly);
91
- }
92
- .eds-contrast .eds-form-control-wrapper--readonly .eds-input-group__label {
93
- color: var(--components-form-baseform-contrast-text-description);
94
- }
95
- .eds-form-control-wrapper--readonly::before, .eds-form-control-wrapper--readonly::after {
96
- display: none;
97
- }
98
- .eds-form-control-wrapper--size-medium .eds-form-control,
99
- .eds-form-control-wrapper--size-medium .eds-form-control__append,
100
- .eds-form-control-wrapper--size-medium .eds-form-control__prepend {
101
- font-size: 1rem;
102
- line-height: 1rem;
103
- }
104
- .eds-form-control-wrapper--size-large {
105
- min-height: 4rem;
106
- }
107
- .eds-form-control-wrapper--size-large .eds-form-control,
108
- .eds-form-control-wrapper--size-large .eds-form-control__append,
109
- .eds-form-control-wrapper--size-large .eds-form-control__prepend {
110
- font-size: 1.5rem;
111
- }
112
- .eds-form-control-wrapper--success {
113
- border-color: var(--components-form-baseform-standard-border-success);
114
- }
115
- .eds-form-control-wrapper--success[focus-within] {
116
- border-color: var(--components-form-baseform-standard-border-success);
117
- }
118
- .eds-form-control-wrapper--success:focus-within {
119
- border-color: var(--components-form-baseform-standard-border-success);
120
- }
121
- .eds-contrast .eds-form-control-wrapper--success {
122
- border-color: var(--components-form-baseform-standard-border-success);
123
- }
124
- .eds-contrast .eds-form-control-wrapper--success[focus-within] {
125
- border-color: var(--components-form-baseform-contrast-border-success);
126
- }
127
- .eds-contrast .eds-form-control-wrapper--success:focus-within {
128
- border-color: var(--components-form-baseform-contrast-border-success);
129
- }
130
- .eds-form-control-wrapper--error, .eds-form-control-wrapper--negative {
131
- border-color: var(--components-form-baseform-standard-border-negative);
132
- }
133
- .eds-form-control-wrapper--error[focus-within], .eds-form-control-wrapper--negative[focus-within] {
134
- border-color: var(--components-form-baseform-standard-border-negative);
135
- }
136
- .eds-form-control-wrapper--error:focus-within, .eds-form-control-wrapper--negative:focus-within {
137
- border-color: var(--components-form-baseform-standard-border-negative);
138
- }
139
- .eds-contrast .eds-form-control-wrapper--error, .eds-contrast .eds-form-control-wrapper--negative {
140
- border-color: var(--components-form-baseform-contrast-border-negative);
141
- }
142
- .eds-contrast .eds-form-control-wrapper--error[focus-within], .eds-contrast .eds-form-control-wrapper--negative[focus-within] {
143
- border-color: var(--components-form-baseform-contrast-border-negative);
144
- }
145
- .eds-contrast .eds-form-control-wrapper--error:focus-within, .eds-contrast .eds-form-control-wrapper--negative:focus-within {
146
- border-color: var(--components-form-baseform-contrast-border-negative);
147
- }
148
- .eds-contrast .eds-form-control .eds-tooltip {
149
- background: var(--components-tooltip-tooltip-standard-fill);
150
- color: var(--components-tooltip-tooltip-standard-text);
151
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
152
- }
153
- .eds-form-control .eds-tooltip::after {
154
- background: var(--components-tooltip-tooltip-standard-fill);
155
- }
156
-
157
- .eds-form-control {
158
- display: block;
159
- -webkit-appearance: none;
160
- -moz-appearance: none;
161
- appearance: none;
162
- width: 100%;
163
- height: 100%;
164
- padding: 20px 0rem 0.25rem;
165
- font-family: inherit;
166
- font-size: 1rem;
167
- line-height: 1rem;
168
- border: 0;
169
- color: var(--components-form-baseform-standard-text-content);
170
- background-color: transparent;
171
- }
172
- .eds-form-control::-moz-placeholder {
173
- opacity: 0;
174
- -moz-transition: opacity 0.2s ease-in-out;
175
- transition: opacity 0.2s ease-in-out;
176
- }
177
- .eds-form-control::placeholder {
178
- opacity: 0;
179
- transition: opacity 0.2s ease-in-out;
180
- }
181
- .eds-form-control:focus {
182
- outline: none;
183
- }
184
- .eds-form-control:focus::-moz-placeholder {
185
- opacity: 1;
186
- }
187
- .eds-form-control:focus::placeholder {
188
- opacity: 1;
189
- }
190
- .eds-form-control__prepend, .eds-form-control__append {
191
- position: relative;
192
- line-height: inherit;
193
- }
194
- .eds-form-control__prepend--tooltip, .eds-form-control__append--tooltip {
195
- all: unset;
196
- position: absolute;
197
- display: flex;
198
- align-items: center;
199
- justify-content: center;
200
- height: 1.5rem;
201
- width: 1.5rem;
202
- right: -2rem;
203
- border-radius: 100%;
204
- color: var(--primary-text-color);
205
- cursor: pointer;
206
- }
207
- .eds-form-control__prepend {
208
- margin-right: 0.75rem;
209
- margin-left: 0;
210
- }
211
- .eds-form-control__append {
212
- margin-right: 0;
213
- margin-left: 0.75rem;
214
- }
215
- /* DO NOT CHANGE!*/
216
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
217
8
  .eds-feedback-text {
218
9
  display: flex;
219
10
  align-items: center;
@@ -442,104 +233,212 @@
442
233
  }
443
234
  /* DO NOT CHANGE!*/
444
235
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
445
- .eds-input-group {
446
- color: inherit;
447
- display: block;
448
- position: relative;
236
+ .eds-form-control__field-and-feedback-text {
237
+ display: flex;
238
+ flex-direction: column;
239
+ height: -moz-fit-content;
240
+ height: fit-content;
241
+ width: 100%;
449
242
  }
450
- .eds-input-group__label {
451
- color: var(--components-form-baseform-standard-text-label);
243
+ .eds-form-control__field-and-feedback-text--has-tooltip {
244
+ padding-right: 2rem;
245
+ }
246
+ .eds-form-control-wrapper {
452
247
  display: flex;
453
- font-size: 1rem;
454
- position: absolute;
455
- line-height: 1rem;
456
- height: 3rem;
457
- padding-left: 0;
458
- top: 1rem;
459
- 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;
460
- -webkit-user-select: none;
461
- -moz-user-select: none;
462
- user-select: none;
463
- pointer-events: none;
248
+ align-items: center;
249
+ position: relative;
250
+ flex: 1;
251
+ min-height: 3rem;
252
+ padding-left: 1rem;
253
+ padding-right: 1rem;
254
+ background-color: var(--components-form-baseform-standard-fill-default);
255
+ border-radius: 0.25rem;
256
+ border: 0.125rem solid var(--components-form-baseform-standard-border-default);
257
+ box-shadow: 0 0 0 transparent;
258
+ color: var(--components-form-baseform-standard-text-content);
259
+ transition: border-color 0.1s ease-in-out;
464
260
  }
465
- .eds-form-control-wrapper--is-filled .eds-input-group__label {
466
- top: 0.375rem;
467
- font-size: 0.75rem;
468
- line-height: 0.75rem;
469
- height: 10px;
470
- padding: 0;
261
+ .eds-form-control-wrapper[focus-within], .eds-form-control-wrapper:hover {
262
+ border-color: var(--components-form-baseform-standard-border-interactive);
471
263
  }
472
- .eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
473
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
474
- background: var(--textarea-label-background);
475
- width: calc(100% - 1rem - 1rem - 4px);
264
+ .eds-form-control-wrapper:focus-within, .eds-form-control-wrapper:hover {
265
+ border-color: var(--components-form-baseform-standard-border-interactive);
476
266
  }
477
- .eds-form-control-wrapper--is-filled.eds-form-control-wrapper--size-large .eds-input-group__label {
478
- top: 0.5rem;
479
- font-size: 0.875rem;
267
+ .eds-contrast .eds-form-control-wrapper:hover {
268
+ border-color: var(--components-form-baseform-contrast-border-interactive);
269
+ }
270
+ .eds-form-control-wrapper[focus-within] {
271
+ outline: 1px solid var(--components-form-baseform-standard-border-interactive);
272
+ }
273
+ .eds-form-control-wrapper:focus-within {
274
+ outline: 1px solid var(--components-form-baseform-standard-border-interactive);
275
+ }
276
+ .eds-contrast .eds-form-control-wrapper[focus-within] {
277
+ outline: var(--components-form-baseform-contrast-border-interactive);
278
+ }
279
+ .eds-contrast .eds-form-control-wrapper:focus-within {
280
+ outline: var(--components-form-baseform-contrast-border-interactive);
281
+ }
282
+ .eds-form-control-wrapper ::-moz-placeholder {
283
+ color: var(--components-form-baseform-standard-text-label);
284
+ }
285
+ .eds-form-control-wrapper ::placeholder {
286
+ color: var(--components-form-baseform-standard-text-label);
287
+ }
288
+ .eds-form-control-wrapper--disabled {
289
+ border-color: transparent;
290
+ background-color: var(--components-form-baseform-standard-fill-disabled);
291
+ pointer-events: none;
292
+ color: var(--components-form-baseform-standard-text-disabled);
293
+ }
294
+ .eds-form-control-wrapper--disabled .eds-input-group__label {
295
+ color: var(--components-form-baseform-standard-text-disabled);
296
+ }
297
+ .eds-contrast .eds-form-control-wrapper--disabled {
298
+ border-color: transparent;
299
+ background-color: var(--components-form-baseform-contrast-fill-disabled);
300
+ color: var(--components-form-baseform-contrast-text-disabled);
301
+ }
302
+ .eds-contrast .eds-form-control-wrapper--disabled .eds-input-group__label {
303
+ color: var(--components-form-baseform-contrast-text-disabled);
304
+ }
305
+ .eds-form-control-wrapper--disabled::before, .eds-form-control-wrapper--disabled::after {
306
+ display: none;
307
+ }
308
+ .eds-form-control-wrapper--readonly {
309
+ border-color: transparent;
310
+ pointer-events: none;
311
+ cursor: default;
312
+ background: var(--components-form-baseform-standard-fill-readonly);
313
+ border: var(--components-form-baseform-standard-fill-readonly);
314
+ }
315
+ .eds-contrast .eds-form-control-wrapper--readonly {
316
+ background: var(--components-form-baseform-contrast-fill-readonly);
317
+ color: var(--components-form-baseform-contrast-text-description);
318
+ border: var(--components-form-baseform-contrast-fill-readonly);
319
+ }
320
+ .eds-contrast .eds-form-control-wrapper--readonly .eds-input-group__label {
321
+ color: var(--components-form-baseform-contrast-text-description);
322
+ }
323
+ .eds-form-control-wrapper--readonly::before, .eds-form-control-wrapper--readonly::after {
324
+ display: none;
325
+ }
326
+ .eds-form-control-wrapper--size-medium .eds-form-control,
327
+ .eds-form-control-wrapper--size-medium .eds-form-control__append,
328
+ .eds-form-control-wrapper--size-medium .eds-form-control__prepend {
329
+ font-size: 1rem;
480
330
  line-height: 1rem;
481
- padding: 0;
482
331
  }
483
- .eds-form-control-wrapper--size-large .eds-input-group__label {
484
- top: 0.75rem;
332
+ .eds-form-control-wrapper--size-large {
333
+ min-height: 4rem;
334
+ }
335
+ .eds-form-control-wrapper--size-large .eds-form-control,
336
+ .eds-form-control-wrapper--size-large .eds-form-control__append,
337
+ .eds-form-control-wrapper--size-large .eds-form-control__prepend {
485
338
  font-size: 1.5rem;
486
- line-height: 2.25rem;
487
339
  }
488
- .eds-input-group__label--filled {
489
- top: 0.375rem;
490
- font-size: 0.75rem;
491
- line-height: 0.75rem;
492
- height: 10px;
493
- padding: 0;
340
+ .eds-form-control-wrapper--success {
341
+ border-color: var(--components-form-baseform-standard-border-success);
494
342
  }
495
- .eds-textarea__label .eds-input-group__label--filled {
496
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
497
- background: var(--textarea-label-background);
498
- width: calc(100% - 1rem - 1rem - 4px);
343
+ .eds-form-control-wrapper--success[focus-within] {
344
+ border-color: var(--components-form-baseform-standard-border-success);
499
345
  }
500
- .eds-form-control-wrapper--size-large .eds-input-group__label--filled {
501
- top: 0.5rem;
502
- font-size: 0.875rem;
503
- line-height: 1rem;
504
- padding: 0;
346
+ .eds-form-control-wrapper--success:focus-within {
347
+ border-color: var(--components-form-baseform-standard-border-success);
505
348
  }
506
-
507
- .eds-form-control-wrapper[focus-within] .eds-input-group__label {
508
- top: 0.375rem;
509
- font-size: 0.75rem;
510
- line-height: 0.75rem;
511
- height: 10px;
512
- padding: 0;
349
+ .eds-contrast .eds-form-control-wrapper--success {
350
+ border-color: var(--components-form-baseform-standard-border-success);
513
351
  }
514
-
515
- .eds-form-control-wrapper:focus-within .eds-input-group__label {
516
- top: 0.375rem;
517
- font-size: 0.75rem;
518
- line-height: 0.75rem;
519
- height: 10px;
520
- padding: 0;
352
+ .eds-contrast .eds-form-control-wrapper--success[focus-within] {
353
+ border-color: var(--components-form-baseform-contrast-border-success);
521
354
  }
522
- .eds-textarea__label .eds-form-control-wrapper[focus-within] .eds-input-group__label {
523
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
524
- background: var(--textarea-label-background);
525
- width: calc(100% - 1rem - 1rem - 4px);
355
+ .eds-contrast .eds-form-control-wrapper--success:focus-within {
356
+ border-color: var(--components-form-baseform-contrast-border-success);
526
357
  }
527
- .eds-textarea__label .eds-form-control-wrapper:focus-within .eds-input-group__label {
528
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
529
- background: var(--textarea-label-background);
530
- width: calc(100% - 1rem - 1rem - 4px);
358
+ .eds-form-control-wrapper--error, .eds-form-control-wrapper--negative {
359
+ border-color: var(--components-form-baseform-standard-border-negative);
531
360
  }
532
- .eds-form-control-wrapper--size-large[focus-within] .eds-input-group__label {
533
- top: 0.5rem;
534
- font-size: 0.875rem;
535
- line-height: 1rem;
536
- padding: 0;
361
+ .eds-form-control-wrapper--error[focus-within], .eds-form-control-wrapper--negative[focus-within] {
362
+ border-color: var(--components-form-baseform-standard-border-negative);
537
363
  }
538
- .eds-form-control-wrapper--size-large:focus-within .eds-input-group__label {
539
- top: 0.5rem;
540
- font-size: 0.875rem;
364
+ .eds-form-control-wrapper--error:focus-within, .eds-form-control-wrapper--negative:focus-within {
365
+ border-color: var(--components-form-baseform-standard-border-negative);
366
+ }
367
+ .eds-contrast .eds-form-control-wrapper--error, .eds-contrast .eds-form-control-wrapper--negative {
368
+ border-color: var(--components-form-baseform-contrast-border-negative);
369
+ }
370
+ .eds-contrast .eds-form-control-wrapper--error[focus-within], .eds-contrast .eds-form-control-wrapper--negative[focus-within] {
371
+ border-color: var(--components-form-baseform-contrast-border-negative);
372
+ }
373
+ .eds-contrast .eds-form-control-wrapper--error:focus-within, .eds-contrast .eds-form-control-wrapper--negative:focus-within {
374
+ border-color: var(--components-form-baseform-contrast-border-negative);
375
+ }
376
+ .eds-contrast .eds-form-control .eds-tooltip {
377
+ background: var(--components-tooltip-tooltip-standard-fill);
378
+ color: var(--components-tooltip-tooltip-standard-text);
379
+ box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
380
+ }
381
+ .eds-form-control .eds-tooltip::after {
382
+ background: var(--components-tooltip-tooltip-standard-fill);
383
+ }
384
+
385
+ .eds-form-control {
386
+ display: block;
387
+ -webkit-appearance: none;
388
+ -moz-appearance: none;
389
+ appearance: none;
390
+ width: 100%;
391
+ height: 100%;
392
+ padding: 20px 0rem 0.25rem;
393
+ font-family: inherit;
394
+ font-size: 1rem;
541
395
  line-height: 1rem;
542
- padding: 0;
396
+ border: 0;
397
+ color: var(--components-form-baseform-standard-text-content);
398
+ background-color: transparent;
399
+ }
400
+ .eds-form-control::-moz-placeholder {
401
+ opacity: 0;
402
+ -moz-transition: opacity 0.2s ease-in-out;
403
+ transition: opacity 0.2s ease-in-out;
404
+ }
405
+ .eds-form-control::placeholder {
406
+ opacity: 0;
407
+ transition: opacity 0.2s ease-in-out;
408
+ }
409
+ .eds-form-control:focus {
410
+ outline: none;
411
+ }
412
+ .eds-form-control:focus::-moz-placeholder {
413
+ opacity: 1;
414
+ }
415
+ .eds-form-control:focus::placeholder {
416
+ opacity: 1;
417
+ }
418
+ .eds-form-control__prepend, .eds-form-control__append {
419
+ position: relative;
420
+ line-height: inherit;
421
+ }
422
+ .eds-form-control__prepend--tooltip, .eds-form-control__append--tooltip {
423
+ all: unset;
424
+ position: absolute;
425
+ display: flex;
426
+ align-items: center;
427
+ justify-content: center;
428
+ height: 1.5rem;
429
+ width: 1.5rem;
430
+ right: -2rem;
431
+ border-radius: 100%;
432
+ color: var(--primary-text-color);
433
+ cursor: pointer;
434
+ }
435
+ .eds-form-control__prepend {
436
+ margin-right: 0.75rem;
437
+ margin-left: 0;
438
+ }
439
+ .eds-form-control__append {
440
+ margin-right: 0;
441
+ margin-left: 0.75rem;
543
442
  }
544
443
  /* DO NOT CHANGE!*/
545
444
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
@@ -744,6 +643,107 @@
744
643
  }
745
644
  /* DO NOT CHANGE!*/
746
645
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
646
+ .eds-input-group {
647
+ color: inherit;
648
+ display: block;
649
+ position: relative;
650
+ }
651
+ .eds-input-group__label {
652
+ color: var(--components-form-baseform-standard-text-label);
653
+ display: flex;
654
+ font-size: 1rem;
655
+ position: absolute;
656
+ line-height: 1rem;
657
+ height: 3rem;
658
+ padding-left: 0;
659
+ top: 1rem;
660
+ 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;
661
+ -webkit-user-select: none;
662
+ -moz-user-select: none;
663
+ user-select: none;
664
+ pointer-events: none;
665
+ }
666
+ .eds-form-control-wrapper--is-filled .eds-input-group__label {
667
+ top: 0.375rem;
668
+ font-size: 0.75rem;
669
+ line-height: 0.75rem;
670
+ height: 10px;
671
+ padding: 0;
672
+ }
673
+ .eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
674
+ box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
675
+ background: var(--textarea-label-background);
676
+ width: calc(100% - 1rem - 1rem - 4px);
677
+ }
678
+ .eds-form-control-wrapper--is-filled.eds-form-control-wrapper--size-large .eds-input-group__label {
679
+ top: 0.5rem;
680
+ font-size: 0.875rem;
681
+ line-height: 1rem;
682
+ padding: 0;
683
+ }
684
+ .eds-form-control-wrapper--size-large .eds-input-group__label {
685
+ top: 0.75rem;
686
+ font-size: 1.5rem;
687
+ line-height: 2.25rem;
688
+ }
689
+ .eds-input-group__label--filled {
690
+ top: 0.375rem;
691
+ font-size: 0.75rem;
692
+ line-height: 0.75rem;
693
+ height: 10px;
694
+ padding: 0;
695
+ }
696
+ .eds-textarea__label .eds-input-group__label--filled {
697
+ box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
698
+ background: var(--textarea-label-background);
699
+ width: calc(100% - 1rem - 1rem - 4px);
700
+ }
701
+ .eds-form-control-wrapper--size-large .eds-input-group__label--filled {
702
+ top: 0.5rem;
703
+ font-size: 0.875rem;
704
+ line-height: 1rem;
705
+ padding: 0;
706
+ }
707
+
708
+ .eds-form-control-wrapper[focus-within] .eds-input-group__label {
709
+ top: 0.375rem;
710
+ font-size: 0.75rem;
711
+ line-height: 0.75rem;
712
+ height: 10px;
713
+ padding: 0;
714
+ }
715
+
716
+ .eds-form-control-wrapper:focus-within .eds-input-group__label {
717
+ top: 0.375rem;
718
+ font-size: 0.75rem;
719
+ line-height: 0.75rem;
720
+ height: 10px;
721
+ padding: 0;
722
+ }
723
+ .eds-textarea__label .eds-form-control-wrapper[focus-within] .eds-input-group__label {
724
+ box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
725
+ background: var(--textarea-label-background);
726
+ width: calc(100% - 1rem - 1rem - 4px);
727
+ }
728
+ .eds-textarea__label .eds-form-control-wrapper:focus-within .eds-input-group__label {
729
+ box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
730
+ background: var(--textarea-label-background);
731
+ width: calc(100% - 1rem - 1rem - 4px);
732
+ }
733
+ .eds-form-control-wrapper--size-large[focus-within] .eds-input-group__label {
734
+ top: 0.5rem;
735
+ font-size: 0.875rem;
736
+ line-height: 1rem;
737
+ padding: 0;
738
+ }
739
+ .eds-form-control-wrapper--size-large:focus-within .eds-input-group__label {
740
+ top: 0.5rem;
741
+ font-size: 0.875rem;
742
+ line-height: 1rem;
743
+ padding: 0;
744
+ }
745
+ /* DO NOT CHANGE!*/
746
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
747
747
  .eds-input-panel[focus-within] .eds-input-panel__container {
748
748
  outline: 2px solid #181c56;
749
749
  outline-color: var(--basecolors-stroke-focus-standard);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/form",
3
- "version": "8.1.4",
3
+ "version": "8.1.5",
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": "^7.4.1",
31
- "@entur/tokens": "^3.17.1",
32
- "@entur/tooltip": "^5.1.0",
33
- "@entur/typography": "^1.8.46",
30
+ "@entur/icons": "^7.4.2",
31
+ "@entur/tokens": "^3.17.2",
32
+ "@entur/tooltip": "^5.1.1",
33
+ "@entur/typography": "^1.8.47",
34
34
  "@entur/utils": "^0.12.0",
35
35
  "classnames": "^2.3.1"
36
36
  },
37
- "gitHead": "7df4cea445e3dac77f80619ea0c298dc0b5c31e0"
37
+ "gitHead": "36055df834c5a9dd170f1846c1e0469481575e1a"
38
38
  }