@fremtind/jokul 0.30.7 → 0.30.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.
Files changed (31) hide show
  1. package/build/build-stats.html +1 -1
  2. package/package.json +2 -2
  3. package/styles/components/button/button.css +3 -3
  4. package/styles/components/button/button.min.css +1 -1
  5. package/styles/components/button/button.scss +1 -1
  6. package/styles/components/checkbox/checkbox.css +4 -4
  7. package/styles/components/checkbox/checkbox.min.css +1 -1
  8. package/styles/components/feedback/feedback.css +2 -2
  9. package/styles/components/feedback/feedback.min.css +1 -1
  10. package/styles/components/input-group/input-group.css +2 -2
  11. package/styles/components/input-group/input-group.min.css +1 -1
  12. package/styles/components/input-panel/checkbox-panel.css +2 -2
  13. package/styles/components/input-panel/checkbox-panel.min.css +1 -1
  14. package/styles/components/input-panel/radio-panel.css +2 -2
  15. package/styles/components/input-panel/radio-panel.min.css +1 -1
  16. package/styles/components/loader/loader.css +6 -6
  17. package/styles/components/loader/loader.min.css +1 -1
  18. package/styles/components/loader/skeleton-loader.css +5 -5
  19. package/styles/components/loader/skeleton-loader.min.css +1 -1
  20. package/styles/components/message/message.css +2 -2
  21. package/styles/components/message/message.min.css +1 -1
  22. package/styles/components/progress-bar/progress-bar.css +2 -2
  23. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  24. package/styles/components/radio-button/radio-button.css +2 -2
  25. package/styles/components/radio-button/radio-button.min.css +1 -1
  26. package/styles/components/system-message/system-message.css +2 -2
  27. package/styles/components/system-message/system-message.min.css +1 -1
  28. package/styles/components/toast/toast.css +4 -4
  29. package/styles/components/toast/toast.min.css +1 -1
  30. package/styles/styles.css +38 -38
  31. package/styles/styles.min.css +1 -1
package/styles/styles.css CHANGED
@@ -521,7 +521,7 @@
521
521
  --background-color: transparent;
522
522
  --border-radius: 0;
523
523
  --border-width: 0.0625rem;
524
- display: block;
524
+ display: inline-block;
525
525
  cursor: pointer;
526
526
  user-select: none;
527
527
  background-color: var(--background-color);
@@ -620,7 +620,7 @@
620
620
  height: 1rem;
621
621
  }
622
622
  html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
623
- animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-ujx0r2i;
623
+ animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-unab252;
624
624
  }
625
625
  :not([data-touchnavigation]) .jkl-button--primary:hover, :not([data-touchnavigation]) .jkl-button--secondary:hover, :not([data-touchnavigation]) .jkl-button--tertiary:hover {
626
626
  scale: 1.05;
@@ -664,7 +664,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
664
664
  --background-color: var(--jkl-color-background-interactive-hover);
665
665
  }
666
666
 
667
- @keyframes jkl-tertiary-flash-ujx0r2i {
667
+ @keyframes jkl-tertiary-flash-unab252 {
668
668
  0% {
669
669
  opacity: 0.5;
670
670
  scale: 1;
@@ -689,15 +689,15 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
689
689
  animation: 2500ms linear infinite;
690
690
  }
691
691
  .jkl-loader__dot--left {
692
- animation-name: jkl-loader-left-spin-ujx0r3c;
692
+ animation-name: jkl-loader-left-spin-unab25b;
693
693
  margin-right: 1.71em;
694
694
  }
695
695
  .jkl-loader__dot--middle {
696
- animation-name: jkl-loader-middle-spin-ujx0r3g;
696
+ animation-name: jkl-loader-middle-spin-unab25x;
697
697
  margin-right: 1.9em;
698
698
  }
699
699
  .jkl-loader__dot--right {
700
- animation-name: jkl-loader-right-spin-ujx0r3v;
700
+ animation-name: jkl-loader-right-spin-unab26n;
701
701
  }
702
702
  @media screen and (forced-colors: active) {
703
703
  .jkl-loader__dot {
@@ -725,7 +725,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
725
725
  margin-right: 0.3em;
726
726
  }
727
727
 
728
- @keyframes jkl-loader-left-spin-ujx0r3c {
728
+ @keyframes jkl-loader-left-spin-unab25b {
729
729
  0% {
730
730
  transform: rotate(0) scale(0);
731
731
  }
@@ -739,7 +739,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
739
739
  transform: rotate(180deg) scale(0);
740
740
  }
741
741
  }
742
- @keyframes jkl-loader-middle-spin-ujx0r3g {
742
+ @keyframes jkl-loader-middle-spin-unab25x {
743
743
  0% {
744
744
  transform: rotate(20deg) scale(0);
745
745
  }
@@ -756,7 +756,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
756
756
  transform: rotate(200deg) scale(0);
757
757
  }
758
758
  }
759
- @keyframes jkl-loader-right-spin-ujx0r3v {
759
+ @keyframes jkl-loader-right-spin-unab26n {
760
760
  0% {
761
761
  transform: rotate(40deg) scale(0);
762
762
  }
@@ -804,7 +804,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
804
804
  bottom: 0;
805
805
  width: 12.5rem;
806
806
  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%);
807
- animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-ujx0r4s;
807
+ animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-unab26v;
808
808
  }
809
809
  @media (width >= 0) and (max-width: 679px) {
810
810
  .jkl-skeleton-animation {
@@ -835,7 +835,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
835
835
  @media screen and (forced-colors: active) {
836
836
  .jkl-skeleton-element {
837
837
  border: 1px solid CanvasText;
838
- animation: 2s ease infinite jkl-blink-ujx0r4y;
838
+ animation: 2s ease infinite jkl-blink-unab27g;
839
839
  }
840
840
  }
841
841
 
@@ -891,11 +891,11 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
891
891
  }
892
892
  @media screen and (forced-colors: active) {
893
893
  .jkl-skeleton-table {
894
- animation: 2s ease-in-out infinite jkl-blink-ujx0r4y;
894
+ animation: 2s ease-in-out infinite jkl-blink-unab27g;
895
895
  }
896
896
  }
897
897
 
898
- @keyframes jkl-sweep-ujx0r4s {
898
+ @keyframes jkl-sweep-unab26v {
899
899
  0% {
900
900
  transform: translateX(calc(0vw - 200px));
901
901
  }
@@ -903,7 +903,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
903
903
  transform: translateX(calc(100vw + 400px));
904
904
  }
905
905
  }
906
- @keyframes jkl-blink-ujx0r4y {
906
+ @keyframes jkl-blink-unab27g {
907
907
  0% {
908
908
  opacity: 1;
909
909
  }
@@ -1468,7 +1468,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
1468
1468
  --jkl-checkbox-line-height: 1.5rem;
1469
1469
  }
1470
1470
 
1471
- @keyframes jkl-checkbox-checked-ujx0r5n {
1471
+ @keyframes jkl-checkbox-checked-unab28d {
1472
1472
  0% {
1473
1473
  width: 0;
1474
1474
  height: 0;
@@ -1482,7 +1482,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
1482
1482
  height: 58%;
1483
1483
  }
1484
1484
  }
1485
- @keyframes jkl-checkbox-indeterminate-ujx0r6n {
1485
+ @keyframes jkl-checkbox-indeterminate-unab290 {
1486
1486
  0% {
1487
1487
  width: 0;
1488
1488
  }
@@ -1510,11 +1510,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
1510
1510
  top: -6px;
1511
1511
  }
1512
1512
  .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
1513
- animation: jkl-checkbox-checked-ujx0r5n 150ms ease-in-out forwards;
1513
+ animation: jkl-checkbox-checked-unab28d 150ms ease-in-out forwards;
1514
1514
  opacity: 1;
1515
1515
  }
1516
1516
  .jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
1517
- animation: jkl-checkbox-indeterminate-ujx0r6n 150ms ease-in-out forwards;
1517
+ animation: jkl-checkbox-indeterminate-unab290 150ms ease-in-out forwards;
1518
1518
  opacity: 1;
1519
1519
  }
1520
1520
  .jkl-checkbox__input:focus-visible + .jkl-checkbox__label {
@@ -2040,7 +2040,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2040
2040
  --color: var(--jkl-color-text-default);
2041
2041
  }
2042
2042
  .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 {
2043
- animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-ujx0r7g forwards;
2043
+ animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-unab2a0 forwards;
2044
2044
  }
2045
2045
  .jkl-form-support-label--sr-only {
2046
2046
  border: 0 !important;
@@ -2115,7 +2115,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2115
2115
  white-space: nowrap !important; /* 3 */
2116
2116
  }
2117
2117
 
2118
- @keyframes jkl-support-icon-entrance-ujx0r7g {
2118
+ @keyframes jkl-support-icon-entrance-unab2a0 {
2119
2119
  0% {
2120
2120
  margin-right: 0;
2121
2121
  opacity: 0;
@@ -3539,7 +3539,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-area__tex
3539
3539
  padding: 1rem 0 2.5rem 0;
3540
3540
  }
3541
3541
 
3542
- @keyframes jkl-show-ujx0r7t {
3542
+ @keyframes jkl-show-unab2a9 {
3543
3543
  from {
3544
3544
  transform: translate3d(0, 0.5rem, 0);
3545
3545
  opacity: 0;
@@ -3574,7 +3574,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-area__tex
3574
3574
  }
3575
3575
  }
3576
3576
  .jkl-feedback__fade-in {
3577
- animation: jkl-show-ujx0r7t 0.25s ease-out;
3577
+ animation: jkl-show-unab2a9 0.25s ease-out;
3578
3578
  }
3579
3579
  .jkl-feedback__buttons {
3580
3580
  display: flex;
@@ -3812,7 +3812,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3812
3812
  --background-color: var(--jkl-color-background-alert-success);
3813
3813
  }
3814
3814
  .jkl-message--dismissed {
3815
- animation: jkl-dismiss-ujx0r8s 400ms ease-in-out forwards;
3815
+ animation: jkl-dismiss-unab2az 400ms ease-in-out forwards;
3816
3816
  transition: visibility 0ms 400ms;
3817
3817
  visibility: hidden;
3818
3818
  }
@@ -3832,7 +3832,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3832
3832
  }
3833
3833
  }
3834
3834
 
3835
- @keyframes jkl-dismiss-ujx0r8s {
3835
+ @keyframes jkl-dismiss-unab2az {
3836
3836
  from {
3837
3837
  opacity: 1;
3838
3838
  transform: translate3d(0, 0, 0);
@@ -3888,7 +3888,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3888
3888
  --jkl-radio-button-label-font-weight: var(--jkl-small-font-weight);
3889
3889
  }
3890
3890
 
3891
- @keyframes jkl-dot-in-ujx0r9p {
3891
+ @keyframes jkl-dot-in-unab2bj {
3892
3892
  0% {
3893
3893
  transform: scale(0.8);
3894
3894
  }
@@ -3931,7 +3931,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3931
3931
  }
3932
3932
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
3933
3933
  --dot-color: var(--jkl-color-border-action);
3934
- animation: jkl-dot-in-ujx0r9p 150ms ease;
3934
+ animation: jkl-dot-in-unab2bj 150ms ease;
3935
3935
  }
3936
3936
  @media screen and (forced-colors: active) {
3937
3937
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
@@ -4081,7 +4081,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4081
4081
  --background-color: var(--jkl-color-background-container-high);
4082
4082
  }
4083
4083
 
4084
- @keyframes jkl-dot-in-ujx0raa {
4084
+ @keyframes jkl-dot-in-unab2ch {
4085
4085
  0% {
4086
4086
  transform: scale(0.8);
4087
4087
  }
@@ -4129,7 +4129,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4129
4129
  }
4130
4130
  }
4131
4131
  .jkl-radio-panel__input:checked + .jkl-radio-panel__decorator::after {
4132
- animation: jkl-dot-in-ujx0raa 150ms ease;
4132
+ animation: jkl-dot-in-unab2ch 150ms ease;
4133
4133
  }
4134
4134
  .jkl-radio-panel:has(:checked) {
4135
4135
  --radio-dot-color: var(--jkl-color-border-action);
@@ -4141,7 +4141,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4141
4141
  --radio-dot-color: var(--jkl-color-text-on-alert);
4142
4142
  }
4143
4143
 
4144
- @keyframes jkl-checkbox-checked-ujx0rb3 {
4144
+ @keyframes jkl-checkbox-checked-unab2dg {
4145
4145
  0% {
4146
4146
  width: 0;
4147
4147
  height: 0;
@@ -4204,7 +4204,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4204
4204
  }
4205
4205
  }
4206
4206
  .jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
4207
- animation: jkl-checkbox-checked-ujx0rb3 150ms ease-in-out forwards;
4207
+ animation: jkl-checkbox-checked-unab2dg 150ms ease-in-out forwards;
4208
4208
  opacity: 1;
4209
4209
  }
4210
4210
  .jkl-checkbox-panel:has([aria-invalid=true]) {
@@ -4968,11 +4968,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4968
4968
  }
4969
4969
 
4970
4970
  .jkl-countdown__tracker {
4971
- animation: jkl-downcount-ujx0rbs var(--duration) linear forwards;
4971
+ animation: jkl-downcount-unab2e2 var(--duration) linear forwards;
4972
4972
  animation-play-state: var(--play-state, running);
4973
4973
  }
4974
4974
 
4975
- @keyframes jkl-downcount-ujx0rbs {
4975
+ @keyframes jkl-downcount-unab2e2 {
4976
4976
  from {
4977
4977
  width: 100%;
4978
4978
  }
@@ -5171,7 +5171,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-system-message
5171
5171
  margin-bottom: 0;
5172
5172
  }
5173
5173
  .jkl-system-message--dismissed {
5174
- animation: jkl-dismiss-ujx0rco 400ms ease-in forwards;
5174
+ animation: jkl-dismiss-unab2eu 400ms ease-in forwards;
5175
5175
  transition: visibility 0ms 400ms;
5176
5176
  visibility: hidden;
5177
5177
  }
@@ -5203,7 +5203,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-system-message
5203
5203
  }
5204
5204
  }
5205
5205
 
5206
- @keyframes jkl-dismiss-ujx0rco {
5206
+ @keyframes jkl-dismiss-unab2eu {
5207
5207
  from {
5208
5208
  opacity: 1;
5209
5209
  transform: translate3d(0, 0, 0);
@@ -6078,14 +6078,14 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
6078
6078
 
6079
6079
  .jkl-toast[data-animation=entering],
6080
6080
  .jkl-toast[data-animation=queued] {
6081
- animation: jkl-entering-ujx0rdj 200ms ease-out forwards;
6081
+ animation: jkl-entering-unab2f9 200ms ease-out forwards;
6082
6082
  }
6083
6083
 
6084
6084
  .jkl-toast[data-animation=exiting] {
6085
- animation: jkl-exiting-ujx0reg 150ms ease-in forwards;
6085
+ animation: jkl-exiting-unab2fr 150ms ease-in forwards;
6086
6086
  }
6087
6087
 
6088
- @keyframes jkl-entering-ujx0rdj {
6088
+ @keyframes jkl-entering-unab2f9 {
6089
6089
  from {
6090
6090
  opacity: 0;
6091
6091
  transform: translate3d(0, 50%, 0);
@@ -6095,7 +6095,7 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
6095
6095
  transform: translate3d(0, 0, 0);
6096
6096
  }
6097
6097
  }
6098
- @keyframes jkl-exiting-ujx0reg {
6098
+ @keyframes jkl-exiting-unab2fr {
6099
6099
  from {
6100
6100
  opacity: 1;
6101
6101
  transform: translate3d(0, 0, 0);