@fremtind/jokul 0.21.0 → 0.21.1
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/package.json +2 -2
- package/src/components/button/styles/button.css +2 -2
- package/src/components/button/styles/button.min.css +1 -1
- package/src/components/checkbox/styles/checkbox.css +4 -4
- package/src/components/checkbox/styles/checkbox.min.css +1 -1
- package/src/components/feedback/styles/feedback.css +2 -2
- package/src/components/feedback/styles/feedback.min.css +1 -1
- package/src/components/input-group/styles/input-group.css +2 -2
- package/src/components/input-group/styles/input-group.min.css +1 -1
- package/src/components/loader/styles/loader.css +6 -6
- package/src/components/loader/styles/loader.min.css +1 -1
- package/src/components/loader/styles/skeleton-loader.css +5 -5
- package/src/components/loader/styles/skeleton-loader.min.css +1 -1
- package/src/components/message/styles/message.css +2 -2
- package/src/components/message/styles/message.min.css +1 -1
- package/src/components/progress-bar/styles/progress-bar.css +2 -2
- package/src/components/progress-bar/styles/progress-bar.min.css +1 -1
- package/src/components/radio-button/styles/radio-button.css +2 -2
- package/src/components/radio-button/styles/radio-button.min.css +1 -1
- package/src/components/system-message/styles/system-message.css +2 -2
- package/src/components/system-message/styles/system-message.min.css +1 -1
- package/src/components/toast/styles/toast.css +4 -4
- package/src/components/toast/styles/toast.min.css +1 -1
- package/src/styles/styles.css +33 -33
- package/src/styles/styles.min.css +1 -1
package/src/styles/styles.css
CHANGED
|
@@ -609,7 +609,7 @@
|
|
|
609
609
|
height: 1rem;
|
|
610
610
|
}
|
|
611
611
|
html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
612
|
-
animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-
|
|
612
|
+
animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-uy9i6m7;
|
|
613
613
|
}
|
|
614
614
|
:not([data-touchnavigation]) .jkl-button--primary:hover, :not([data-touchnavigation]) .jkl-button--secondary:hover, :not([data-touchnavigation]) .jkl-button--tertiary:hover {
|
|
615
615
|
scale: 1.05;
|
|
@@ -653,7 +653,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
653
653
|
--background-color: var(--jkl-color-background-interactive-hover);
|
|
654
654
|
}
|
|
655
655
|
|
|
656
|
-
@keyframes jkl-tertiary-flash-
|
|
656
|
+
@keyframes jkl-tertiary-flash-uy9i6m7 {
|
|
657
657
|
0% {
|
|
658
658
|
opacity: 0.5;
|
|
659
659
|
scale: 1;
|
|
@@ -678,15 +678,15 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
678
678
|
animation: 2500ms linear infinite;
|
|
679
679
|
}
|
|
680
680
|
.jkl-loader__dot--left {
|
|
681
|
-
animation-name: jkl-loader-left-spin-
|
|
681
|
+
animation-name: jkl-loader-left-spin-uy9i6m8;
|
|
682
682
|
margin-right: 1.71em;
|
|
683
683
|
}
|
|
684
684
|
.jkl-loader__dot--middle {
|
|
685
|
-
animation-name: jkl-loader-middle-spin-
|
|
685
|
+
animation-name: jkl-loader-middle-spin-uy9i6n3;
|
|
686
686
|
margin-right: 1.9em;
|
|
687
687
|
}
|
|
688
688
|
.jkl-loader__dot--right {
|
|
689
|
-
animation-name: jkl-loader-right-spin-
|
|
689
|
+
animation-name: jkl-loader-right-spin-uy9i6nm;
|
|
690
690
|
}
|
|
691
691
|
@media screen and (forced-colors: active) {
|
|
692
692
|
.jkl-loader__dot {
|
|
@@ -714,7 +714,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
714
714
|
margin-right: 0.3em;
|
|
715
715
|
}
|
|
716
716
|
|
|
717
|
-
@keyframes jkl-loader-left-spin-
|
|
717
|
+
@keyframes jkl-loader-left-spin-uy9i6m8 {
|
|
718
718
|
0% {
|
|
719
719
|
transform: rotate(0) scale(0);
|
|
720
720
|
}
|
|
@@ -728,7 +728,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
728
728
|
transform: rotate(180deg) scale(0);
|
|
729
729
|
}
|
|
730
730
|
}
|
|
731
|
-
@keyframes jkl-loader-middle-spin-
|
|
731
|
+
@keyframes jkl-loader-middle-spin-uy9i6n3 {
|
|
732
732
|
0% {
|
|
733
733
|
transform: rotate(20deg) scale(0);
|
|
734
734
|
}
|
|
@@ -745,7 +745,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
745
745
|
transform: rotate(200deg) scale(0);
|
|
746
746
|
}
|
|
747
747
|
}
|
|
748
|
-
@keyframes jkl-loader-right-spin-
|
|
748
|
+
@keyframes jkl-loader-right-spin-uy9i6nm {
|
|
749
749
|
0% {
|
|
750
750
|
transform: rotate(40deg) scale(0);
|
|
751
751
|
}
|
|
@@ -1311,7 +1311,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
1311
1311
|
--jkl-checkbox-line-height: 1.5rem;
|
|
1312
1312
|
}
|
|
1313
1313
|
|
|
1314
|
-
@keyframes jkl-checkbox-checked-
|
|
1314
|
+
@keyframes jkl-checkbox-checked-uy9i6nw {
|
|
1315
1315
|
0% {
|
|
1316
1316
|
width: 0;
|
|
1317
1317
|
height: 0;
|
|
@@ -1325,7 +1325,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
1325
1325
|
height: 58%;
|
|
1326
1326
|
}
|
|
1327
1327
|
}
|
|
1328
|
-
@keyframes jkl-checkbox-indeterminate-
|
|
1328
|
+
@keyframes jkl-checkbox-indeterminate-uy9i6od {
|
|
1329
1329
|
0% {
|
|
1330
1330
|
width: 0;
|
|
1331
1331
|
}
|
|
@@ -1353,11 +1353,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
1353
1353
|
top: -6px;
|
|
1354
1354
|
}
|
|
1355
1355
|
.jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
|
|
1356
|
-
animation: jkl-checkbox-checked-
|
|
1356
|
+
animation: jkl-checkbox-checked-uy9i6nw 150ms ease-in-out forwards;
|
|
1357
1357
|
opacity: 1;
|
|
1358
1358
|
}
|
|
1359
1359
|
.jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
|
|
1360
|
-
animation: jkl-checkbox-indeterminate-
|
|
1360
|
+
animation: jkl-checkbox-indeterminate-uy9i6od 150ms ease-in-out forwards;
|
|
1361
1361
|
opacity: 1;
|
|
1362
1362
|
}
|
|
1363
1363
|
.jkl-checkbox__input:focus-visible + .jkl-checkbox__label {
|
|
@@ -1881,7 +1881,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
1881
1881
|
--color: var(--jkl-color-text-default);
|
|
1882
1882
|
}
|
|
1883
1883
|
.jkl-form-support-label--error .jkl-form-support-label__icon, .jkl-form-support-label--warning .jkl-form-support-label__icon, .jkl-form-support-label--success .jkl-form-support-label__icon {
|
|
1884
|
-
animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-
|
|
1884
|
+
animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-uy9i6ow forwards;
|
|
1885
1885
|
}
|
|
1886
1886
|
.jkl-form-support-label--sr-only {
|
|
1887
1887
|
border: 0 !important;
|
|
@@ -1956,7 +1956,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
1956
1956
|
white-space: nowrap !important; /* 3 */
|
|
1957
1957
|
}
|
|
1958
1958
|
|
|
1959
|
-
@keyframes jkl-support-icon-entrance-
|
|
1959
|
+
@keyframes jkl-support-icon-entrance-uy9i6ow {
|
|
1960
1960
|
0% {
|
|
1961
1961
|
margin-right: 0;
|
|
1962
1962
|
opacity: 0;
|
|
@@ -3399,7 +3399,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-area__tex
|
|
|
3399
3399
|
padding: 1rem 0 2.5rem 0;
|
|
3400
3400
|
}
|
|
3401
3401
|
|
|
3402
|
-
@keyframes jkl-show-
|
|
3402
|
+
@keyframes jkl-show-uy9i6pr {
|
|
3403
3403
|
from {
|
|
3404
3404
|
transform: translate3d(0, 0.5rem, 0);
|
|
3405
3405
|
opacity: 0;
|
|
@@ -3434,7 +3434,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-area__tex
|
|
|
3434
3434
|
}
|
|
3435
3435
|
}
|
|
3436
3436
|
.jkl-feedback__fade-in {
|
|
3437
|
-
animation: jkl-show-
|
|
3437
|
+
animation: jkl-show-uy9i6pr 0.25s ease-out;
|
|
3438
3438
|
}
|
|
3439
3439
|
|
|
3440
3440
|
.jkl-feedback-smileys {
|
|
@@ -3666,7 +3666,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3666
3666
|
--background-color: var(--jkl-color-background-alert-success);
|
|
3667
3667
|
}
|
|
3668
3668
|
.jkl-message--dismissed {
|
|
3669
|
-
animation: jkl-dismiss-
|
|
3669
|
+
animation: jkl-dismiss-uy9i6qf 400ms ease-in-out forwards;
|
|
3670
3670
|
transition: visibility 0ms 400ms;
|
|
3671
3671
|
visibility: hidden;
|
|
3672
3672
|
}
|
|
@@ -3686,7 +3686,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3686
3686
|
}
|
|
3687
3687
|
}
|
|
3688
3688
|
|
|
3689
|
-
@keyframes jkl-dismiss-
|
|
3689
|
+
@keyframes jkl-dismiss-uy9i6qf {
|
|
3690
3690
|
from {
|
|
3691
3691
|
opacity: 1;
|
|
3692
3692
|
transform: translate3d(0, 0, 0);
|
|
@@ -3742,7 +3742,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3742
3742
|
--jkl-radio-button-label-font-weight: var(--jkl-small-font-weight);
|
|
3743
3743
|
}
|
|
3744
3744
|
|
|
3745
|
-
@keyframes jkl-dot-in-
|
|
3745
|
+
@keyframes jkl-dot-in-uy9i6qx {
|
|
3746
3746
|
0% {
|
|
3747
3747
|
transform: scale(0.8);
|
|
3748
3748
|
}
|
|
@@ -3785,7 +3785,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3785
3785
|
}
|
|
3786
3786
|
.jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
|
|
3787
3787
|
--dot-color: var(--jkl-color-border-action);
|
|
3788
|
-
animation: jkl-dot-in-
|
|
3788
|
+
animation: jkl-dot-in-uy9i6qx 150ms ease;
|
|
3789
3789
|
}
|
|
3790
3790
|
@media screen and (forced-colors: active) {
|
|
3791
3791
|
.jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
|
|
@@ -3992,7 +3992,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3992
3992
|
bottom: 0;
|
|
3993
3993
|
width: 12.5rem;
|
|
3994
3994
|
background: linear-gradient(89.17deg, rgba(249, 249, 249, 0) 0.8%, var(--jkl-skeleton-sweeper-color) 50.09%, rgba(249, 249, 249, 0) 96.31%);
|
|
3995
|
-
animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-
|
|
3995
|
+
animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uy9i6rh;
|
|
3996
3996
|
}
|
|
3997
3997
|
@media (width >= 0) and (max-width: 679px) {
|
|
3998
3998
|
.jkl-skeleton-animation {
|
|
@@ -4023,7 +4023,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
4023
4023
|
@media screen and (forced-colors: active) {
|
|
4024
4024
|
.jkl-skeleton-element {
|
|
4025
4025
|
border: 1px solid CanvasText;
|
|
4026
|
-
animation: 2s ease infinite jkl-blink-
|
|
4026
|
+
animation: 2s ease infinite jkl-blink-uy9i6rr;
|
|
4027
4027
|
}
|
|
4028
4028
|
}
|
|
4029
4029
|
|
|
@@ -4079,11 +4079,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
4079
4079
|
}
|
|
4080
4080
|
@media screen and (forced-colors: active) {
|
|
4081
4081
|
.jkl-skeleton-table {
|
|
4082
|
-
animation: 2s ease-in-out infinite jkl-blink-
|
|
4082
|
+
animation: 2s ease-in-out infinite jkl-blink-uy9i6rr;
|
|
4083
4083
|
}
|
|
4084
4084
|
}
|
|
4085
4085
|
|
|
4086
|
-
@keyframes jkl-sweep-
|
|
4086
|
+
@keyframes jkl-sweep-uy9i6rh {
|
|
4087
4087
|
0% {
|
|
4088
4088
|
transform: translateX(calc(0vw - 200px));
|
|
4089
4089
|
}
|
|
@@ -4091,7 +4091,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
4091
4091
|
transform: translateX(calc(100vw + 400px));
|
|
4092
4092
|
}
|
|
4093
4093
|
}
|
|
4094
|
-
@keyframes jkl-blink-
|
|
4094
|
+
@keyframes jkl-blink-uy9i6rr {
|
|
4095
4095
|
0% {
|
|
4096
4096
|
opacity: 1;
|
|
4097
4097
|
}
|
|
@@ -4472,11 +4472,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
4472
4472
|
}
|
|
4473
4473
|
|
|
4474
4474
|
.jkl-countdown__tracker {
|
|
4475
|
-
animation: jkl-downcount-
|
|
4475
|
+
animation: jkl-downcount-uy9i6s7 var(--duration) linear forwards;
|
|
4476
4476
|
animation-play-state: var(--play-state, running);
|
|
4477
4477
|
}
|
|
4478
4478
|
|
|
4479
|
-
@keyframes jkl-downcount-
|
|
4479
|
+
@keyframes jkl-downcount-uy9i6s7 {
|
|
4480
4480
|
from {
|
|
4481
4481
|
width: 100%;
|
|
4482
4482
|
}
|
|
@@ -5023,7 +5023,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-system-message
|
|
|
5023
5023
|
margin-bottom: 0;
|
|
5024
5024
|
}
|
|
5025
5025
|
.jkl-system-message--dismissed {
|
|
5026
|
-
animation: jkl-dismiss-
|
|
5026
|
+
animation: jkl-dismiss-uy9i6sf 400ms ease-in forwards;
|
|
5027
5027
|
transition: visibility 0ms 400ms;
|
|
5028
5028
|
visibility: hidden;
|
|
5029
5029
|
}
|
|
@@ -5055,7 +5055,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-system-message
|
|
|
5055
5055
|
}
|
|
5056
5056
|
}
|
|
5057
5057
|
|
|
5058
|
-
@keyframes jkl-dismiss-
|
|
5058
|
+
@keyframes jkl-dismiss-uy9i6sf {
|
|
5059
5059
|
from {
|
|
5060
5060
|
opacity: 1;
|
|
5061
5061
|
transform: translate3d(0, 0, 0);
|
|
@@ -5925,14 +5925,14 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
|
|
|
5925
5925
|
|
|
5926
5926
|
.jkl-toast[data-animation=entering],
|
|
5927
5927
|
.jkl-toast[data-animation=queued] {
|
|
5928
|
-
animation: jkl-entering-
|
|
5928
|
+
animation: jkl-entering-uy9i6sv 200ms ease-out forwards;
|
|
5929
5929
|
}
|
|
5930
5930
|
|
|
5931
5931
|
.jkl-toast[data-animation=exiting] {
|
|
5932
|
-
animation: jkl-exiting-
|
|
5932
|
+
animation: jkl-exiting-uy9i6sx 150ms ease-in forwards;
|
|
5933
5933
|
}
|
|
5934
5934
|
|
|
5935
|
-
@keyframes jkl-entering-
|
|
5935
|
+
@keyframes jkl-entering-uy9i6sv {
|
|
5936
5936
|
from {
|
|
5937
5937
|
opacity: 0;
|
|
5938
5938
|
transform: translate3d(0, 50%, 0);
|
|
@@ -5942,7 +5942,7 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
|
|
|
5942
5942
|
transform: translate3d(0, 0, 0);
|
|
5943
5943
|
}
|
|
5944
5944
|
}
|
|
5945
|
-
@keyframes jkl-exiting-
|
|
5945
|
+
@keyframes jkl-exiting-uy9i6sx {
|
|
5946
5946
|
from {
|
|
5947
5947
|
opacity: 1;
|
|
5948
5948
|
transform: translate3d(0, 0, 0);
|