@entur/form 5.3.7 → 5.3.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/CHANGELOG.md CHANGED
@@ -3,6 +3,10 @@
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.8](https://bitbucket.org/enturas/design-system/compare/@entur/form@5.3.7...@entur/form@5.3.8) (2022-06-28)
7
+
8
+ **Note:** Version bump only for package @entur/form
9
+
6
10
  ## [5.3.7](https://bitbucket.org/enturas/design-system/compare/@entur/form@5.3.6...@entur/form@5.3.7) (2022-06-24)
7
11
 
8
12
  **Note:** Version bump only for package @entur/form
package/dist/styles.css CHANGED
@@ -460,6 +460,48 @@
460
460
  margin-left: 0;
461
461
  }/* DO NOT CHANGE!*/
462
462
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
463
+ textarea.eds-form-control.eds-textarea {
464
+ min-height: 7.75rem;
465
+ resize: vertical;
466
+ line-height: 1.5rem;
467
+ }/* DO NOT CHANGE!*/
468
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
469
+ .eds-textfield__clear-button {
470
+ background: none;
471
+ border: none;
472
+ border-radius: 50%;
473
+ color: inherit;
474
+ cursor: pointer;
475
+ display: flex;
476
+ font: inherit;
477
+ font-size: 1rem;
478
+ line-height: 1rem;
479
+ padding: 0.5rem;
480
+ margin-right: -0.75rem;
481
+ }
482
+ .eds-textfield__clear-button-wrapper {
483
+ display: flex;
484
+ align-items: center;
485
+ }
486
+ .eds-textfield__clear-button:hover {
487
+ background: #f3f3f3;
488
+ }
489
+ .eds-textfield__clear-button:focus {
490
+ outline: none;
491
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
492
+ }
493
+
494
+ .eds-textfield__divider {
495
+ content: "";
496
+ display: block;
497
+ background-color: #e9e9e9;
498
+ height: 1.5rem;
499
+ width: 1px;
500
+ }
501
+ .eds-contrast .eds-form-control-wrapper--disabled .eds-textfield__divider {
502
+ background-color: #8285a8;
503
+ }/* DO NOT CHANGE!*/
504
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
463
505
  .eds-form-component--radio__container {
464
506
  display: flex;
465
507
  justify-content: center;
@@ -549,174 +591,6 @@
549
591
  background-color: #aeb7e2;
550
592
  }/* DO NOT CHANGE!*/
551
593
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
552
- .eds-input-group {
553
- color: inherit;
554
- display: block;
555
- position: relative;
556
- }
557
- .eds-input-group__label {
558
- color: #656782;
559
- display: flex;
560
- font-size: 1rem;
561
- position: absolute;
562
- line-height: 1rem;
563
- height: 3rem;
564
- padding: 1rem;
565
- padding-left: 0;
566
- margin-left: 1rem;
567
- top: -0.125rem;
568
- 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;
569
- -webkit-user-select: none;
570
- -moz-user-select: none;
571
- -ms-user-select: none;
572
- user-select: none;
573
- pointer-events: none;
574
- }
575
- .eds-form-control-wrapper--is-filled .eds-input-group__label {
576
- top: calc(0.5rem - 0.125rem);
577
- font-size: 0.75rem;
578
- line-height: 0.75rem;
579
- height: 10px;
580
- padding: 0;
581
- margin-left: 1rem;
582
- }
583
- .eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
584
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
585
- background: var(--textarea-label-background);
586
- width: calc( 100% - 1rem - 1rem - 4px );
587
- }
588
- .eds-form-control-wrapper--size-large .eds-form-control-wrapper--is-filled .eds-input-group__label {
589
- top: 0.5rem;
590
- font-size: 0.875rem;
591
- line-height: 1rem;
592
- padding: 0;
593
- margin-left: 1rem;
594
- }
595
- .eds-contrast .eds-input-group__label {
596
- color: #8285a8;
597
- }
598
- .eds-contrast .eds-form-control-wrapper--dark .eds-input-group__label {
599
- color: #aeb7e2;
600
- }
601
- .eds-form-control-wrapper--size-large .eds-input-group__label {
602
- font-size: 1.5rem;
603
- line-height: 2.25rem;
604
- height: 4rem;
605
- }
606
- .eds-input-group__label--filled {
607
- top: calc(0.5rem - 0.125rem);
608
- font-size: 0.75rem;
609
- line-height: 0.75rem;
610
- height: 10px;
611
- padding: 0;
612
- margin-left: 1rem;
613
- }
614
- .eds-textarea__label .eds-input-group__label--filled {
615
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
616
- background: var(--textarea-label-background);
617
- width: calc( 100% - 1rem - 1rem - 4px );
618
- }
619
- .eds-form-control-wrapper--size-large .eds-input-group__label--filled {
620
- top: 0.5rem;
621
- font-size: 0.875rem;
622
- line-height: 1rem;
623
- padding: 0;
624
- margin-left: 1rem;
625
- }
626
- .eds-input-group__label-tooltip-icon {
627
- color: #0082b9;
628
- padding-left: 0.25rem;
629
- padding-right: 0.25rem;
630
- display: flex;
631
- align-items: center;
632
- cursor: help;
633
- font-size: 1rem;
634
- }
635
-
636
- .eds-form-control-wrapper[focus-within] .eds-input-group__label {
637
- top: calc(0.5rem - 0.125rem);
638
- font-size: 0.75rem;
639
- line-height: 0.75rem;
640
- height: 10px;
641
- padding: 0;
642
- margin-left: 1rem;
643
- }
644
-
645
- .eds-form-control-wrapper:focus-within .eds-input-group__label {
646
- top: calc(0.5rem - 0.125rem);
647
- font-size: 0.75rem;
648
- line-height: 0.75rem;
649
- height: 10px;
650
- padding: 0;
651
- margin-left: 1rem;
652
- }
653
- .eds-textarea__label .eds-form-control-wrapper[focus-within] .eds-input-group__label {
654
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
655
- background: var(--textarea-label-background);
656
- width: calc( 100% - 1rem - 1rem - 4px );
657
- }
658
- .eds-textarea__label .eds-form-control-wrapper:focus-within .eds-input-group__label {
659
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
660
- background: var(--textarea-label-background);
661
- width: calc( 100% - 1rem - 1rem - 4px );
662
- }
663
- .eds-form-control-wrapper--size-large[focus-within] .eds-input-group__label {
664
- top: 0.5rem;
665
- font-size: 0.875rem;
666
- line-height: 1rem;
667
- padding: 0;
668
- margin-left: 1rem;
669
- }
670
- .eds-form-control-wrapper--size-large:focus-within .eds-input-group__label {
671
- top: 0.5rem;
672
- font-size: 0.875rem;
673
- line-height: 1rem;
674
- padding: 0;
675
- margin-left: 1rem;
676
- }/* DO NOT CHANGE!*/
677
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
678
- textarea.eds-form-control.eds-textarea {
679
- min-height: 7.75rem;
680
- resize: vertical;
681
- line-height: 1.5rem;
682
- }/* DO NOT CHANGE!*/
683
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
684
- .eds-textfield__clear-button {
685
- background: none;
686
- border: none;
687
- border-radius: 50%;
688
- color: inherit;
689
- cursor: pointer;
690
- display: flex;
691
- font: inherit;
692
- font-size: 1rem;
693
- line-height: 1rem;
694
- padding: 0.5rem;
695
- margin-right: -0.75rem;
696
- }
697
- .eds-textfield__clear-button-wrapper {
698
- display: flex;
699
- align-items: center;
700
- }
701
- .eds-textfield__clear-button:hover {
702
- background: #f3f3f3;
703
- }
704
- .eds-textfield__clear-button:focus {
705
- outline: none;
706
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
707
- }
708
-
709
- .eds-textfield__divider {
710
- content: "";
711
- display: block;
712
- background-color: #e9e9e9;
713
- height: 1.5rem;
714
- width: 1px;
715
- }
716
- .eds-contrast .eds-form-control-wrapper--disabled .eds-textfield__divider {
717
- background-color: #8285a8;
718
- }/* DO NOT CHANGE!*/
719
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
720
594
  .eds-switch {
721
595
  cursor: pointer;
722
596
  -webkit-user-select: none;
@@ -971,6 +845,132 @@ textarea.eds-form-control.eds-textarea {
971
845
  stroke-width: 0.375rem;
972
846
  }/* DO NOT CHANGE!*/
973
847
  /* 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
974
  .eds-segmented-control {
975
975
  margin-top: 0.25rem;
976
976
  display: flex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/form",
3
- "version": "5.3.7",
3
+ "version": "5.3.8",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/form.esm.js",
@@ -29,10 +29,10 @@
29
29
  "dependencies": {
30
30
  "@entur/icons": "^4.2.0",
31
31
  "@entur/tokens": "^3.3.2",
32
- "@entur/tooltip": "^2.5.10",
32
+ "@entur/tooltip": "^2.5.11",
33
33
  "@entur/typography": "^1.6.14",
34
34
  "@entur/utils": "^0.4.3",
35
35
  "classnames": "^2.3.1"
36
36
  },
37
- "gitHead": "974289b6579ade4460d12aa877a89e454c983d48"
37
+ "gitHead": "b8c747624dc3cb71b5710305c958ece5ba460e23"
38
38
  }