@keenthemes/ktui 1.0.25 → 1.0.27

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 (85) hide show
  1. package/dist/ktui.js +335 -36
  2. package/dist/ktui.min.js +1 -1
  3. package/dist/ktui.min.js.map +1 -1
  4. package/dist/styles.css +216 -13
  5. package/examples/datatable/checkbox-events-test.html +400 -0
  6. package/examples/datatable/credentials-test.html +423 -0
  7. package/examples/datatable/remote-checkbox-test.html +365 -0
  8. package/examples/modal/persistent.html +205 -0
  9. package/examples/modal/remote-select-dropdown.html +166 -0
  10. package/examples/modal/select-dropdown-container.html +129 -0
  11. package/examples/select/formdata-remote.html +161 -0
  12. package/examples/select/modal-positioning-test.html +338 -0
  13. package/lib/cjs/components/datatable/datatable-checkbox.js +16 -3
  14. package/lib/cjs/components/datatable/datatable-checkbox.js.map +1 -1
  15. package/lib/cjs/components/datatable/datatable.js +3 -5
  16. package/lib/cjs/components/datatable/datatable.js.map +1 -1
  17. package/lib/cjs/components/image-input/image-input.js.map +1 -1
  18. package/lib/cjs/components/modal/modal.js +16 -2
  19. package/lib/cjs/components/modal/modal.js.map +1 -1
  20. package/lib/cjs/components/select/config.js +5 -0
  21. package/lib/cjs/components/select/config.js.map +1 -1
  22. package/lib/cjs/components/select/dropdown.js +54 -3
  23. package/lib/cjs/components/select/dropdown.js.map +1 -1
  24. package/lib/cjs/components/select/select.js +241 -23
  25. package/lib/cjs/components/select/select.js.map +1 -1
  26. package/lib/cjs/components/select/templates.js.map +1 -1
  27. package/lib/esm/components/datatable/datatable-checkbox.js +16 -3
  28. package/lib/esm/components/datatable/datatable-checkbox.js.map +1 -1
  29. package/lib/esm/components/datatable/datatable.js +3 -5
  30. package/lib/esm/components/datatable/datatable.js.map +1 -1
  31. package/lib/esm/components/image-input/image-input.js.map +1 -1
  32. package/lib/esm/components/modal/modal.js +16 -2
  33. package/lib/esm/components/modal/modal.js.map +1 -1
  34. package/lib/esm/components/select/config.js +5 -0
  35. package/lib/esm/components/select/config.js.map +1 -1
  36. package/lib/esm/components/select/dropdown.js +54 -3
  37. package/lib/esm/components/select/dropdown.js.map +1 -1
  38. package/lib/esm/components/select/select.js +241 -23
  39. package/lib/esm/components/select/select.js.map +1 -1
  40. package/lib/esm/components/select/templates.js.map +1 -1
  41. package/package.json +1 -1
  42. package/src/components/datatable/datatable-checkbox.ts +18 -3
  43. package/src/components/datatable/datatable.ts +3 -0
  44. package/src/components/datatable/types.ts +1 -0
  45. package/src/components/image-input/image-input.ts +12 -15
  46. package/src/components/modal/modal.ts +20 -2
  47. package/src/components/select/config.ts +6 -0
  48. package/src/components/select/dropdown.ts +69 -4
  49. package/src/components/select/select.ts +306 -36
  50. package/src/components/select/templates.ts +2 -1
  51. package/lib/cjs/components/config.js +0 -26
  52. package/lib/cjs/components/config.js.map +0 -1
  53. package/lib/cjs/components/config.umd.js +0 -23
  54. package/lib/cjs/components/config.umd.js.map +0 -1
  55. package/lib/cjs/components/menu/index.js +0 -6
  56. package/lib/cjs/components/menu/index.js.map +0 -1
  57. package/lib/cjs/components/menu/menu.js +0 -1021
  58. package/lib/cjs/components/menu/menu.js.map +0 -1
  59. package/lib/cjs/components/menu/types.js +0 -3
  60. package/lib/cjs/components/menu/types.js.map +0 -1
  61. package/lib/cjs/components/theme/index.js +0 -6
  62. package/lib/cjs/components/theme/index.js.map +0 -1
  63. package/lib/cjs/components/theme/theme.js +0 -147
  64. package/lib/cjs/components/theme/theme.js.map +0 -1
  65. package/lib/cjs/components/theme/types.js +0 -3
  66. package/lib/cjs/components/theme/types.js.map +0 -1
  67. package/lib/esm/components/config.js +0 -24
  68. package/lib/esm/components/config.js.map +0 -1
  69. package/lib/esm/components/config.umd.js +0 -23
  70. package/lib/esm/components/config.umd.js.map +0 -1
  71. package/lib/esm/components/menu/index.js +0 -2
  72. package/lib/esm/components/menu/index.js.map +0 -1
  73. package/lib/esm/components/menu/menu.js +0 -1018
  74. package/lib/esm/components/menu/menu.js.map +0 -1
  75. package/lib/esm/components/menu/types.js +0 -2
  76. package/lib/esm/components/menu/types.js.map +0 -1
  77. package/lib/esm/components/theme/index.js +0 -2
  78. package/lib/esm/components/theme/index.js.map +0 -1
  79. package/lib/esm/components/theme/theme.js +0 -144
  80. package/lib/esm/components/theme/theme.js.map +0 -1
  81. package/lib/esm/components/theme/types.js +0 -2
  82. package/lib/esm/components/theme/types.js.map +0 -1
  83. /package/examples/select/{dark-mode-test.html → dark-mode.html} +0 -0
  84. /package/examples/select/{dropdowncontainer-test.html → dropdowncontainer.html} +0 -0
  85. /package/examples/select/{global-config-test.html → global-config.html} +0 -0
package/dist/styles.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */
1
+ /*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
@@ -50,6 +50,8 @@
50
50
  --color-violet-800: oklch(43.2% 0.232 292.759);
51
51
  --color-violet-950: oklch(28.3% 0.141 291.089);
52
52
  --color-purple-500: oklch(62.7% 0.265 303.9);
53
+ --color-purple-600: oklch(55.8% 0.288 302.321);
54
+ --color-purple-700: oklch(49.6% 0.265 301.924);
53
55
  --color-pink-500: oklch(65.6% 0.241 354.308);
54
56
  --color-gray-50: oklch(98.5% 0.002 247.839);
55
57
  --color-gray-100: oklch(96.7% 0.003 264.542);
@@ -78,8 +80,12 @@
78
80
  --spacing: 0.25rem;
79
81
  --container-sm: 24rem;
80
82
  --container-md: 28rem;
83
+ --container-lg: 32rem;
81
84
  --container-2xl: 42rem;
85
+ --container-3xl: 48rem;
82
86
  --container-4xl: 56rem;
87
+ --container-5xl: 64rem;
88
+ --container-6xl: 72rem;
83
89
  --text-xs: 0.75rem;
84
90
  --text-xs--line-height: calc(1 / 0.75);
85
91
  --text-sm: 0.875rem;
@@ -284,6 +290,9 @@
284
290
  .collapse {
285
291
  visibility: collapse;
286
292
  }
293
+ .invisible {
294
+ visibility: hidden;
295
+ }
287
296
  .visible {
288
297
  visibility: visible;
289
298
  }
@@ -313,6 +322,9 @@
313
322
  .sticky {
314
323
  position: sticky;
315
324
  }
325
+ .inset-0 {
326
+ inset: calc(var(--spacing) * 0);
327
+ }
316
328
  .top-1\/2 {
317
329
  top: calc(1/2 * 100%);
318
330
  }
@@ -322,6 +334,9 @@
322
334
  .left-1\/2 {
323
335
  left: calc(1/2 * 100%);
324
336
  }
337
+ .z-50 {
338
+ z-index: 50;
339
+ }
325
340
  .container {
326
341
  width: 100%;
327
342
  @media (width >= 40rem) {
@@ -346,12 +361,21 @@
346
361
  .mx-1 {
347
362
  margin-inline: calc(var(--spacing) * 1);
348
363
  }
364
+ .mx-2 {
365
+ margin-inline: calc(var(--spacing) * 2);
366
+ }
367
+ .mx-4 {
368
+ margin-inline: calc(var(--spacing) * 4);
369
+ }
349
370
  .mx-auto {
350
371
  margin-inline: auto;
351
372
  }
352
373
  .ms-auto {
353
374
  margin-inline-start: auto;
354
375
  }
376
+ .mt-0\.5 {
377
+ margin-top: calc(var(--spacing) * 0.5);
378
+ }
355
379
  .mt-1 {
356
380
  margin-top: calc(var(--spacing) * 1);
357
381
  }
@@ -400,6 +424,9 @@
400
424
  .ml-2 {
401
425
  margin-left: calc(var(--spacing) * 2);
402
426
  }
427
+ .ml-4 {
428
+ margin-left: calc(var(--spacing) * 4);
429
+ }
403
430
  .block {
404
431
  display: block;
405
432
  }
@@ -441,6 +468,9 @@
441
468
  width: calc(var(--spacing) * 16);
442
469
  height: calc(var(--spacing) * 16);
443
470
  }
471
+ .h-4 {
472
+ height: calc(var(--spacing) * 4);
473
+ }
444
474
  .h-5 {
445
475
  height: calc(var(--spacing) * 5);
446
476
  }
@@ -450,6 +480,9 @@
450
480
  .h-8 {
451
481
  height: calc(var(--spacing) * 8);
452
482
  }
483
+ .h-64 {
484
+ height: calc(var(--spacing) * 64);
485
+ }
453
486
  .max-h-48 {
454
487
  max-height: calc(var(--spacing) * 48);
455
488
  }
@@ -462,9 +495,18 @@
462
495
  .max-h-\[250px\] {
463
496
  max-height: 250px;
464
497
  }
498
+ .min-h-\[3rem\] {
499
+ min-height: 3rem;
500
+ }
501
+ .min-h-full {
502
+ min-height: 100%;
503
+ }
465
504
  .min-h-screen {
466
505
  min-height: 100vh;
467
506
  }
507
+ .w-4 {
508
+ width: calc(var(--spacing) * 4);
509
+ }
468
510
  .w-5 {
469
511
  width: calc(var(--spacing) * 5);
470
512
  }
@@ -492,15 +534,33 @@
492
534
  .w-40 {
493
535
  width: calc(var(--spacing) * 40);
494
536
  }
537
+ .w-48 {
538
+ width: calc(var(--spacing) * 48);
539
+ }
540
+ .w-64 {
541
+ width: calc(var(--spacing) * 64);
542
+ }
495
543
  .w-full {
496
544
  width: 100%;
497
545
  }
498
546
  .max-w-2xl {
499
547
  max-width: var(--container-2xl);
500
548
  }
549
+ .max-w-3xl {
550
+ max-width: var(--container-3xl);
551
+ }
501
552
  .max-w-4xl {
502
553
  max-width: var(--container-4xl);
503
554
  }
555
+ .max-w-5xl {
556
+ max-width: var(--container-5xl);
557
+ }
558
+ .max-w-6xl {
559
+ max-width: var(--container-6xl);
560
+ }
561
+ .max-w-lg {
562
+ max-width: var(--container-lg);
563
+ }
504
564
  .max-w-md {
505
565
  max-width: var(--container-md);
506
566
  }
@@ -550,6 +610,15 @@
550
610
  .resize {
551
611
  resize: both;
552
612
  }
613
+ .list-inside {
614
+ list-style-position: inside;
615
+ }
616
+ .list-decimal {
617
+ list-style-type: decimal;
618
+ }
619
+ .list-disc {
620
+ list-style-type: disc;
621
+ }
553
622
  .grid-cols-1 {
554
623
  grid-template-columns: repeat(1, minmax(0, 1fr));
555
624
  }
@@ -568,12 +637,18 @@
568
637
  .items-center {
569
638
  align-items: center;
570
639
  }
640
+ .items-start {
641
+ align-items: flex-start;
642
+ }
571
643
  .justify-between {
572
644
  justify-content: space-between;
573
645
  }
574
646
  .justify-center {
575
647
  justify-content: center;
576
648
  }
649
+ .justify-end {
650
+ justify-content: flex-end;
651
+ }
577
652
  .gap-0\.5 {
578
653
  gap: calc(var(--spacing) * 0.5);
579
654
  }
@@ -602,6 +677,13 @@
602
677
  margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
603
678
  }
604
679
  }
680
+ .space-y-1\.5 {
681
+ :where(& > :not(:last-child)) {
682
+ --tw-space-y-reverse: 0;
683
+ margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
684
+ margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
685
+ }
686
+ }
605
687
  .space-y-2 {
606
688
  :where(& > :not(:last-child)) {
607
689
  --tw-space-y-reverse: 0;
@@ -609,6 +691,13 @@
609
691
  margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
610
692
  }
611
693
  }
694
+ .space-y-3 {
695
+ :where(& > :not(:last-child)) {
696
+ --tw-space-y-reverse: 0;
697
+ margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
698
+ margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
699
+ }
700
+ }
612
701
  .space-y-4 {
613
702
  :where(& > :not(:last-child)) {
614
703
  --tw-space-y-reverse: 0;
@@ -657,6 +746,9 @@
657
746
  .overflow-hidden {
658
747
  overflow: hidden;
659
748
  }
749
+ .overflow-x-auto {
750
+ overflow-x: auto;
751
+ }
660
752
  .overflow-y-auto {
661
753
  overflow-y: auto;
662
754
  }
@@ -695,6 +787,10 @@
695
787
  border-bottom-style: var(--tw-border-style);
696
788
  border-bottom-width: 1px;
697
789
  }
790
+ .border-l-2 {
791
+ border-left-style: var(--tw-border-style);
792
+ border-left-width: 2px;
793
+ }
698
794
  .border-dashed {
699
795
  --tw-border-style: dashed;
700
796
  border-style: dashed;
@@ -703,6 +799,9 @@
703
799
  --tw-border-style: none;
704
800
  border-style: none;
705
801
  }
802
+ .border-blue-200 {
803
+ border-color: var(--color-blue-200);
804
+ }
706
805
  .border-blue-500 {
707
806
  border-color: var(--color-blue-500);
708
807
  }
@@ -712,6 +811,12 @@
712
811
  .border-gray-300 {
713
812
  border-color: var(--color-gray-300);
714
813
  }
814
+ .border-gray-400 {
815
+ border-color: var(--color-gray-400);
816
+ }
817
+ .border-gray-900 {
818
+ border-color: var(--color-gray-900);
819
+ }
715
820
  .border-input {
716
821
  border-color: var(--input);
717
822
  }
@@ -736,6 +841,9 @@
736
841
  .bg-gray-100 {
737
842
  background-color: var(--color-gray-100);
738
843
  }
844
+ .bg-gray-200 {
845
+ background-color: var(--color-gray-200);
846
+ }
739
847
  .bg-gray-500 {
740
848
  background-color: var(--color-gray-500);
741
849
  }
@@ -745,12 +853,24 @@
745
853
  .bg-green-500 {
746
854
  background-color: var(--color-green-500);
747
855
  }
856
+ .bg-green-600 {
857
+ background-color: var(--color-green-600);
858
+ }
748
859
  .bg-pink-500 {
749
860
  background-color: var(--color-pink-500);
750
861
  }
751
862
  .bg-purple-500 {
752
863
  background-color: var(--color-purple-500);
753
864
  }
865
+ .bg-purple-600 {
866
+ background-color: var(--color-purple-600);
867
+ }
868
+ .bg-red-50 {
869
+ background-color: var(--color-red-50);
870
+ }
871
+ .bg-red-600 {
872
+ background-color: var(--color-red-600);
873
+ }
754
874
  .bg-transparent {
755
875
  background-color: transparent;
756
876
  }
@@ -811,6 +931,12 @@
811
931
  .py-3 {
812
932
  padding-block: calc(var(--spacing) * 3);
813
933
  }
934
+ .py-4 {
935
+ padding-block: calc(var(--spacing) * 4);
936
+ }
937
+ .py-5 {
938
+ padding-block: calc(var(--spacing) * 5);
939
+ }
814
940
  .py-8 {
815
941
  padding-block: calc(var(--spacing) * 8);
816
942
  }
@@ -820,9 +946,15 @@
820
946
  .pt-3 {
821
947
  padding-top: calc(var(--spacing) * 3);
822
948
  }
949
+ .pb-2 {
950
+ padding-bottom: calc(var(--spacing) * 2);
951
+ }
823
952
  .pb-3 {
824
953
  padding-bottom: calc(var(--spacing) * 3);
825
954
  }
955
+ .pl-3 {
956
+ padding-left: calc(var(--spacing) * 3);
957
+ }
826
958
  .pl-5 {
827
959
  padding-left: calc(var(--spacing) * 5);
828
960
  }
@@ -846,6 +978,14 @@
846
978
  font-size: var(--text-3xl);
847
979
  line-height: var(--tw-leading, var(--text-3xl--line-height));
848
980
  }
981
+ .text-base {
982
+ font-size: var(--text-base);
983
+ line-height: var(--tw-leading, var(--text-base--line-height));
984
+ }
985
+ .text-lg {
986
+ font-size: var(--text-lg);
987
+ line-height: var(--tw-leading, var(--text-lg--line-height));
988
+ }
849
989
  .text-sm {
850
990
  font-size: var(--text-sm);
851
991
  line-height: var(--tw-leading, var(--text-sm--line-height));
@@ -870,6 +1010,10 @@
870
1010
  --tw-font-weight: var(--font-weight-medium);
871
1011
  font-weight: var(--font-weight-medium);
872
1012
  }
1013
+ .font-normal {
1014
+ --tw-font-weight: var(--font-weight-normal);
1015
+ font-weight: var(--font-weight-normal);
1016
+ }
873
1017
  .font-semibold {
874
1018
  --tw-font-weight: var(--font-weight-semibold);
875
1019
  font-weight: var(--font-weight-semibold);
@@ -916,15 +1060,18 @@
916
1060
  .text-primary {
917
1061
  color: var(--primary);
918
1062
  }
1063
+ .text-purple-600 {
1064
+ color: var(--color-purple-600);
1065
+ }
919
1066
  .text-red-600 {
920
1067
  color: var(--color-red-600);
921
1068
  }
1069
+ .text-red-700 {
1070
+ color: var(--color-red-700);
1071
+ }
922
1072
  .text-white {
923
1073
  color: var(--color-white);
924
1074
  }
925
- .capitalize {
926
- text-transform: capitalize;
927
- }
928
1075
  .uppercase {
929
1076
  text-transform: uppercase;
930
1077
  }
@@ -956,13 +1103,24 @@
956
1103
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
957
1104
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
958
1105
  }
1106
+ .shadow-xl {
1107
+ --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1108
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1109
+ }
959
1110
  .ring {
960
1111
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
961
1112
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
962
1113
  }
1114
+ .ring-2 {
1115
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1116
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1117
+ }
963
1118
  .ring-blue-300 {
964
1119
  --tw-ring-color: var(--color-blue-300);
965
1120
  }
1121
+ .ring-gray-400 {
1122
+ --tw-ring-color: var(--color-gray-400);
1123
+ }
966
1124
  .outline {
967
1125
  outline-style: var(--tw-outline-style);
968
1126
  outline-width: 1px;
@@ -983,11 +1141,6 @@
983
1141
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
984
1142
  transition-duration: var(--tw-duration, var(--default-transition-duration));
985
1143
  }
986
- .transition-all {
987
- transition-property: all;
988
- transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
989
- transition-duration: var(--tw-duration, var(--default-transition-duration));
990
- }
991
1144
  .transition-colors {
992
1145
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
993
1146
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -997,10 +1150,6 @@
997
1150
  --tw-duration: 200ms;
998
1151
  transition-duration: 200ms;
999
1152
  }
1000
- .duration-300 {
1001
- --tw-duration: 300ms;
1002
- transition-duration: 300ms;
1003
- }
1004
1153
  .hover\:bg-blue-50 {
1005
1154
  &:hover {
1006
1155
  @media (hover: hover) {
@@ -1029,6 +1178,13 @@
1029
1178
  }
1030
1179
  }
1031
1180
  }
1181
+ .hover\:bg-gray-50 {
1182
+ &:hover {
1183
+ @media (hover: hover) {
1184
+ background-color: var(--color-gray-50);
1185
+ }
1186
+ }
1187
+ }
1032
1188
  .hover\:bg-gray-100 {
1033
1189
  &:hover {
1034
1190
  @media (hover: hover) {
@@ -1043,6 +1199,13 @@
1043
1199
  }
1044
1200
  }
1045
1201
  }
1202
+ .hover\:bg-gray-300 {
1203
+ &:hover {
1204
+ @media (hover: hover) {
1205
+ background-color: var(--color-gray-300);
1206
+ }
1207
+ }
1208
+ }
1046
1209
  .hover\:bg-gray-600 {
1047
1210
  &:hover {
1048
1211
  @media (hover: hover) {
@@ -1050,6 +1213,41 @@
1050
1213
  }
1051
1214
  }
1052
1215
  }
1216
+ .hover\:bg-gray-700 {
1217
+ &:hover {
1218
+ @media (hover: hover) {
1219
+ background-color: var(--color-gray-700);
1220
+ }
1221
+ }
1222
+ }
1223
+ .hover\:bg-gray-800 {
1224
+ &:hover {
1225
+ @media (hover: hover) {
1226
+ background-color: var(--color-gray-800);
1227
+ }
1228
+ }
1229
+ }
1230
+ .hover\:bg-green-700 {
1231
+ &:hover {
1232
+ @media (hover: hover) {
1233
+ background-color: var(--color-green-700);
1234
+ }
1235
+ }
1236
+ }
1237
+ .hover\:bg-purple-700 {
1238
+ &:hover {
1239
+ @media (hover: hover) {
1240
+ background-color: var(--color-purple-700);
1241
+ }
1242
+ }
1243
+ }
1244
+ .hover\:bg-red-700 {
1245
+ &:hover {
1246
+ @media (hover: hover) {
1247
+ background-color: var(--color-red-700);
1248
+ }
1249
+ }
1250
+ }
1053
1251
  .hover\:text-blue-600 {
1054
1252
  &:hover {
1055
1253
  @media (hover: hover) {
@@ -1080,6 +1278,11 @@
1080
1278
  --tw-ring-color: var(--color-blue-500);
1081
1279
  }
1082
1280
  }
1281
+ .focus\:ring-gray-400 {
1282
+ &:focus {
1283
+ --tw-ring-color: var(--color-gray-400);
1284
+ }
1285
+ }
1083
1286
  .focus\:outline-none {
1084
1287
  &:focus {
1085
1288
  --tw-outline-style: none;