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