@fremtind/jokul 0.56.3 → 0.56.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/build/build-stats.html +1 -1
- package/build/style.css +1 -1
- package/package.json +2 -2
- package/styles/components/button/button.css +2 -2
- package/styles/components/button/button.min.css +1 -1
- package/styles/components/checkbox/checkbox.css +4 -4
- package/styles/components/checkbox/checkbox.min.css +1 -1
- package/styles/components/checkbox-panel/checkbox-panel.css +2 -2
- package/styles/components/checkbox-panel/checkbox-panel.min.css +1 -1
- package/styles/components/countdown/countdown.css +2 -2
- package/styles/components/countdown/countdown.min.css +1 -1
- package/styles/components/feedback/feedback.css +2 -2
- package/styles/components/feedback/feedback.min.css +1 -1
- package/styles/components/input-group/input-group.css +2 -2
- package/styles/components/input-group/input-group.min.css +1 -1
- package/styles/components/loader/loader.css +6 -6
- package/styles/components/loader/loader.min.css +1 -1
- package/styles/components/loader/skeleton-loader.css +5 -5
- package/styles/components/loader/skeleton-loader.min.css +1 -1
- package/styles/components/message/message.css +2 -2
- package/styles/components/message/message.min.css +1 -1
- package/styles/components/progress-bar/progress-bar.css +1 -1
- package/styles/components/progress-bar/progress-bar.min.css +1 -1
- package/styles/components/radio-button/radio-button.css +2 -2
- package/styles/components/radio-button/radio-button.min.css +1 -1
- package/styles/components/radio-panel/radio-panel.css +2 -2
- package/styles/components/radio-panel/radio-panel.min.css +1 -1
- package/styles/components/system-message/system-message.css +2 -2
- package/styles/components/system-message/system-message.min.css +1 -1
- package/styles/components/toast/toast.css +4 -4
- package/styles/components/toast/toast.min.css +1 -1
- package/styles/styles.css +38 -38
- package/styles/styles.min.css +1 -1
package/styles/styles.css
CHANGED
|
@@ -870,7 +870,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-input__in
|
|
|
870
870
|
--color: var(--jkl-color-text-default);
|
|
871
871
|
}
|
|
872
872
|
.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 {
|
|
873
|
-
animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-
|
|
873
|
+
animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-uasi5kk forwards;
|
|
874
874
|
}
|
|
875
875
|
.jkl-form-support-label--sr-only {
|
|
876
876
|
border: 0 !important;
|
|
@@ -945,7 +945,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-input__in
|
|
|
945
945
|
white-space: nowrap !important; /* 3 */
|
|
946
946
|
}
|
|
947
947
|
|
|
948
|
-
@keyframes jkl-support-icon-entrance-
|
|
948
|
+
@keyframes jkl-support-icon-entrance-uasi5kk {
|
|
949
949
|
0% {
|
|
950
950
|
margin-right: 0;
|
|
951
951
|
opacity: 0;
|
|
@@ -1295,7 +1295,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
|
|
|
1295
1295
|
opacity: 0.15;
|
|
1296
1296
|
}
|
|
1297
1297
|
html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
1298
|
-
animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-
|
|
1298
|
+
animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-uasi5kt;
|
|
1299
1299
|
}
|
|
1300
1300
|
.jkl-button--primary, .jkl-button--secondary, .jkl-button--ghost {
|
|
1301
1301
|
--border-radius: 999px;
|
|
@@ -1337,7 +1337,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1337
1337
|
--background-color: var(--jkl-color-background-interactive-hover);
|
|
1338
1338
|
}
|
|
1339
1339
|
|
|
1340
|
-
@keyframes jkl-tertiary-flash-
|
|
1340
|
+
@keyframes jkl-tertiary-flash-uasi5kt {
|
|
1341
1341
|
0% {
|
|
1342
1342
|
opacity: 0.5;
|
|
1343
1343
|
scale: 1;
|
|
@@ -1362,15 +1362,15 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1362
1362
|
animation: 2500ms linear infinite;
|
|
1363
1363
|
}
|
|
1364
1364
|
.jkl-loader__dot--left {
|
|
1365
|
-
animation-name: jkl-loader-left-spin-
|
|
1365
|
+
animation-name: jkl-loader-left-spin-uasi5l1;
|
|
1366
1366
|
margin-right: 1.71em;
|
|
1367
1367
|
}
|
|
1368
1368
|
.jkl-loader__dot--middle {
|
|
1369
|
-
animation-name: jkl-loader-middle-spin-
|
|
1369
|
+
animation-name: jkl-loader-middle-spin-uasi5ln;
|
|
1370
1370
|
margin-right: 1.9em;
|
|
1371
1371
|
}
|
|
1372
1372
|
.jkl-loader__dot--right {
|
|
1373
|
-
animation-name: jkl-loader-right-spin-
|
|
1373
|
+
animation-name: jkl-loader-right-spin-uasi5mg;
|
|
1374
1374
|
}
|
|
1375
1375
|
@media screen and (forced-colors: active) {
|
|
1376
1376
|
.jkl-loader__dot {
|
|
@@ -1398,7 +1398,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1398
1398
|
margin-right: 0.3em;
|
|
1399
1399
|
}
|
|
1400
1400
|
|
|
1401
|
-
@keyframes jkl-loader-left-spin-
|
|
1401
|
+
@keyframes jkl-loader-left-spin-uasi5l1 {
|
|
1402
1402
|
0% {
|
|
1403
1403
|
transform: rotate(0) scale(0);
|
|
1404
1404
|
}
|
|
@@ -1412,7 +1412,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1412
1412
|
transform: rotate(180deg) scale(0);
|
|
1413
1413
|
}
|
|
1414
1414
|
}
|
|
1415
|
-
@keyframes jkl-loader-middle-spin-
|
|
1415
|
+
@keyframes jkl-loader-middle-spin-uasi5ln {
|
|
1416
1416
|
0% {
|
|
1417
1417
|
transform: rotate(20deg) scale(0);
|
|
1418
1418
|
}
|
|
@@ -1429,7 +1429,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1429
1429
|
transform: rotate(200deg) scale(0);
|
|
1430
1430
|
}
|
|
1431
1431
|
}
|
|
1432
|
-
@keyframes jkl-loader-right-spin-
|
|
1432
|
+
@keyframes jkl-loader-right-spin-uasi5mg {
|
|
1433
1433
|
0% {
|
|
1434
1434
|
transform: rotate(40deg) scale(0);
|
|
1435
1435
|
}
|
|
@@ -1477,7 +1477,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1477
1477
|
bottom: 0;
|
|
1478
1478
|
width: 12.5rem;
|
|
1479
1479
|
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%);
|
|
1480
|
-
animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-
|
|
1480
|
+
animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uasi5mh;
|
|
1481
1481
|
}
|
|
1482
1482
|
@media (width >= 0) and (max-width: 679px) {
|
|
1483
1483
|
.jkl-skeleton-animation {
|
|
@@ -1508,7 +1508,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1508
1508
|
@media screen and (forced-colors: active) {
|
|
1509
1509
|
.jkl-skeleton-element {
|
|
1510
1510
|
border: 1px solid CanvasText;
|
|
1511
|
-
animation: 2s ease infinite jkl-blink-
|
|
1511
|
+
animation: 2s ease infinite jkl-blink-uasi5nh;
|
|
1512
1512
|
}
|
|
1513
1513
|
}
|
|
1514
1514
|
|
|
@@ -1564,11 +1564,11 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1564
1564
|
}
|
|
1565
1565
|
@media screen and (forced-colors: active) {
|
|
1566
1566
|
.jkl-skeleton-table {
|
|
1567
|
-
animation: 2s ease-in-out infinite jkl-blink-
|
|
1567
|
+
animation: 2s ease-in-out infinite jkl-blink-uasi5nh;
|
|
1568
1568
|
}
|
|
1569
1569
|
}
|
|
1570
1570
|
|
|
1571
|
-
@keyframes jkl-sweep-
|
|
1571
|
+
@keyframes jkl-sweep-uasi5mh {
|
|
1572
1572
|
0% {
|
|
1573
1573
|
transform: translateX(calc(0vw - 200px));
|
|
1574
1574
|
}
|
|
@@ -1576,7 +1576,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
|
|
|
1576
1576
|
transform: translateX(calc(100vw + 400px));
|
|
1577
1577
|
}
|
|
1578
1578
|
}
|
|
1579
|
-
@keyframes jkl-blink-
|
|
1579
|
+
@keyframes jkl-blink-uasi5nh {
|
|
1580
1580
|
0% {
|
|
1581
1581
|
opacity: 1;
|
|
1582
1582
|
}
|
|
@@ -2040,7 +2040,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
2040
2040
|
--jkl-checkbox-line-height: 1.5rem;
|
|
2041
2041
|
}
|
|
2042
2042
|
|
|
2043
|
-
@keyframes jkl-checkbox-checked-
|
|
2043
|
+
@keyframes jkl-checkbox-checked-uasi5of {
|
|
2044
2044
|
0% {
|
|
2045
2045
|
width: 0;
|
|
2046
2046
|
height: 0;
|
|
@@ -2054,7 +2054,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
2054
2054
|
height: 58%;
|
|
2055
2055
|
}
|
|
2056
2056
|
}
|
|
2057
|
-
@keyframes jkl-checkbox-indeterminate-
|
|
2057
|
+
@keyframes jkl-checkbox-indeterminate-uasi5pb {
|
|
2058
2058
|
0% {
|
|
2059
2059
|
width: 0;
|
|
2060
2060
|
}
|
|
@@ -2082,11 +2082,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
2082
2082
|
top: -6px;
|
|
2083
2083
|
}
|
|
2084
2084
|
.jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
|
|
2085
|
-
animation: jkl-checkbox-checked-
|
|
2085
|
+
animation: jkl-checkbox-checked-uasi5of 150ms ease-in-out forwards;
|
|
2086
2086
|
opacity: 1;
|
|
2087
2087
|
}
|
|
2088
2088
|
.jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
|
|
2089
|
-
animation: jkl-checkbox-indeterminate-
|
|
2089
|
+
animation: jkl-checkbox-indeterminate-uasi5pb 150ms ease-in-out forwards;
|
|
2090
2090
|
opacity: 1;
|
|
2091
2091
|
}
|
|
2092
2092
|
.jkl-checkbox__input:focus-visible + .jkl-checkbox__label {
|
|
@@ -2257,7 +2257,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
2257
2257
|
--outer-border-thickness: 0.125rem;
|
|
2258
2258
|
}
|
|
2259
2259
|
|
|
2260
|
-
@keyframes jkl-checkbox-checked-
|
|
2260
|
+
@keyframes jkl-checkbox-checked-uasi5pp {
|
|
2261
2261
|
0% {
|
|
2262
2262
|
width: 0;
|
|
2263
2263
|
height: 0;
|
|
@@ -2320,7 +2320,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
|
|
|
2320
2320
|
}
|
|
2321
2321
|
}
|
|
2322
2322
|
.jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
|
|
2323
|
-
animation: jkl-checkbox-checked-
|
|
2323
|
+
animation: jkl-checkbox-checked-uasi5pp 150ms ease-in-out forwards;
|
|
2324
2324
|
opacity: 1;
|
|
2325
2325
|
}
|
|
2326
2326
|
.jkl-checkbox-panel:has([aria-invalid=true]) {
|
|
@@ -3016,11 +3016,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
|
|
|
3016
3016
|
}
|
|
3017
3017
|
}
|
|
3018
3018
|
.jkl-countdown__tracker {
|
|
3019
|
-
animation: jkl-downcount-
|
|
3019
|
+
animation: jkl-downcount-uasi5q0 var(--duration) linear forwards;
|
|
3020
3020
|
animation-play-state: var(--play-state, running);
|
|
3021
3021
|
}
|
|
3022
3022
|
|
|
3023
|
-
@keyframes jkl-downcount-
|
|
3023
|
+
@keyframes jkl-downcount-uasi5q0 {
|
|
3024
3024
|
from {
|
|
3025
3025
|
width: 100%;
|
|
3026
3026
|
}
|
|
@@ -3696,7 +3696,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
|
|
|
3696
3696
|
padding: 1rem 0 2.5rem 0;
|
|
3697
3697
|
}
|
|
3698
3698
|
|
|
3699
|
-
@keyframes jkl-show-
|
|
3699
|
+
@keyframes jkl-show-uasi5qa {
|
|
3700
3700
|
from {
|
|
3701
3701
|
transform: translate3d(0, 0.5rem, 0);
|
|
3702
3702
|
opacity: 0;
|
|
@@ -3731,7 +3731,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
|
|
|
3731
3731
|
}
|
|
3732
3732
|
}
|
|
3733
3733
|
.jkl-feedback__fade-in {
|
|
3734
|
-
animation: jkl-show-
|
|
3734
|
+
animation: jkl-show-uasi5qa 0.25s ease-out;
|
|
3735
3735
|
}
|
|
3736
3736
|
.jkl-feedback__buttons {
|
|
3737
3737
|
display: flex;
|
|
@@ -3973,7 +3973,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3973
3973
|
--background-color: var(--jkl-color-background-alert-success);
|
|
3974
3974
|
}
|
|
3975
3975
|
.jkl-message--dismissed {
|
|
3976
|
-
animation: jkl-dismiss-
|
|
3976
|
+
animation: jkl-dismiss-uasi5r9 400ms ease-in-out forwards;
|
|
3977
3977
|
transition: visibility 0ms 400ms;
|
|
3978
3978
|
visibility: hidden;
|
|
3979
3979
|
}
|
|
@@ -3993,7 +3993,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
3993
3993
|
}
|
|
3994
3994
|
}
|
|
3995
3995
|
|
|
3996
|
-
@keyframes jkl-dismiss-
|
|
3996
|
+
@keyframes jkl-dismiss-uasi5r9 {
|
|
3997
3997
|
from {
|
|
3998
3998
|
opacity: 1;
|
|
3999
3999
|
transform: translate3d(0, 0, 0);
|
|
@@ -4049,7 +4049,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
4049
4049
|
--jkl-radio-button-label-font-weight: var(--jkl-small-font-weight);
|
|
4050
4050
|
}
|
|
4051
4051
|
|
|
4052
|
-
@keyframes jkl-dot-in-
|
|
4052
|
+
@keyframes jkl-dot-in-uasi5s8 {
|
|
4053
4053
|
0% {
|
|
4054
4054
|
transform: scale(0.8);
|
|
4055
4055
|
}
|
|
@@ -4094,7 +4094,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
|
|
|
4094
4094
|
}
|
|
4095
4095
|
.jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
|
|
4096
4096
|
--dot-color: var(--jkl-color-border-action);
|
|
4097
|
-
animation: jkl-dot-in-
|
|
4097
|
+
animation: jkl-dot-in-uasi5s8 150ms ease;
|
|
4098
4098
|
}
|
|
4099
4099
|
@media screen and (forced-colors: active) {
|
|
4100
4100
|
.jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
|
|
@@ -5214,7 +5214,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
|
|
|
5214
5214
|
transition-duration: 150ms;
|
|
5215
5215
|
}
|
|
5216
5216
|
|
|
5217
|
-
@keyframes jkl-downcount-
|
|
5217
|
+
@keyframes jkl-downcount-uasi5sy {
|
|
5218
5218
|
from {
|
|
5219
5219
|
width: 100%;
|
|
5220
5220
|
}
|
|
@@ -5222,7 +5222,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
|
|
|
5222
5222
|
width: 0%;
|
|
5223
5223
|
}
|
|
5224
5224
|
}
|
|
5225
|
-
@keyframes jkl-dot-in-
|
|
5225
|
+
@keyframes jkl-dot-in-uasi5t7 {
|
|
5226
5226
|
0% {
|
|
5227
5227
|
transform: scale(0.8);
|
|
5228
5228
|
}
|
|
@@ -5270,7 +5270,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
|
|
|
5270
5270
|
}
|
|
5271
5271
|
}
|
|
5272
5272
|
.jkl-radio-panel__input:checked + .jkl-radio-panel__decorator::after {
|
|
5273
|
-
animation: jkl-dot-in-
|
|
5273
|
+
animation: jkl-dot-in-uasi5t7 150ms ease;
|
|
5274
5274
|
}
|
|
5275
5275
|
.jkl-radio-panel:has(:checked) {
|
|
5276
5276
|
--radio-dot-color: var(--jkl-color-border-action);
|
|
@@ -5482,7 +5482,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
|
|
|
5482
5482
|
margin-bottom: 0;
|
|
5483
5483
|
}
|
|
5484
5484
|
.jkl-system-message--dismissed {
|
|
5485
|
-
animation: jkl-dismiss-
|
|
5485
|
+
animation: jkl-dismiss-uasi5tr 400ms ease-in forwards;
|
|
5486
5486
|
transition: visibility 0ms 400ms;
|
|
5487
5487
|
visibility: hidden;
|
|
5488
5488
|
}
|
|
@@ -5514,7 +5514,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
|
|
|
5514
5514
|
}
|
|
5515
5515
|
}
|
|
5516
5516
|
|
|
5517
|
-
@keyframes jkl-dismiss-
|
|
5517
|
+
@keyframes jkl-dismiss-uasi5tr {
|
|
5518
5518
|
from {
|
|
5519
5519
|
opacity: 1;
|
|
5520
5520
|
transform: translate3d(0, 0, 0);
|
|
@@ -6384,14 +6384,14 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
|
|
|
6384
6384
|
|
|
6385
6385
|
.jkl-toast[data-animation=entering],
|
|
6386
6386
|
.jkl-toast[data-animation=queued] {
|
|
6387
|
-
animation: jkl-entering-
|
|
6387
|
+
animation: jkl-entering-uasi5un 200ms ease-out forwards;
|
|
6388
6388
|
}
|
|
6389
6389
|
|
|
6390
6390
|
.jkl-toast[data-animation=exiting] {
|
|
6391
|
-
animation: jkl-exiting-
|
|
6391
|
+
animation: jkl-exiting-uasi5uw 150ms ease-in forwards;
|
|
6392
6392
|
}
|
|
6393
6393
|
|
|
6394
|
-
@keyframes jkl-entering-
|
|
6394
|
+
@keyframes jkl-entering-uasi5un {
|
|
6395
6395
|
from {
|
|
6396
6396
|
opacity: 0;
|
|
6397
6397
|
transform: translate3d(0, 50%, 0);
|
|
@@ -6401,7 +6401,7 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
|
|
|
6401
6401
|
transform: translate3d(0, 0, 0);
|
|
6402
6402
|
}
|
|
6403
6403
|
}
|
|
6404
|
-
@keyframes jkl-exiting-
|
|
6404
|
+
@keyframes jkl-exiting-uasi5uw {
|
|
6405
6405
|
from {
|
|
6406
6406
|
opacity: 1;
|
|
6407
6407
|
transform: translate3d(0, 0, 0);
|