@shuriken-ui/tailwind 4.0.0-alpha.2 → 4.0.0-alpha.21
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/README.md +20 -74
- package/lib/css/dark.css +64 -0
- package/lib/css/focus.css +4 -0
- package/{src → lib}/css/mark.css +0 -3
- package/{src → lib}/css/mask.css +0 -3
- package/{src → lib}/css/slimscroll.css +8 -8
- package/lib/index.css +16 -0
- package/lib/theme.css +189 -0
- package/package.json +13 -53
- package/LICENSE.md +0 -21
- package/src/css/accordion.css +0 -175
- package/src/css/autocomplete.css +0 -511
- package/src/css/avatar-group.css +0 -138
- package/src/css/avatar.css +0 -738
- package/src/css/breadcrumb.css +0 -63
- package/src/css/button-action.css +0 -108
- package/src/css/button-close.css +0 -117
- package/src/css/button-group.css +0 -236
- package/src/css/button-icon.css +0 -97
- package/src/css/button.css +0 -565
- package/src/css/card.css +0 -69
- package/src/css/checkbox.css +0 -99
- package/src/css/dropdown-divider.css +0 -6
- package/src/css/dropdown-item.css +0 -62
- package/src/css/dropdown.css +0 -102
- package/src/css/focus.css +0 -12
- package/src/css/fullscreen-dropfile.css +0 -63
- package/src/css/heading.css +0 -78
- package/src/css/icon-box.css +0 -305
- package/src/css/input-file-regular.css +0 -255
- package/src/css/input-file.css +0 -224
- package/src/css/input-help-text.css +0 -7
- package/src/css/input-number.css +0 -469
- package/src/css/input.css +0 -402
- package/src/css/kbd.css +0 -94
- package/src/css/label.css +0 -6
- package/src/css/link.css +0 -8
- package/src/css/list.css +0 -23
- package/src/css/listbox.css +0 -511
- package/src/css/message-text.css +0 -72
- package/src/css/message.css +0 -245
- package/src/css/modal.css +0 -51
- package/src/css/pagination.css +0 -93
- package/src/css/paragraph.css +0 -78
- package/src/css/placeholder-page.css +0 -44
- package/src/css/placeload.css +0 -13
- package/src/css/progress-circle.css +0 -18
- package/src/css/progress.css +0 -90
- package/src/css/prose.css +0 -22
- package/src/css/radio.css +0 -73
- package/src/css/select.css +0 -404
- package/src/css/snack.css +0 -101
- package/src/css/switch-ball.css +0 -94
- package/src/css/switch-thin.css +0 -76
- package/src/css/tab-slider.css +0 -190
- package/src/css/tabs.css +0 -175
- package/src/css/tag.css +0 -312
- package/src/css/text.css +0 -78
- package/src/css/textarea.css +0 -228
- package/src/css/theme-switch.css +0 -65
- package/src/css/theme-toggle.css +0 -62
- package/src/css/toast.css +0 -132
- package/src/css/tooltip.css +0 -99
- package/src/index.css +0 -58
- package/src/theme.css +0 -80
package/src/css/switch-thin.css
DELETED
@@ -1,76 +0,0 @@
|
|
1
|
-
/* generated using "pnpm jiti scripts/generate-utilities.ts" */
|
2
|
-
/* @utility nui-switch-thin */
|
3
|
-
|
4
|
-
@utility nui-switch-thin {
|
5
|
-
@apply flex cursor-pointer items-center;
|
6
|
-
|
7
|
-
&.nui-switch-thin-primary .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
8
|
-
@apply bg-primary-400 dark:bg-primary-400;
|
9
|
-
}
|
10
|
-
|
11
|
-
&.nui-switch-thin-info .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
12
|
-
@apply bg-info-400 dark:bg-info-400;
|
13
|
-
}
|
14
|
-
|
15
|
-
&.nui-switch-thin-success .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
16
|
-
@apply bg-success-400 dark:bg-success-400;
|
17
|
-
}
|
18
|
-
|
19
|
-
&.nui-switch-thin-warning .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
20
|
-
@apply bg-warning-400 dark:bg-warning-400;
|
21
|
-
}
|
22
|
-
|
23
|
-
&.nui-switch-thin-danger .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
24
|
-
@apply bg-danger-400 dark:bg-danger-400;
|
25
|
-
}
|
26
|
-
|
27
|
-
&.nui-switch-thin-dark .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
28
|
-
@apply bg-muted-900 dark:bg-muted-100;
|
29
|
-
}
|
30
|
-
|
31
|
-
&.nui-switch-thin-black .nui-switch-thin-input:checked ~ .nui-switch-thin-track {
|
32
|
-
@apply bg-black dark:bg-white;
|
33
|
-
}
|
34
|
-
}
|
35
|
-
@utility nui-switch-thin-outer {
|
36
|
-
@apply nui-focus relative block h-4 rounded-full;
|
37
|
-
}
|
38
|
-
@utility nui-switch-thin-handle {
|
39
|
-
@apply absolute -start-1 top-1/2 -translate-y-1/2 flex items-center justify-center rounded-full;
|
40
|
-
@apply h-6 w-6;
|
41
|
-
@apply bg-white dark:bg-muted-700;
|
42
|
-
@apply border border-muted-300 dark:border-muted-600;
|
43
|
-
@apply transition-all duration-300;
|
44
|
-
}
|
45
|
-
@utility nui-switch-thin-track {
|
46
|
-
@apply block h-4 w-10 rounded-full;
|
47
|
-
@apply bg-muted-300 dark:bg-muted-600;
|
48
|
-
@apply transition-all duration-300;
|
49
|
-
}
|
50
|
-
@utility nui-switch-thin-single-label {
|
51
|
-
@apply relative ms-3 cursor-pointer select-none;
|
52
|
-
@apply font-sans text-sm;
|
53
|
-
@apply text-muted-400 dark:text-muted-400;
|
54
|
-
}
|
55
|
-
@utility nui-switch-thin-dual-label {
|
56
|
-
@apply ms-3;
|
57
|
-
|
58
|
-
.nui-switch-thin-label {
|
59
|
-
@apply block;
|
60
|
-
@apply font-sans text-sm;
|
61
|
-
@apply text-muted-800 dark:text-white;
|
62
|
-
}
|
63
|
-
|
64
|
-
.nui-switch-thin-sublabel {
|
65
|
-
@apply block;
|
66
|
-
@apply font-sans text-xs;
|
67
|
-
@apply text-muted-400 dark:text-muted-400;
|
68
|
-
}
|
69
|
-
}
|
70
|
-
@utility nui-switch-thin-input {
|
71
|
-
@apply absolute z-20 h-full w-full cursor-pointer opacity-0;
|
72
|
-
|
73
|
-
&:checked ~ .nui-switch-thin-handle {
|
74
|
-
@apply -translate-y-1/2 translate-x-full rtl:-translate-x-full;
|
75
|
-
}
|
76
|
-
}
|
package/src/css/tab-slider.css
DELETED
@@ -1,190 +0,0 @@
|
|
1
|
-
/* generated using "pnpm jiti scripts/generate-utilities.ts" */
|
2
|
-
/* @utility nui-tab-slider */
|
3
|
-
|
4
|
-
@utility nui-tab-slider {
|
5
|
-
@apply relative;
|
6
|
-
}
|
7
|
-
@utility nui-tab-slider-inner {
|
8
|
-
@apply mb-6 flex;
|
9
|
-
}
|
10
|
-
@utility nui-tab-slider-track {
|
11
|
-
@apply relative relative flex w-full items-center font-sans;
|
12
|
-
@apply bg-muted-100 dark:bg-muted-700;
|
13
|
-
}
|
14
|
-
@utility nui-tab-slider-item {
|
15
|
-
@apply relative z-20 h-full flex flex-1 items-center justify-center;
|
16
|
-
@apply text-sm font-sans;
|
17
|
-
}
|
18
|
-
@utility nui-tab-slider-naver {
|
19
|
-
@apply absolute start-0 top-0 z-10 h-full;
|
20
|
-
@apply transition-all duration-300;
|
21
|
-
}
|
22
|
-
@utility nui-tab-content {
|
23
|
-
@apply relative block;
|
24
|
-
}
|
25
|
-
@utility nui-tabs-centered {
|
26
|
-
.nui-tab-slider-inner {
|
27
|
-
@apply justify-center;
|
28
|
-
}
|
29
|
-
}
|
30
|
-
@utility nui-tabs-end {
|
31
|
-
.nui-tab-slider-inner {
|
32
|
-
@apply justify-end;
|
33
|
-
}
|
34
|
-
}
|
35
|
-
@utility nui-tabs-default {
|
36
|
-
.nui-tab-slider-item:not(.nui-active) {
|
37
|
-
@apply text-muted-400 dark:text-muted-400;
|
38
|
-
}
|
39
|
-
|
40
|
-
.nui-tab-slider-item.nui-active {
|
41
|
-
@apply text-muted-800 dark:text-white;
|
42
|
-
}
|
43
|
-
|
44
|
-
.nui-tab-slider-naver {
|
45
|
-
@apply bg-white dark:bg-muted-800;
|
46
|
-
@apply border border-muted-300 dark:border-muted-600;
|
47
|
-
}
|
48
|
-
}
|
49
|
-
@utility nui-tabs-default-contrast {
|
50
|
-
.nui-tab-slider-item:not(.nui-active) {
|
51
|
-
@apply text-muted-400 dark:text-muted-400;
|
52
|
-
}
|
53
|
-
|
54
|
-
.nui-tab-slider-item.nui-active {
|
55
|
-
@apply text-muted-900 dark:text-white;
|
56
|
-
}
|
57
|
-
|
58
|
-
.nui-tab-slider-naver {
|
59
|
-
@apply bg-white dark:bg-muted-950;
|
60
|
-
@apply border border-muted-300 dark:border-muted-800;
|
61
|
-
}
|
62
|
-
}
|
63
|
-
@utility nui-tabs-primary {
|
64
|
-
.nui-tab-slider-item:not(.nui-active) {
|
65
|
-
@apply text-muted-400 dark:text-muted-400;
|
66
|
-
}
|
67
|
-
|
68
|
-
.nui-tab-slider-item.nui-active {
|
69
|
-
@apply text-white dark:text-white;
|
70
|
-
}
|
71
|
-
|
72
|
-
.nui-tab-slider-naver {
|
73
|
-
@apply bg-primary-500 dark:bg-primary-500;
|
74
|
-
}
|
75
|
-
}
|
76
|
-
@utility nui-tabs-light {
|
77
|
-
.nui-tab-slider-item:not(.nui-active) {
|
78
|
-
@apply text-muted-400 dark:text-muted-400;
|
79
|
-
}
|
80
|
-
|
81
|
-
.nui-tab-slider-item.nui-active {
|
82
|
-
@apply text-white dark:text-white;
|
83
|
-
}
|
84
|
-
|
85
|
-
.nui-tab-slider-naver {
|
86
|
-
@apply bg-muted-500 dark:bg-muted-400;
|
87
|
-
}
|
88
|
-
}
|
89
|
-
@utility nui-tabs-dark {
|
90
|
-
.nui-tab-slider-item:not(.nui-active) {
|
91
|
-
@apply text-muted-400 dark:text-muted-400;
|
92
|
-
}
|
93
|
-
|
94
|
-
.nui-tab-slider-item.nui-active {
|
95
|
-
@apply text-white dark:text-muted-900;
|
96
|
-
}
|
97
|
-
|
98
|
-
.nui-tab-slider-naver {
|
99
|
-
@apply bg-muted-900 dark:bg-muted-100;
|
100
|
-
}
|
101
|
-
}
|
102
|
-
@utility nui-tabs-black {
|
103
|
-
.nui-tab-slider-item:not(.nui-active) {
|
104
|
-
@apply text-muted-400 dark:text-muted-400;
|
105
|
-
}
|
106
|
-
|
107
|
-
.nui-tab-slider-item.nui-active {
|
108
|
-
@apply text-white dark:text-black;
|
109
|
-
}
|
110
|
-
|
111
|
-
.nui-tab-slider-naver {
|
112
|
-
@apply bg-black dark:bg-white;
|
113
|
-
}
|
114
|
-
}
|
115
|
-
@utility nui-tabs-rounded-sm {
|
116
|
-
.nui-tab-slider-track, .nui-tab-slider-naver {
|
117
|
-
@apply rounded-md;
|
118
|
-
}
|
119
|
-
}
|
120
|
-
@utility nui-tabs-rounded-md {
|
121
|
-
.nui-tab-slider-track, .nui-tab-slider-naver {
|
122
|
-
@apply rounded-lg;
|
123
|
-
}
|
124
|
-
}
|
125
|
-
@utility nui-tabs-rounded-lg {
|
126
|
-
.nui-tab-slider-track, .nui-tab-slider-naver {
|
127
|
-
@apply rounded-xl;
|
128
|
-
}
|
129
|
-
}
|
130
|
-
@utility nui-tabs-rounded-full {
|
131
|
-
.nui-tab-slider-track, .nui-tab-slider-naver {
|
132
|
-
@apply rounded-full;
|
133
|
-
}
|
134
|
-
}
|
135
|
-
@utility nui-tabs-sm {
|
136
|
-
&.nui-tabs-two-slots .nui-tab-slider-track {
|
137
|
-
@apply max-w-[140px];
|
138
|
-
}
|
139
|
-
|
140
|
-
&.nui-tabs-three-slots .nui-tab-slider-track {
|
141
|
-
@apply max-w-[210px];
|
142
|
-
}
|
143
|
-
|
144
|
-
.nui-tab-slider-track {
|
145
|
-
@apply h-8;
|
146
|
-
}
|
147
|
-
}
|
148
|
-
@utility nui-tabs-md {
|
149
|
-
&.nui-tabs-two-slots .nui-tab-slider-track {
|
150
|
-
@apply max-w-[250px];
|
151
|
-
}
|
152
|
-
|
153
|
-
&.nui-tabs-three-slots .nui-tab-slider-track {
|
154
|
-
@apply max-w-[320px];
|
155
|
-
}
|
156
|
-
|
157
|
-
.nui-tab-slider-track {
|
158
|
-
@apply h-10;
|
159
|
-
}
|
160
|
-
}
|
161
|
-
@utility nui-tabs-two-slots {
|
162
|
-
.nui-tab-slider-naver, .nui-tab-slider-item {
|
163
|
-
@apply w-1/2;
|
164
|
-
}
|
165
|
-
|
166
|
-
.nui-tab-slider-item:first-child.nui-active ~ .nui-tab-slider-naver {
|
167
|
-
@apply ms-0;
|
168
|
-
}
|
169
|
-
|
170
|
-
.nui-tab-slider-item:nth-child(2).nui-active ~ .nui-tab-slider-naver {
|
171
|
-
@apply ms-[50%];
|
172
|
-
}
|
173
|
-
}
|
174
|
-
@utility nui-tabs-three-slots {
|
175
|
-
.nui-tab-slider-naver, .nui-tab-slider-item {
|
176
|
-
@apply w-1/3;
|
177
|
-
}
|
178
|
-
|
179
|
-
.nui-tab-slider-item:first-child.nui-active ~ .nui-tab-slider-naver {
|
180
|
-
@apply ms-0;
|
181
|
-
}
|
182
|
-
|
183
|
-
.nui-tab-slider-item:nth-child(2).nui-active ~ .nui-tab-slider-naver {
|
184
|
-
@apply ms-[33.3%];
|
185
|
-
}
|
186
|
-
|
187
|
-
.nui-tab-slider-item:nth-child(3).nui-active ~ .nui-tab-slider-naver {
|
188
|
-
@apply ms-[66.6%];
|
189
|
-
}
|
190
|
-
}
|
package/src/css/tabs.css
DELETED
@@ -1,175 +0,0 @@
|
|
1
|
-
/* generated using "pnpm jiti scripts/generate-utilities.ts" */
|
2
|
-
/* @utility nui-tabs */
|
3
|
-
|
4
|
-
@utility nui-tabs {
|
5
|
-
@apply relative;
|
6
|
-
}
|
7
|
-
@utility nui-tabs-inner {
|
8
|
-
@apply font-sans mb-6 flex;
|
9
|
-
}
|
10
|
-
@utility nui-tabs-bordered {
|
11
|
-
.nui-tabs-inner {
|
12
|
-
@apply border-b border-muted-200 dark:border-muted-800;
|
13
|
-
}
|
14
|
-
}
|
15
|
-
@utility nui-tab-item {
|
16
|
-
@apply cursor-pointer border-b-2 px-4 py-3;
|
17
|
-
@apply text-sm;
|
18
|
-
@apply transition-all duration-300;
|
19
|
-
|
20
|
-
&.nui-has-icon {
|
21
|
-
@apply flex items-center gap-1;
|
22
|
-
}
|
23
|
-
}
|
24
|
-
@utility nui-pill-item {
|
25
|
-
@apply flex flex-col rounded-xl px-5 cursor-pointer;
|
26
|
-
@apply text-center;
|
27
|
-
@apply transition-all duration-300;
|
28
|
-
|
29
|
-
&:not(.nui-has-icon) {
|
30
|
-
@apply flex items-center gap-1 py-2;
|
31
|
-
}
|
32
|
-
|
33
|
-
&.nui-has-icon {
|
34
|
-
@apply flex items-center gap-1 py-3;
|
35
|
-
}
|
36
|
-
}
|
37
|
-
@utility nui-tabs-default {
|
38
|
-
.nui-tab-item {
|
39
|
-
&:not(.nui-active) {
|
40
|
-
@apply border-transparent;
|
41
|
-
@apply text-muted-400 dark:text-muted-400;
|
42
|
-
}
|
43
|
-
|
44
|
-
&.nui-active {
|
45
|
-
@apply border-muted-500 dark:border-muted-100;
|
46
|
-
@apply text-muted-800 dark:text-muted-100;
|
47
|
-
}
|
48
|
-
}
|
49
|
-
|
50
|
-
.nui-pill-item {
|
51
|
-
&:not(.nui-active) {
|
52
|
-
@apply text-muted-400 dark:text-muted-400;
|
53
|
-
}
|
54
|
-
|
55
|
-
&.nui-active {
|
56
|
-
@apply text-muted-800 dark:text-muted-100;
|
57
|
-
@apply bg-white dark:bg-muted-800;
|
58
|
-
@apply border border-muted-200 dark:border-muted-700;
|
59
|
-
@apply shadow-lg shadow-muted-500/30 dark:shadow-muted-800/50;
|
60
|
-
}
|
61
|
-
}
|
62
|
-
}
|
63
|
-
@utility nui-tabs-primary {
|
64
|
-
.nui-tab-item {
|
65
|
-
&:not(.nui-active) {
|
66
|
-
@apply border-transparent;
|
67
|
-
@apply text-muted-400 dark:text-muted-400;
|
68
|
-
}
|
69
|
-
|
70
|
-
&.nui-active {
|
71
|
-
@apply border-primary-500 dark:border-primary-500;
|
72
|
-
@apply text-muted-800 dark:text-muted-100;
|
73
|
-
}
|
74
|
-
}
|
75
|
-
|
76
|
-
.nui-pill-item {
|
77
|
-
&:not(.nui-active) {
|
78
|
-
@apply text-muted-400 dark:text-muted-400;
|
79
|
-
}
|
80
|
-
|
81
|
-
&.nui-active {
|
82
|
-
@apply text-primary-invert dark:text-primary-invert;
|
83
|
-
@apply !bg-primary-600 dark:!bg-primary-600;
|
84
|
-
@apply shadow-lg bg-primary-500/50 dark:bg-primary-500/50;
|
85
|
-
}
|
86
|
-
}
|
87
|
-
}
|
88
|
-
@utility nui-tabs-light {
|
89
|
-
.nui-tab-item {
|
90
|
-
&:not(.nui-active) {
|
91
|
-
@apply border-transparent;
|
92
|
-
@apply text-muted-400 dark:text-muted-400;
|
93
|
-
}
|
94
|
-
|
95
|
-
&.nui-active {
|
96
|
-
@apply border-muted-600 dark:border-muted-100;
|
97
|
-
@apply text-muted-600 dark:text-muted-100;
|
98
|
-
}
|
99
|
-
}
|
100
|
-
|
101
|
-
.nui-pill-item {
|
102
|
-
&:not(.nui-active) {
|
103
|
-
@apply text-muted-400 dark:text-muted-400;
|
104
|
-
}
|
105
|
-
|
106
|
-
&.nui-active {
|
107
|
-
@apply text-muted-700 dark:text-muted-100;
|
108
|
-
@apply !bg-muted-100 dark:!bg-muted-800;
|
109
|
-
@apply shadow-lg shadow-muted-500/30 dark:shadow-muted-800/50;
|
110
|
-
}
|
111
|
-
}
|
112
|
-
}
|
113
|
-
@utility nui-tabs-dark {
|
114
|
-
.nui-tab-item {
|
115
|
-
&:not(.nui-active) {
|
116
|
-
@apply border-transparent;
|
117
|
-
@apply text-muted-400 dark:text-muted-400;
|
118
|
-
}
|
119
|
-
|
120
|
-
&.nui-active {
|
121
|
-
@apply border-muted-900 dark:border-muted-100;
|
122
|
-
@apply text-muted-900 dark:text-muted-100;
|
123
|
-
}
|
124
|
-
}
|
125
|
-
|
126
|
-
.nui-pill-item {
|
127
|
-
&:not(.nui-active) {
|
128
|
-
@apply text-muted-400 dark:text-muted-400;
|
129
|
-
}
|
130
|
-
|
131
|
-
&.nui-active {
|
132
|
-
@apply text-muted-100 dark:text-muted-900;
|
133
|
-
@apply !bg-muted-900 dark:!bg-muted-100;
|
134
|
-
@apply shadow-lg shadow-muted-500/30 dark:shadow-muted-800/50;
|
135
|
-
}
|
136
|
-
}
|
137
|
-
}
|
138
|
-
@utility nui-tabs-black {
|
139
|
-
.nui-tab-item {
|
140
|
-
&:not(.nui-active) {
|
141
|
-
@apply border-transparent;
|
142
|
-
@apply text-muted-400 dark:text-muted-400;
|
143
|
-
}
|
144
|
-
|
145
|
-
&.nui-active {
|
146
|
-
@apply border-black dark:border-white;
|
147
|
-
@apply text-black dark:text-white;
|
148
|
-
}
|
149
|
-
}
|
150
|
-
|
151
|
-
.nui-pill-item {
|
152
|
-
&:not(.nui-active) {
|
153
|
-
@apply text-muted-400 dark:text-muted-400;
|
154
|
-
}
|
155
|
-
|
156
|
-
&.nui-active {
|
157
|
-
@apply text-white dark:text-black;
|
158
|
-
@apply !bg-black dark:!bg-white;
|
159
|
-
@apply shadow-lg shadow-muted-500/30 dark:shadow-muted-800/50;
|
160
|
-
}
|
161
|
-
}
|
162
|
-
}
|
163
|
-
@utility nui-tab-content {
|
164
|
-
@apply relative block;
|
165
|
-
}
|
166
|
-
@utility nui-tabs-centered {
|
167
|
-
.nui-tabs-inner {
|
168
|
-
@apply justify-center;
|
169
|
-
}
|
170
|
-
}
|
171
|
-
@utility nui-tabs-end {
|
172
|
-
.nui-tabs-inner {
|
173
|
-
@apply justify-end;
|
174
|
-
}
|
175
|
-
}
|