@entur/button 3.3.2 → 3.3.4
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/README.md +2 -2
- package/dist/styles.css +58 -56
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
This package contains the button component
|
|
4
4
|
|
|
5
|
-
> 💡 Looking for the [documentation](https://
|
|
5
|
+
> 💡 Looking for the [documentation](https://linje.entur.no/komponenter/knapper/button)?
|
|
6
6
|
|
|
7
7
|
## Installation
|
|
8
8
|
|
|
@@ -14,4 +14,4 @@ yarn add @entur/button
|
|
|
14
14
|
|
|
15
15
|
## Usage
|
|
16
16
|
|
|
17
|
-
Please refer to the [documentation](https://
|
|
17
|
+
Please refer to the [documentation](https://linje.entur.no/komponenter/knapper/button) for further usage information.
|
package/dist/styles.css
CHANGED
|
@@ -461,6 +461,62 @@ a.eds-button .eds-icon {
|
|
|
461
461
|
}
|
|
462
462
|
/* DO NOT CHANGE!*/
|
|
463
463
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
464
|
+
.eds-icon-button {
|
|
465
|
+
border: 0.125rem solid transparent;
|
|
466
|
+
border-radius: 0.25rem;
|
|
467
|
+
background: none;
|
|
468
|
+
color: var(--components-button-iconbutton-standard-text);
|
|
469
|
+
cursor: pointer;
|
|
470
|
+
display: flex;
|
|
471
|
+
justify-content: center;
|
|
472
|
+
align-items: center;
|
|
473
|
+
font-size: 1rem;
|
|
474
|
+
padding: 0.5rem;
|
|
475
|
+
}
|
|
476
|
+
.eds-contrast .eds-icon-button {
|
|
477
|
+
color: var(--components-button-iconbutton-contrast-text);
|
|
478
|
+
}
|
|
479
|
+
.eds-contrast .eds-icon-button > .eds-loading-dots .eds-loading-dots__dot {
|
|
480
|
+
background-color: var(--components-button-iconbutton-contrast-icon);
|
|
481
|
+
}
|
|
482
|
+
.eds-icon-button--size-small {
|
|
483
|
+
height: 1.5rem;
|
|
484
|
+
width: 1.5rem;
|
|
485
|
+
padding: 0;
|
|
486
|
+
}
|
|
487
|
+
.eds-icon-button:hover {
|
|
488
|
+
background-color: var(--components-button-iconbutton-standard-hover);
|
|
489
|
+
}
|
|
490
|
+
.eds-contrast .eds-icon-button:hover {
|
|
491
|
+
background-color: var(--components-button-iconbutton-contrast-hover);
|
|
492
|
+
}
|
|
493
|
+
.eds-icon-button:active {
|
|
494
|
+
background: var(--components-button-iconbutton-standard-active);
|
|
495
|
+
color: var(--components-button-iconbutton-standard-text-active);
|
|
496
|
+
}
|
|
497
|
+
.eds-contrast .eds-icon-button:active {
|
|
498
|
+
background: var(--components-button-iconbutton-contrast-active);
|
|
499
|
+
color: var(--components-button-iconbutton-contrast-text-active);
|
|
500
|
+
}
|
|
501
|
+
.eds-icon-button:focus-visible {
|
|
502
|
+
outline: 2px solid #181c56;
|
|
503
|
+
outline-color: var(--basecolors-stroke-focus-standard);
|
|
504
|
+
outline-offset: 0.125rem;
|
|
505
|
+
}
|
|
506
|
+
.eds-contrast .eds-icon-button:focus-visible {
|
|
507
|
+
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
508
|
+
}
|
|
509
|
+
.eds-icon-button--disabled {
|
|
510
|
+
opacity: 0.5;
|
|
511
|
+
pointer-events: none;
|
|
512
|
+
}
|
|
513
|
+
.eds-icon-button--disabled__wrapper {
|
|
514
|
+
cursor: not-allowed;
|
|
515
|
+
width: -moz-fit-content;
|
|
516
|
+
width: fit-content;
|
|
517
|
+
}
|
|
518
|
+
/* DO NOT CHANGE!*/
|
|
519
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
464
520
|
/* DO NOT CHANGE!*/
|
|
465
521
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
466
522
|
/* DO NOT CHANGE!*/
|
|
@@ -710,6 +766,7 @@ a.eds-button .eds-icon {
|
|
|
710
766
|
:root {
|
|
711
767
|
--basecolors-frame-contrast: #181c56;
|
|
712
768
|
--basecolors-frame-contrastalt: #393d79;
|
|
769
|
+
--basecolors-frame-contrastalt-2: #292b6a;
|
|
713
770
|
--basecolors-frame-default: #ffffff;
|
|
714
771
|
--basecolors-frame-elevated: #ffffff;
|
|
715
772
|
--basecolors-frame-elevatedalt: #f6f6f9;
|
|
@@ -775,6 +832,7 @@ a.eds-button .eds-icon {
|
|
|
775
832
|
[data-color-mode=dark] {
|
|
776
833
|
--basecolors-frame-contrast: #212233;
|
|
777
834
|
--basecolors-frame-contrastalt: #141527;
|
|
835
|
+
--basecolors-frame-contrastalt-2: #08091c;
|
|
778
836
|
--basecolors-frame-default: #08091c;
|
|
779
837
|
--basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
|
|
780
838
|
--basecolors-frame-elevatedalt: #464755;
|
|
@@ -840,59 +898,3 @@ a.eds-button .eds-icon {
|
|
|
840
898
|
:root {
|
|
841
899
|
--eds-button: 1;
|
|
842
900
|
}
|
|
843
|
-
/* DO NOT CHANGE!*/
|
|
844
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
845
|
-
.eds-icon-button {
|
|
846
|
-
border: 0.125rem solid transparent;
|
|
847
|
-
border-radius: 0.25rem;
|
|
848
|
-
background: none;
|
|
849
|
-
color: var(--components-button-iconbutton-standard-text);
|
|
850
|
-
cursor: pointer;
|
|
851
|
-
display: flex;
|
|
852
|
-
justify-content: center;
|
|
853
|
-
align-items: center;
|
|
854
|
-
font-size: 1rem;
|
|
855
|
-
padding: 0.5rem;
|
|
856
|
-
}
|
|
857
|
-
.eds-contrast .eds-icon-button {
|
|
858
|
-
color: var(--components-button-iconbutton-contrast-text);
|
|
859
|
-
}
|
|
860
|
-
.eds-contrast .eds-icon-button > .eds-loading-dots .eds-loading-dots__dot {
|
|
861
|
-
background-color: var(--components-button-iconbutton-contrast-icon);
|
|
862
|
-
}
|
|
863
|
-
.eds-icon-button--size-small {
|
|
864
|
-
height: 1.5rem;
|
|
865
|
-
width: 1.5rem;
|
|
866
|
-
padding: 0;
|
|
867
|
-
}
|
|
868
|
-
.eds-icon-button:hover {
|
|
869
|
-
background-color: var(--components-button-iconbutton-standard-hover);
|
|
870
|
-
}
|
|
871
|
-
.eds-contrast .eds-icon-button:hover {
|
|
872
|
-
background-color: var(--components-button-iconbutton-contrast-hover);
|
|
873
|
-
}
|
|
874
|
-
.eds-icon-button:active {
|
|
875
|
-
background: var(--components-button-iconbutton-standard-active);
|
|
876
|
-
color: var(--components-button-iconbutton-standard-text-active);
|
|
877
|
-
}
|
|
878
|
-
.eds-contrast .eds-icon-button:active {
|
|
879
|
-
background: var(--components-button-iconbutton-contrast-active);
|
|
880
|
-
color: var(--components-button-iconbutton-contrast-text-active);
|
|
881
|
-
}
|
|
882
|
-
.eds-icon-button:focus-visible {
|
|
883
|
-
outline: 2px solid #181c56;
|
|
884
|
-
outline-color: var(--basecolors-stroke-focus-standard);
|
|
885
|
-
outline-offset: 0.125rem;
|
|
886
|
-
}
|
|
887
|
-
.eds-contrast .eds-icon-button:focus-visible {
|
|
888
|
-
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
889
|
-
}
|
|
890
|
-
.eds-icon-button--disabled {
|
|
891
|
-
opacity: 0.5;
|
|
892
|
-
pointer-events: none;
|
|
893
|
-
}
|
|
894
|
-
.eds-icon-button--disabled__wrapper {
|
|
895
|
-
cursor: not-allowed;
|
|
896
|
-
width: -moz-fit-content;
|
|
897
|
-
width: fit-content;
|
|
898
|
-
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/button",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.4",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/button.esm.js",
|
|
@@ -27,13 +27,13 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/loader": "^0.5.
|
|
31
|
-
"@entur/tokens": "^3.
|
|
32
|
-
"@entur/utils": "^0.12.
|
|
30
|
+
"@entur/loader": "^0.5.21",
|
|
31
|
+
"@entur/tokens": "^3.19.0",
|
|
32
|
+
"@entur/utils": "^0.12.3",
|
|
33
33
|
"classnames": "^2.3.1"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
36
|
"dts-cli": "2.0.5"
|
|
37
37
|
},
|
|
38
|
-
"gitHead": "
|
|
38
|
+
"gitHead": "bfd8f62e4735cc13d55e50bc8747535d72aaf679"
|
|
39
39
|
}
|