@shuriken-ui/tailwind 4.0.0-alpha.1 → 4.0.0-alpha.11

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 (63) hide show
  1. package/README.md +20 -74
  2. package/lib/css/focus.css +4 -0
  3. package/{src → lib}/css/mark.css +0 -3
  4. package/{src → lib}/css/mask.css +0 -3
  5. package/{src → lib}/css/slimscroll.css +8 -8
  6. package/lib/index.css +18 -0
  7. package/lib/theme.css +126 -0
  8. package/package.json +14 -53
  9. package/LICENSE.md +0 -21
  10. package/src/css/accordion.css +0 -175
  11. package/src/css/autocomplete.css +0 -511
  12. package/src/css/avatar-group.css +0 -138
  13. package/src/css/avatar.css +0 -738
  14. package/src/css/breadcrumb.css +0 -63
  15. package/src/css/button-action.css +0 -108
  16. package/src/css/button-close.css +0 -117
  17. package/src/css/button-group.css +0 -236
  18. package/src/css/button-icon.css +0 -97
  19. package/src/css/button.css +0 -565
  20. package/src/css/card.css +0 -69
  21. package/src/css/checkbox.css +0 -99
  22. package/src/css/dropdown-divider.css +0 -6
  23. package/src/css/dropdown-item.css +0 -62
  24. package/src/css/dropdown.css +0 -102
  25. package/src/css/focus.css +0 -12
  26. package/src/css/fullscreen-dropfile.css +0 -63
  27. package/src/css/heading.css +0 -78
  28. package/src/css/icon-box.css +0 -305
  29. package/src/css/input-file-regular.css +0 -255
  30. package/src/css/input-file.css +0 -224
  31. package/src/css/input-help-text.css +0 -7
  32. package/src/css/input-number.css +0 -469
  33. package/src/css/input.css +0 -402
  34. package/src/css/kbd.css +0 -94
  35. package/src/css/label.css +0 -6
  36. package/src/css/link.css +0 -8
  37. package/src/css/list.css +0 -23
  38. package/src/css/listbox.css +0 -511
  39. package/src/css/message-text.css +0 -72
  40. package/src/css/message.css +0 -245
  41. package/src/css/modal.css +0 -51
  42. package/src/css/pagination.css +0 -93
  43. package/src/css/paragraph.css +0 -78
  44. package/src/css/placeholder-page.css +0 -44
  45. package/src/css/placeload.css +0 -13
  46. package/src/css/progress-circle.css +0 -18
  47. package/src/css/progress.css +0 -90
  48. package/src/css/prose.css +0 -22
  49. package/src/css/radio.css +0 -73
  50. package/src/css/select.css +0 -404
  51. package/src/css/snack.css +0 -101
  52. package/src/css/switch-ball.css +0 -94
  53. package/src/css/switch-thin.css +0 -76
  54. package/src/css/tab-slider.css +0 -190
  55. package/src/css/tabs.css +0 -175
  56. package/src/css/tag.css +0 -312
  57. package/src/css/text.css +0 -78
  58. package/src/css/textarea.css +0 -228
  59. package/src/css/theme-switch.css +0 -65
  60. package/src/css/theme-toggle.css +0 -62
  61. package/src/css/toast.css +0 -132
  62. package/src/css/tooltip.css +0 -99
  63. package/src/index.css +0 -57
@@ -1,63 +0,0 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
- /* @utility nui-breadcrumb */
3
-
4
- @utility nui-breadcrumb {
5
- @apply block;
6
- }
7
- @utility nui-breadcrumb-list {
8
- @apply mb-6 flex items-center font-sans text-[0.85rem];
9
-
10
- .nui-breadcrumb-item-mobile {
11
- @apply me-3 sm:hidden;
12
- }
13
-
14
- .nui-breadcrumb-item:not(:last-child) {
15
- @apply hidden sm:flex;
16
- }
17
-
18
- .nui-breadcrumb-item:last-child {
19
- @apply flex text-muted-500 dark:text-muted-400;
20
- }
21
-
22
- .nui-item-inner {
23
- @apply text-[0.85rem] flex items-center gap-x-1;
24
- @apply text-muted-500 dark:text-muted-400;
25
- @apply transition-colors duration-300;
26
-
27
- .nui-item-icon {
28
- @apply flex items-center justify-center h-4 w-4 shrink-0;
29
-
30
- &.nui-has-dot {
31
- @apply text-xl;
32
- }
33
- }
34
-
35
- .nui-item-text {
36
- @apply text-muted-500 dark:text-muted-400 px-2;
37
- }
38
- }
39
- }
40
- @utility nui-breadcrumb-primary {
41
- .nui-item-inner {
42
- &.nui-has-link {
43
- @apply hover:text-primary-500 focus:text-primary-500;
44
- @apply dark:hover:text-primary-500 dark:focus:text-primary-500;
45
- }
46
- }
47
- }
48
- @utility nui-breadcrumb-dark {
49
- .nui-item-inner {
50
- &.nui-has-link {
51
- @apply hover:text-muted-900 focus:text-muted-900;
52
- @apply dark:hover:text-muted-100 dark:focus:text-muted-100;
53
- }
54
- }
55
- }
56
- @utility nui-breadcrumb-black {
57
- .nui-item-inner {
58
- &.nui-has-link {
59
- @apply hover:text-black focus:text-black;
60
- @apply dark:hover:text-white dark:focus:text-white;
61
- }
62
- }
63
- }
@@ -1,108 +0,0 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
- /* @utility nui-button-action */
3
-
4
- @utility nui-button-action {
5
- @apply nui-focus relative inline-flex items-center justify-center border leading-5 no-underline h-8 px-3 py-2 space-x-1;
6
- @apply font-sans font-normal text-sm;
7
- @apply disabled:opacity-60 disabled:cursor-not-allowed hover:enabled:shadow-none;
8
- @apply transition-all duration-300;
9
- }
10
- @utility nui-button-rounded-sm {
11
- @apply rounded-md;
12
- }
13
- @utility nui-button-rounded-md {
14
- @apply rounded-lg;
15
- }
16
- @utility nui-button-rounded-lg {
17
- @apply rounded-xl;
18
- }
19
- @utility nui-button-rounded-full {
20
- @apply rounded-full;
21
- }
22
- @utility nui-button-loading {
23
- @apply !text-transparent;
24
- }
25
- @utility nui-button-default {
26
- @apply text-muted-700 dark:text-muted-100;
27
- @apply bg-white dark:bg-muted-700;
28
- @apply hover:enabled:bg-muted-50 dark:hover:enabled:bg-muted-600;
29
- @apply active:enabled:bg-muted-100 dark:active:enabled:bg-muted-700;
30
- @apply border-muted-300 dark:border-muted-600;
31
- }
32
- @utility nui-button-default-contrast {
33
- @apply text-muted-700 dark:text-muted-100;
34
- @apply bg-white dark:bg-muted-950;
35
- @apply hover:enabled:bg-muted-50 dark:hover:enabled:bg-muted-900;
36
- @apply active:enabled:bg-muted-100 dark:active:enabled:bg-muted-950;
37
- @apply border-muted-300 dark:border-muted-800;
38
- }
39
- @utility nui-button-muted {
40
- @apply text-muted-500 dark:text-muted-100;
41
- @apply bg-muted-200 dark:bg-muted-700/40;
42
- @apply hover:enabled:bg-muted-100 dark:hover:enabled:bg-muted-700/60;
43
- @apply active:enabled:bg-muted-200/50 dark:active:enabled:bg-muted-800;
44
- @apply border-muted-200 dark:border-muted-700/40;
45
- }
46
- @utility nui-button-muted-contrast {
47
- @apply text-muted-500 dark:text-muted-100;
48
- @apply bg-muted-200 dark:bg-muted-950;
49
- @apply hover:enabled:bg-muted-100 dark:hover:enabled:bg-muted-900;
50
- @apply active:enabled:bg-muted-200/50 dark:active:enabled:bg-muted-950;
51
- @apply border-muted-200 dark:border-muted-800;
52
- }
53
- @utility nui-button-light {
54
- @apply text-muted-500 dark:text-muted-100;
55
- @apply bg-muted-200 dark:bg-muted-700;
56
- @apply hover:enabled:bg-muted-100 dark:hover:enabled:bg-muted-600;
57
- @apply active:enabled:bg-muted-200 dark:active:enabled:bg-muted-700;
58
- @apply border-muted-200 dark:border-muted-700;
59
- }
60
- @utility nui-button-dark {
61
- @apply text-muted-100 dark:text-muted-900;
62
- @apply bg-muted-900 dark:bg-muted-100;
63
- @apply hover:enabled:bg-muted-800 dark:hover:enabled:bg-muted-50;
64
- @apply active:enabled:bg-muted-900 dark:active:enabled:bg-muted-100;
65
- @apply border-muted-900 dark:border-muted-100;
66
- }
67
- @utility nui-button-black {
68
- @apply text-white dark:text-black;
69
- @apply bg-black dark:bg-white;
70
- @apply hover:enabled:bg-muted-800 dark:hover:enabled:bg-white/90;
71
- @apply active:enabled:bg-black dark:active:enabled:bg-white;
72
- @apply border-black dark:border-white;
73
- }
74
- @utility nui-button-primary {
75
- @apply text-white dark:text-white;
76
- @apply bg-primary-500 dark:bg-primary-500;
77
- @apply hover:enabled:bg-primary-400 dark:hover:enabled:bg-primary-400;
78
- @apply active:enabled:bg-primary-500 dark:active:enabled:bg-primary-500;
79
- @apply border-primary-500 dark:border-primary-500;
80
- }
81
- @utility nui-button-info {
82
- @apply text-white dark:text-white;
83
- @apply bg-info-500 dark:bg-info-500;
84
- @apply hover:enabled:bg-info-400 dark:hover:enabled:bg-info-400;
85
- @apply active:enabled:bg-info-500 dark:active:enabled:bg-info-500;
86
- @apply border-info-500 dark:border-info-500;
87
- }
88
- @utility nui-button-success {
89
- @apply text-white dark:text-white;
90
- @apply bg-success-500 dark:bg-success-500;
91
- @apply hover:enabled:bg-success-400 dark:hover:enabled:bg-success-400;
92
- @apply active:enabled:bg-success-500 dark:active:enabled:bg-success-500;
93
- @apply border-success-500 dark:border-success-500;
94
- }
95
- @utility nui-button-warning {
96
- @apply text-white dark:text-white;
97
- @apply bg-warning-500 dark:bg-warning-500;
98
- @apply hover:enabled:bg-warning-400 dark:hover:enabled:bg-warning-400;
99
- @apply active:enabled:bg-warning-500 dark:active:enabled:bg-warning-500;
100
- @apply border-warning-500 dark:border-warning-500;
101
- }
102
- @utility nui-button-danger {
103
- @apply text-white dark:text-white;
104
- @apply bg-danger-500 dark:bg-danger-500;
105
- @apply hover:enabled:bg-danger-400 dark:hover:enabled:bg-danger-400;
106
- @apply active:enabled:bg-danger-500 dark:active:enabled:bg-danger-500;
107
- @apply border-danger-500 dark:border-danger-500;
108
- }
@@ -1,117 +0,0 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
- /* @utility nui-button-close */
3
-
4
- @utility nui-button-close {
5
- @apply nui-focus flex items-center justify-center disabled:opacity-30 cursor-pointer;
6
- @apply transition-colors duration-300;
7
- }
8
- @utility nui-button-xs {
9
- @apply h-6 w-6;
10
-
11
- .nui-button-icon {
12
- @apply h-3 w-3 fill-current;
13
- }
14
- }
15
- @utility nui-button-sm {
16
- @apply h-8 w-8;
17
-
18
- .nui-button-icon {
19
- @apply h-4 w-4 fill-current;
20
- }
21
- }
22
- @utility nui-button-md {
23
- @apply h-10 w-10;
24
-
25
- .nui-button-icon {
26
- @apply h-4 w-4 fill-current;
27
- }
28
- }
29
- @utility nui-button-lg {
30
- @apply h-12 w-12;
31
-
32
- .nui-button-icon {
33
- @apply h-5 w-5 fill-current;
34
- }
35
- }
36
- @utility nui-button-xl {
37
- @apply h-14 w-14;
38
-
39
- .nui-button-icon {
40
- @apply h-6 w-6 fill-current;
41
- }
42
- }
43
- @utility nui-button-rounded-sm {
44
- @apply rounded;
45
- }
46
- @utility nui-button-rounded-md {
47
- @apply rounded-md;
48
- }
49
- @utility nui-button-rounded-lg {
50
- @apply rounded-lg;
51
- }
52
- @utility nui-button-rounded-full {
53
- @apply rounded-full;
54
- }
55
- @utility nui-button-default {
56
- @apply text-muted-700 dark:text-muted-50;
57
- @apply bg-transparent dark:bg-transparent;
58
- @apply hover:bg-muted-100 dark:hover:bg-muted-700;
59
- @apply focus-visible:bg-muted-100 dark:focus-visible:bg-muted-700;
60
- @apply active:enabled:bg-transparent dark:active:enabled:bg-transparent;
61
- }
62
- @utility nui-button-default-contrast {
63
- @apply text-muted-700 dark:text-muted-50;
64
- @apply bg-transparent dark:bg-transparent;
65
- @apply hover:bg-muted-100 dark:hover:bg-muted-900;
66
- @apply focus-visible:bg-muted-100 dark:focus-visible:bg-muted-900;
67
- @apply active:enabled:bg-transparent dark:active:enabled:bg-transparent;
68
- }
69
- @utility nui-button-muted {
70
- @apply text-muted-700 dark:text-muted-50;
71
- @apply bg-muted-100 dark:bg-muted-700;
72
- @apply hover:bg-muted-50 dark:hover:bg-muted-600;
73
- @apply focus-visible:bg-muted-50 dark:focus-visible:bg-muted-600;
74
- @apply active:enabled:bg-muted-100 dark:active:enabled:bg-muted-700;
75
- }
76
- @utility nui-button-muted-contrast {
77
- @apply text-muted-700 dark:text-muted-50;
78
- @apply bg-muted-100 dark:bg-muted-950;
79
- @apply hover:bg-muted-50 dark:hover:bg-muted-900;
80
- @apply focus-visible:bg-muted-50 dark:focus-visible:bg-muted-900;
81
- @apply active:enabled:bg-muted-100 dark:active:enabled:bg-muted-950;
82
- }
83
- @utility nui-button-primary {
84
- @apply text-primary-500 dark:text-primary-500;
85
- @apply bg-primary-500/10 dark:bg-primary-500/10;
86
- @apply hover:bg-primary-500/20 dark:hover:bg-primary-500/20;
87
- @apply focus-visible:bg-primary-500/20 dark:focus-visible:bg-primary-500/20;
88
- @apply active:enabled:bg-primary-500/10 dark:active:enabled:bg-primary-500/10;
89
- }
90
- @utility nui-button-info {
91
- @apply text-info-500 dark:text-info-500;
92
- @apply bg-info-500/10 dark:bg-info-500/10;
93
- @apply hover:bg-info-500/20 dark:hover:bg-info-500/20;
94
- @apply focus-visible:bg-info-500/20 dark:focus-visible:bg-info-500/20;
95
- @apply active:enabled:bg-info-500/10 dark:active:enabled:bg-info-500/10;
96
- }
97
- @utility nui-button-success {
98
- @apply text-success-500 dark:text-success-500;
99
- @apply bg-success-500/10 dark:bg-success-500/10;
100
- @apply hover:bg-success-500/20 dark:hover:bg-success-500/20;
101
- @apply focus-visible:bg-success-500/20 dark:focus-visible:bg-success-500/20;
102
- @apply active:enabled:bg-success-500/10 dark:active:enabled:bg-success-500/10;
103
- }
104
- @utility nui-button-warning {
105
- @apply text-warning-500 dark:text-warning-500;
106
- @apply bg-warning-500/10 dark:bg-warning-500/10;
107
- @apply hover:bg-warning-500/20 dark:hover:bg-warning-500/20;
108
- @apply focus-visible:bg-warning-500/20 dark:focus-visible:bg-warning-500/20;
109
- @apply active:enabled:bg-warning-500/10 dark:active:enabled:bg-warning-500/10;
110
- }
111
- @utility nui-button-danger {
112
- @apply text-danger-500 dark:text-danger-500;
113
- @apply bg-danger-500/10 dark:bg-danger-500/10;
114
- @apply hover:bg-danger-500/20 dark:hover:bg-danger-500/20;
115
- @apply focus-visible:bg-danger-500/20 dark:focus-visible:bg-danger-500/20;
116
- @apply active:enabled:bg-danger-500/10 dark:active:enabled:bg-danger-500/10;
117
- }
@@ -1,236 +0,0 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
- /* @utility nui-button-group */
3
-
4
- @utility nui-button-group {
5
- @apply flex;
6
-
7
- > .nui-button:not(:only-child), > .nui-button-action:not(:only-child), > .nui-button-icon:not(:only-child) {
8
- @apply !border-e-0;
9
-
10
- &:focus {
11
- @apply !z-10 relative;
12
- }
13
-
14
- &:not(:first-child):not(:last-child) {
15
- @apply !rounded-none;
16
- }
17
-
18
- &:first-child {
19
- @apply !rounded-e-none;
20
- }
21
-
22
- &:last-child {
23
- @apply !border-e !rounded-s-none;
24
- }
25
- }
26
-
27
- .nui-input-wrapper:not(:first-child):not(:last-child) {
28
- .nui-input {
29
- @apply !border-e-0 !rounded-none;
30
-
31
- &:focus {
32
- @apply !z-10 relative;
33
- }
34
- }
35
- }
36
-
37
- .nui-input-wrapper:first-child:not(:last-child) {
38
- .nui-input {
39
- @apply !border-e-0 !rounded-e-none;
40
-
41
- &:focus {
42
- @apply !z-10 relative;
43
- }
44
- }
45
- }
46
-
47
- .nui-input-wrapper:last-child:not(:first-child) {
48
- .nui-input {
49
- @apply !border-e !rounded-s-none;
50
-
51
- &:focus {
52
- @apply !z-10 relative;
53
- }
54
- }
55
- }
56
-
57
- .nui-input-number-wrapper:not(:first-child):not(:last-child) {
58
- .nui-input-number {
59
- @apply !border-e-0 !rounded-none;
60
-
61
- &:focus {
62
- @apply !z-10 relative;
63
- }
64
- }
65
- }
66
-
67
- .nui-input-number-wrapper:first-child:not(:last-child) {
68
- .nui-input-number {
69
- @apply !border-e-0 !rounded-e-none;
70
-
71
- &:focus {
72
- @apply !z-10 relative;
73
- }
74
- }
75
- }
76
-
77
- .nui-input-number-wrapper:last-child:not(:first-child) {
78
- .nui-input-number {
79
- @apply !border-e !rounded-s-none;
80
-
81
- &:focus {
82
- @apply !z-10 relative;
83
- }
84
- }
85
- }
86
-
87
- .nui-input-file-regular:not(:first-child):not(:last-child) {
88
- .nui-input-file-inner {
89
- @apply !border-e-0 !rounded-none;
90
-
91
- &:focus {
92
- @apply !z-10 relative;
93
- }
94
- }
95
- }
96
-
97
- .nui-input-file-regular:first-child:not(:last-child) {
98
- .nui-input-file-inner {
99
- @apply !border-e-0 !rounded-e-none;
100
-
101
- &:focus {
102
- @apply !z-10 relative;
103
- }
104
- }
105
- }
106
-
107
- .nui-input-file-regular:last-child:not(:first-child) {
108
- .nui-input-file-inner {
109
- @apply !border-e !rounded-s-none;
110
-
111
- &:focus {
112
- @apply !z-10 relative;
113
- }
114
- }
115
- }
116
-
117
- .nui-select-wrapper:not(:first-child):not(:last-child) {
118
- .nui-select {
119
- @apply !border-e-0 !rounded-none;
120
-
121
- &:focus {
122
- @apply !z-10 relative;
123
- }
124
- }
125
- }
126
-
127
- .nui-select-wrapper:first-child:not(:last-child) {
128
- .nui-select {
129
- @apply !border-e-0 !rounded-e-none;
130
-
131
- &:focus {
132
- @apply !z-10 relative;
133
- }
134
- }
135
- }
136
-
137
- .nui-select-wrapper:last-child:not(:first-child) {
138
- .nui-select {
139
- @apply !border-e !rounded-s-none;
140
-
141
- &:focus {
142
- @apply !z-10 relative;
143
- }
144
- }
145
- }
146
-
147
- .nui-autocomplete:not(:first-child):not(:last-child) {
148
- .nui-autocomplete-input {
149
- @apply !border-e-0 !rounded-none;
150
-
151
- &:focus {
152
- @apply !z-10 relative;
153
- }
154
- }
155
- }
156
-
157
- .nui-autocomplete:first-child:not(:last-child) {
158
- .nui-autocomplete-input {
159
- @apply !border-e-0 !rounded-e-none;
160
-
161
- &:focus {
162
- @apply !z-10 relative;
163
- }
164
- }
165
- }
166
-
167
- .nui-autocomplete:last-child:not(:first-child) {
168
- .nui-autocomplete-input {
169
- @apply !border-e !rounded-s-none;
170
-
171
- &:focus {
172
- @apply !z-10 relative;
173
- }
174
- }
175
- }
176
-
177
- .nui-dropdown:not(:first-child):not(:last-child) {
178
- .nui-button {
179
- @apply !border-e-0 !rounded-none;
180
-
181
- &:focus {
182
- @apply !z-10 relative;
183
- }
184
- }
185
- }
186
-
187
- .nui-dropdown:first-child:not(:last-child) {
188
- .nui-button {
189
- @apply !border-e-0 !rounded-e-none;
190
-
191
- &:focus {
192
- @apply !z-10 relative;
193
- }
194
- }
195
- }
196
-
197
- .nui-dropdown:last-child:not(:first-child) {
198
- .nui-button {
199
- @apply !border-e !rounded-s-none;
200
-
201
- &:focus {
202
- @apply !z-10 relative;
203
- }
204
- }
205
- }
206
-
207
- .nui-listbox:not(:first-child):not(:last-child) {
208
- .nui-listbox-button {
209
- @apply !border-e-0 !rounded-none;
210
-
211
- &:focus {
212
- @apply !z-10 relative;
213
- }
214
- }
215
- }
216
-
217
- .nui-listbox:first-child:not(:last-child) {
218
- .nui-listbox-button {
219
- @apply !border-e-0 !rounded-e-none;
220
-
221
- &:focus {
222
- @apply !z-10 relative;
223
- }
224
- }
225
- }
226
-
227
- .nui-listbox:last-child:not(:first-child) {
228
- .nui-listbox-button {
229
- @apply !border-e !rounded-s-none;
230
-
231
- &:focus {
232
- @apply !z-10 relative;
233
- }
234
- }
235
- }
236
- }
@@ -1,97 +0,0 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
- /* @utility nui-button-icon */
3
-
4
- @utility nui-button-icon {
5
- @apply nui-focus relative inline-flex items-center justify-center space-x-1 leading-5 no-underline disabled:opacity-60 disabled:cursor-not-allowed hover:shadow-none;
6
- @apply font-sans text-sm font-normal;
7
- @apply transition-all duration-300;
8
- }
9
- @utility nui-button-sm {
10
- @apply h-8 w-8 p-1;
11
- }
12
- @utility nui-button-md {
13
- @apply h-10 w-10 p-2;
14
- }
15
- @utility nui-button-lg {
16
- @apply h-12 w-12 p-3;
17
- }
18
- @utility nui-button-xl {
19
- @apply h-14 w-14 p-4;
20
- }
21
- @utility nui-button-rounded-sm {
22
- @apply rounded;
23
- }
24
- @utility nui-button-rounded-md {
25
- @apply rounded-md;
26
- }
27
- @utility nui-button-rounded-lg {
28
- @apply rounded-lg;
29
- }
30
- @utility nui-button-rounded-full {
31
- @apply rounded-full;
32
- }
33
- @utility nui-button-loading {
34
- @apply !text-transparent;
35
- }
36
- @utility nui-button-default {
37
- @apply text-muted-700 dark:text-muted-100;
38
- @apply bg-white dark:bg-muted-700;
39
- @apply hover:bg-muted-50 dark:hover:bg-muted-600;
40
- @apply border border-muted-200 dark:border-muted-600;
41
- }
42
- @utility nui-button-default-contrast {
43
- @apply text-muted-700 dark:text-muted-100;
44
- @apply bg-white dark:bg-muted-950;
45
- @apply hover:bg-muted-50 dark:hover:bg-muted-900;
46
- @apply border border-muted-300 dark:border-muted-800;
47
- }
48
- @utility nui-button-muted {
49
- @apply text-muted-500 dark:text-muted-100;
50
- @apply bg-muted-200 dark:bg-muted-700;
51
- @apply hover:bg-muted-100 dark:hover:bg-muted-600;
52
- }
53
- @utility nui-button-muted-contrast {
54
- @apply text-muted-500 dark:text-muted-100;
55
- @apply bg-muted-200 dark:bg-muted-950;
56
- @apply hover:bg-muted-100 dark:hover:bg-muted-900;
57
- }
58
- @utility nui-button-light {
59
- @apply text-muted-500 dark:text-muted-100;
60
- @apply bg-muted-200 dark:bg-muted-700;
61
- @apply hover:bg-muted-100 dark:hover:bg-muted-600;
62
- }
63
- @utility nui-button-dark {
64
- @apply text-muted-100 dark:text-muted-900;
65
- @apply bg-muted-900 dark:bg-muted-100;
66
- @apply hover:bg-muted-800 dark:hover:bg-muted-50;
67
- }
68
- @utility nui-button-black {
69
- @apply text-white dark:text-black;
70
- @apply bg-black dark:bg-white;
71
- @apply hover:bg-black/90 dark:hover:bg-white/90;
72
- }
73
- @utility nui-button-primary {
74
- @apply text-primary-500 dark:text-primary-500;
75
- @apply bg-primary-500/20 dark:bg-primary-500/20;
76
- @apply hover:bg-primary-500/10 dark:hover:bg-primary-500/10;
77
- }
78
- @utility nui-button-info {
79
- @apply text-info-500 dark:text-info-500;
80
- @apply bg-info-500/20 dark:bg-info-500/20;
81
- @apply hover:bg-info-500/10 dark:hover:bg-info-500/10;
82
- }
83
- @utility nui-button-success {
84
- @apply text-success-500 dark:text-success-500;
85
- @apply bg-success-500/20 dark:bg-success-500/20;
86
- @apply hover:bg-success-500/10 dark:hover:bg-success-500/10;
87
- }
88
- @utility nui-button-warning {
89
- @apply text-warning-500 dark:text-warning-500;
90
- @apply bg-warning-500/20 dark:bg-warning-500/20;
91
- @apply hover:bg-warning-500/10 dark:hover:bg-warning-500/10;
92
- }
93
- @utility nui-button-danger {
94
- @apply text-danger-500 dark:text-danger-500;
95
- @apply bg-danger-500/20 dark:bg-danger-500/20;
96
- @apply hover:bg-danger-500/10 dark:hover:bg-danger-500/10;
97
- }