@rokkit/themes 1.0.4 → 1.0.5

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 (246) hide show
  1. package/README.md +11 -19
  2. package/build.mjs +5 -21
  3. package/package.json +23 -132
  4. package/src/base/carousel.css +1 -2
  5. package/src/base/input.css +9 -5
  6. package/src/base/nav-content.css +3 -3
  7. package/src/base/stepper.css +9 -14
  8. package/src/frosted/button.css +6 -11
  9. package/src/frosted/card.css +5 -9
  10. package/src/frosted/dropdown.css +5 -10
  11. package/src/frosted/floating-action.css +2 -2
  12. package/src/frosted/input.css +2 -3
  13. package/src/frosted/list.css +25 -0
  14. package/src/frosted/menu.css +4 -8
  15. package/src/frosted/range.css +2 -2
  16. package/src/frosted/select.css +1 -1
  17. package/src/frosted/step-indicator.css +1 -2
  18. package/src/frosted/switch.css +2 -3
  19. package/src/frosted/timeline.css +1 -2
  20. package/src/index.css +2 -0
  21. package/src/index.js +0 -1
  22. package/src/material/floating-action.css +2 -2
  23. package/src/material/list.css +14 -0
  24. package/src/material/range.css +2 -2
  25. package/src/material/select.css +1 -1
  26. package/src/material/step-indicator.css +1 -2
  27. package/src/material/switch.css +1 -1
  28. package/src/material/tabs.css +2 -2
  29. package/src/material/timeline.css +1 -2
  30. package/src/material/toggle.css +2 -2
  31. package/src/minimal/floating-action.css +1 -1
  32. package/src/minimal/list.css +14 -0
  33. package/src/minimal/select.css +1 -13
  34. package/src/rokkit/floating-action.css +5 -5
  35. package/src/rokkit/floating-navigation.css +1 -1
  36. package/src/rokkit/index.css +0 -1
  37. package/src/rokkit/input.css +1 -1
  38. package/src/rokkit/list.css +25 -0
  39. package/src/rokkit/range.css +2 -2
  40. package/src/rokkit/select.css +1 -1
  41. package/src/rokkit/step-indicator.css +1 -2
  42. package/src/rokkit/swatch.css +1 -1
  43. package/src/rokkit/switch.css +1 -1
  44. package/src/rokkit/timeline.css +1 -2
  45. package/src/rokkit/upload-progress.css +4 -4
  46. package/src/zen-sumi/button.css +176 -0
  47. package/src/zen-sumi/card.css +104 -0
  48. package/src/zen-sumi/chart.css +41 -0
  49. package/src/zen-sumi/dropdown.css +53 -0
  50. package/src/zen-sumi/floating-action.css +68 -0
  51. package/src/zen-sumi/floating-navigation.css +74 -0
  52. package/src/{grada-ui → zen-sumi}/index.css +25 -30
  53. package/src/zen-sumi/input.css +145 -0
  54. package/src/zen-sumi/list.css +128 -0
  55. package/src/zen-sumi/menu.css +91 -0
  56. package/src/zen-sumi/message.css +37 -0
  57. package/src/zen-sumi/range.css +62 -0
  58. package/src/zen-sumi/search-filter.css +49 -0
  59. package/src/zen-sumi/select.css +160 -0
  60. package/src/zen-sumi/status-list.css +66 -0
  61. package/src/zen-sumi/step-indicator.css +40 -0
  62. package/src/zen-sumi/swatch.css +21 -0
  63. package/src/zen-sumi/switch.css +34 -0
  64. package/src/zen-sumi/table.css +118 -0
  65. package/src/zen-sumi/tabs.css +78 -0
  66. package/src/zen-sumi/timeline.css +46 -0
  67. package/src/zen-sumi/toc.css +22 -0
  68. package/src/zen-sumi/toggle.css +51 -0
  69. package/src/zen-sumi/toolbar.css +86 -0
  70. package/src/zen-sumi/tree.css +137 -0
  71. package/dist/ant-design.css +0 -2129
  72. package/dist/base.css +0 -6506
  73. package/dist/bits-ui.css +0 -2113
  74. package/dist/carbon.css +0 -2123
  75. package/dist/daisy-ui.css +0 -2138
  76. package/dist/frosted.css +0 -1953
  77. package/dist/grada-ui.css +0 -1915
  78. package/dist/index.css +0 -27359
  79. package/dist/material.css +0 -1924
  80. package/dist/minimal.css +0 -1978
  81. package/dist/rokkit.css +0 -2471
  82. package/dist/shadcn.css +0 -2099
  83. package/src/ant-design/button.css +0 -190
  84. package/src/ant-design/card.css +0 -100
  85. package/src/ant-design/chart.css +0 -34
  86. package/src/ant-design/connector.css +0 -11
  87. package/src/ant-design/dropdown.css +0 -50
  88. package/src/ant-design/floating-action.css +0 -63
  89. package/src/ant-design/floating-navigation.css +0 -70
  90. package/src/ant-design/grid.css +0 -46
  91. package/src/ant-design/index.css +0 -35
  92. package/src/ant-design/input.css +0 -151
  93. package/src/ant-design/list.css +0 -126
  94. package/src/ant-design/menu.css +0 -88
  95. package/src/ant-design/message.css +0 -35
  96. package/src/ant-design/range.css +0 -61
  97. package/src/ant-design/search-filter.css +0 -49
  98. package/src/ant-design/select.css +0 -158
  99. package/src/ant-design/status-list.css +0 -66
  100. package/src/ant-design/step-indicator.css +0 -38
  101. package/src/ant-design/switch.css +0 -29
  102. package/src/ant-design/table.css +0 -91
  103. package/src/ant-design/tabs.css +0 -153
  104. package/src/ant-design/timeline.css +0 -45
  105. package/src/ant-design/toc.css +0 -18
  106. package/src/ant-design/toggle.css +0 -48
  107. package/src/ant-design/toolbar.css +0 -85
  108. package/src/ant-design/tree.css +0 -137
  109. package/src/ant-design/upload-progress.css +0 -102
  110. package/src/ant-design/upload-target.css +0 -50
  111. package/src/bits-ui/button.css +0 -176
  112. package/src/bits-ui/card.css +0 -99
  113. package/src/bits-ui/chart.css +0 -34
  114. package/src/bits-ui/connector.css +0 -11
  115. package/src/bits-ui/dropdown.css +0 -50
  116. package/src/bits-ui/floating-action.css +0 -63
  117. package/src/bits-ui/floating-navigation.css +0 -70
  118. package/src/bits-ui/grid.css +0 -46
  119. package/src/bits-ui/index.css +0 -35
  120. package/src/bits-ui/input.css +0 -154
  121. package/src/bits-ui/list.css +0 -126
  122. package/src/bits-ui/menu.css +0 -88
  123. package/src/bits-ui/message.css +0 -35
  124. package/src/bits-ui/range.css +0 -61
  125. package/src/bits-ui/search-filter.css +0 -49
  126. package/src/bits-ui/select.css +0 -158
  127. package/src/bits-ui/status-list.css +0 -66
  128. package/src/bits-ui/step-indicator.css +0 -40
  129. package/src/bits-ui/switch.css +0 -29
  130. package/src/bits-ui/table.css +0 -89
  131. package/src/bits-ui/tabs.css +0 -151
  132. package/src/bits-ui/timeline.css +0 -45
  133. package/src/bits-ui/toc.css +0 -18
  134. package/src/bits-ui/toggle.css +0 -48
  135. package/src/bits-ui/toolbar.css +0 -85
  136. package/src/bits-ui/tree.css +0 -135
  137. package/src/bits-ui/upload-progress.css +0 -102
  138. package/src/bits-ui/upload-target.css +0 -50
  139. package/src/carbon/button.css +0 -186
  140. package/src/carbon/card.css +0 -97
  141. package/src/carbon/chart.css +0 -34
  142. package/src/carbon/connector.css +0 -11
  143. package/src/carbon/dropdown.css +0 -50
  144. package/src/carbon/floating-action.css +0 -63
  145. package/src/carbon/floating-navigation.css +0 -70
  146. package/src/carbon/grid.css +0 -46
  147. package/src/carbon/index.css +0 -34
  148. package/src/carbon/input.css +0 -148
  149. package/src/carbon/list.css +0 -124
  150. package/src/carbon/menu.css +0 -88
  151. package/src/carbon/message.css +0 -37
  152. package/src/carbon/range.css +0 -61
  153. package/src/carbon/search-filter.css +0 -49
  154. package/src/carbon/select.css +0 -158
  155. package/src/carbon/status-list.css +0 -66
  156. package/src/carbon/step-indicator.css +0 -40
  157. package/src/carbon/switch.css +0 -31
  158. package/src/carbon/table.css +0 -93
  159. package/src/carbon/tabs.css +0 -151
  160. package/src/carbon/timeline.css +0 -45
  161. package/src/carbon/toc.css +0 -22
  162. package/src/carbon/toggle.css +0 -48
  163. package/src/carbon/toolbar.css +0 -84
  164. package/src/carbon/tree.css +0 -135
  165. package/src/carbon/upload-progress.css +0 -102
  166. package/src/carbon/upload-target.css +0 -50
  167. package/src/daisy-ui/button.css +0 -196
  168. package/src/daisy-ui/card.css +0 -99
  169. package/src/daisy-ui/chart.css +0 -34
  170. package/src/daisy-ui/connector.css +0 -11
  171. package/src/daisy-ui/dropdown.css +0 -50
  172. package/src/daisy-ui/floating-action.css +0 -63
  173. package/src/daisy-ui/floating-navigation.css +0 -70
  174. package/src/daisy-ui/grid.css +0 -46
  175. package/src/daisy-ui/index.css +0 -34
  176. package/src/daisy-ui/input.css +0 -148
  177. package/src/daisy-ui/list.css +0 -127
  178. package/src/daisy-ui/menu.css +0 -88
  179. package/src/daisy-ui/message.css +0 -37
  180. package/src/daisy-ui/range.css +0 -61
  181. package/src/daisy-ui/search-filter.css +0 -49
  182. package/src/daisy-ui/select.css +0 -158
  183. package/src/daisy-ui/status-list.css +0 -66
  184. package/src/daisy-ui/step-indicator.css +0 -37
  185. package/src/daisy-ui/switch.css +0 -31
  186. package/src/daisy-ui/table.css +0 -91
  187. package/src/daisy-ui/tabs.css +0 -153
  188. package/src/daisy-ui/timeline.css +0 -45
  189. package/src/daisy-ui/toc.css +0 -22
  190. package/src/daisy-ui/toggle.css +0 -48
  191. package/src/daisy-ui/toolbar.css +0 -85
  192. package/src/daisy-ui/tree.css +0 -137
  193. package/src/daisy-ui/upload-progress.css +0 -102
  194. package/src/daisy-ui/upload-target.css +0 -50
  195. package/src/grada-ui/button.css +0 -249
  196. package/src/grada-ui/card.css +0 -96
  197. package/src/grada-ui/chart.css +0 -34
  198. package/src/grada-ui/dropdown.css +0 -58
  199. package/src/grada-ui/floating-action.css +0 -66
  200. package/src/grada-ui/floating-navigation.css +0 -69
  201. package/src/grada-ui/input.css +0 -154
  202. package/src/grada-ui/list.css +0 -124
  203. package/src/grada-ui/menu.css +0 -81
  204. package/src/grada-ui/message.css +0 -48
  205. package/src/grada-ui/range.css +0 -59
  206. package/src/grada-ui/search-filter.css +0 -47
  207. package/src/grada-ui/select.css +0 -190
  208. package/src/grada-ui/status-list.css +0 -66
  209. package/src/grada-ui/step-indicator.css +0 -37
  210. package/src/grada-ui/switch.css +0 -35
  211. package/src/grada-ui/table.css +0 -79
  212. package/src/grada-ui/tabs.css +0 -59
  213. package/src/grada-ui/timeline.css +0 -46
  214. package/src/grada-ui/toc.css +0 -24
  215. package/src/grada-ui/toggle.css +0 -47
  216. package/src/grada-ui/toolbar.css +0 -91
  217. package/src/grada-ui/tree.css +0 -100
  218. package/src/rokkit/stack.css +0 -6
  219. package/src/shadcn/button.css +0 -175
  220. package/src/shadcn/card.css +0 -99
  221. package/src/shadcn/chart.css +0 -34
  222. package/src/shadcn/connector.css +0 -11
  223. package/src/shadcn/dropdown.css +0 -50
  224. package/src/shadcn/floating-action.css +0 -63
  225. package/src/shadcn/floating-navigation.css +0 -70
  226. package/src/shadcn/grid.css +0 -46
  227. package/src/shadcn/index.css +0 -35
  228. package/src/shadcn/input.css +0 -143
  229. package/src/shadcn/list.css +0 -124
  230. package/src/shadcn/menu.css +0 -88
  231. package/src/shadcn/message.css +0 -35
  232. package/src/shadcn/range.css +0 -61
  233. package/src/shadcn/search-filter.css +0 -49
  234. package/src/shadcn/select.css +0 -158
  235. package/src/shadcn/status-list.css +0 -66
  236. package/src/shadcn/step-indicator.css +0 -37
  237. package/src/shadcn/switch.css +0 -31
  238. package/src/shadcn/table.css +0 -89
  239. package/src/shadcn/tabs.css +0 -151
  240. package/src/shadcn/timeline.css +0 -45
  241. package/src/shadcn/toc.css +0 -20
  242. package/src/shadcn/toggle.css +0 -48
  243. package/src/shadcn/toolbar.css +0 -84
  244. package/src/shadcn/tree.css +0 -135
  245. package/src/shadcn/upload-progress.css +0 -102
  246. package/src/shadcn/upload-target.css +0 -50
@@ -1,137 +0,0 @@
1
- /**
2
- * Tree - Ant Design Theme Styles
3
- *
4
- * Enterprise clean: selected items get bg-primary-z1 with rounded corners.
5
- */
6
-
7
- /* =============================================================================
8
- Tree Container
9
- ============================================================================= */
10
-
11
- [data-style='ant-design'] [data-tree]:focus-within {
12
- @apply outline-none;
13
- }
14
-
15
- /* =============================================================================
16
- Tree Toggle Button
17
- ============================================================================= */
18
-
19
- [data-style='ant-design'] [data-tree-toggle-btn] {
20
- @apply text-surface-z4;
21
- }
22
-
23
- [data-style='ant-design'] [data-tree-toggle-btn]:hover {
24
- @apply text-primary-z5 bg-none;
25
- }
26
-
27
- /* =============================================================================
28
- Tree Item Content
29
- ============================================================================= */
30
-
31
- [data-style='ant-design'] [data-tree-item-content] {
32
- @apply text-surface-z7 rounded;
33
- }
34
-
35
- [data-style='ant-design'] [data-tree-item-content]:hover:not(:disabled),
36
- [data-style='ant-design'] [data-tree-item-content]:focus:not(:disabled) {
37
- @apply bg-primary-z1 text-primary-z6 rounded bg-none outline-none;
38
- }
39
-
40
- /* Focus visible for keyboard navigation */
41
- [data-style='ant-design'] [data-tree-item-content]:focus-visible {
42
- @apply ring-primary-z3 ring-1 outline-none;
43
- }
44
-
45
- /* Active/selected state */
46
- [data-style='ant-design'] [data-tree-item-content][data-active='true'] {
47
- @apply bg-primary-z1 text-primary-z6 rounded bg-none;
48
- }
49
-
50
- [data-style='ant-design'] [data-tree-item-content][data-active='true']:hover:not(:disabled) {
51
- @apply bg-primary-z2 text-primary-z7 bg-none;
52
- }
53
-
54
- /* Reset gradients bleeding in */
55
- [data-style='ant-design'] [data-tree]:focus-within [data-tree-item-content][data-active='true'] {
56
- @apply bg-primary-z1;
57
- }
58
-
59
- [data-style='ant-design']
60
- [data-tree]:focus-within
61
- [data-tree-item-content][data-active='true']:hover:not(:disabled) {
62
- @apply bg-primary-z2;
63
- }
64
-
65
- [data-style='ant-design']
66
- [data-tree]:not(:focus-within)
67
- [data-tree-item-content][data-active='true'] {
68
- @apply bg-primary-z1;
69
- }
70
-
71
- /* =============================================================================
72
- Item Elements
73
- ============================================================================= */
74
-
75
- [data-style='ant-design'] [data-tree-item-content] [data-item-icon] {
76
- @apply text-surface-z5;
77
- }
78
-
79
- [data-style='ant-design'] [data-tree-item-content]:hover:not(:disabled) [data-item-icon] {
80
- @apply text-primary-z5;
81
- }
82
-
83
- [data-style='ant-design'] [data-tree-item-content][data-active='true'] [data-item-icon] {
84
- @apply text-primary-z5;
85
- }
86
-
87
- [data-style='ant-design'] [data-tree-item-content] [data-item-description] {
88
- @apply text-surface-z5;
89
- }
90
-
91
- [data-style='ant-design'] [data-tree-item-content][data-active='true'] [data-item-description] {
92
- @apply text-primary-z5;
93
- }
94
-
95
- [data-style='ant-design'] [data-tree-item-content] [data-item-badge] {
96
- @apply text-surface-z6 border-surface-z4 rounded border bg-transparent bg-none;
97
- }
98
-
99
- [data-style='ant-design'] [data-tree-item-content][data-active='true'] [data-item-badge] {
100
- @apply text-primary-z6 border-primary-z4;
101
- }
102
-
103
- [data-style='ant-design']
104
- [data-tree]:focus-within
105
- [data-tree-item-content][data-active='true']
106
- [data-item-badge] {
107
- @apply bg-transparent;
108
- }
109
-
110
- [data-style='ant-design']
111
- [data-tree]:not(:focus-within)
112
- [data-tree-item-content][data-active='true']
113
- [data-item-badge] {
114
- @apply bg-transparent;
115
- }
116
-
117
- /* =============================================================================
118
- Multi-Selection
119
- ============================================================================= */
120
-
121
- [data-style='ant-design'] [data-tree-node][data-selected='true'] [data-tree-item-content] {
122
- @apply bg-primary-z1 text-primary-z6 rounded bg-none;
123
- }
124
-
125
- [data-style='ant-design']
126
- [data-tree]:focus-within
127
- [data-tree-node][data-selected='true']
128
- [data-tree-item-content] {
129
- @apply bg-primary-z1 text-primary-z6 rounded bg-none;
130
- }
131
-
132
- [data-style='ant-design']
133
- [data-tree-node][data-selected='true']
134
- [data-tree-item-content]
135
- [data-item-icon] {
136
- @apply text-primary-z5;
137
- }
@@ -1,102 +0,0 @@
1
- /**
2
- * UploadProgress - Ant Design Theme Styles
3
- *
4
- * Status colors, progress fill, action buttons.
5
- */
6
-
7
- /* =============================================================================
8
- Header
9
- ============================================================================= */
10
-
11
- [data-style='ant-design'] [data-upload-header] {
12
- @apply text-surface-z7;
13
- }
14
-
15
- [data-style='ant-design'] [data-upload-clear] {
16
- @apply border-surface-z4 text-surface-z6 rounded border;
17
- }
18
-
19
- [data-style='ant-design'] [data-upload-clear]:hover {
20
- @apply border-primary-z4 text-primary-z5;
21
- }
22
-
23
- /* =============================================================================
24
- File Rows
25
- ============================================================================= */
26
-
27
- [data-style='ant-design'] [data-upload-file-status] {
28
- @apply text-surface-z7 rounded;
29
- }
30
-
31
- [data-style='ant-design'] [data-upload-file-status]:hover {
32
- @apply bg-surface-z1;
33
- }
34
-
35
- /* =============================================================================
36
- File Elements
37
- ============================================================================= */
38
-
39
- [data-style='ant-design'] [data-upload-file-icon] {
40
- @apply text-surface-z5;
41
- }
42
-
43
- [data-style='ant-design'] [data-upload-file-size] {
44
- @apply text-surface-z5;
45
- }
46
-
47
- /* =============================================================================
48
- Progress Bar
49
- ============================================================================= */
50
-
51
- [data-style='ant-design'] [data-upload-bar] {
52
- @apply bg-surface-z2 rounded;
53
- }
54
-
55
- [data-style='ant-design'] [data-upload-fill] {
56
- @apply bg-primary-z5 rounded;
57
- }
58
-
59
- /* =============================================================================
60
- Status Colors
61
- ============================================================================= */
62
-
63
- [data-style='ant-design'] [data-upload-file-status][data-status='uploading'] [data-upload-status] {
64
- @apply text-primary-z5;
65
- }
66
-
67
- [data-style='ant-design'] [data-upload-file-status][data-status='done'] [data-upload-status] {
68
- @apply text-success-z5;
69
- }
70
-
71
- [data-style='ant-design'] [data-upload-file-status][data-status='error'] [data-upload-status] {
72
- @apply text-error-z5;
73
- }
74
-
75
- [data-style='ant-design'] [data-upload-file-status][data-status='pending'] [data-upload-status] {
76
- @apply text-surface-z5;
77
- }
78
-
79
- /* Status-based file icon tinting */
80
- [data-style='ant-design'] [data-upload-file-status][data-status='done'] [data-upload-file-icon] {
81
- @apply text-success-z5;
82
- }
83
-
84
- [data-style='ant-design'] [data-upload-file-status][data-status='error'] [data-upload-file-icon] {
85
- @apply text-error-z5;
86
- }
87
-
88
- /* =============================================================================
89
- Action Buttons
90
- ============================================================================= */
91
-
92
- [data-style='ant-design'] [data-upload-actions] button {
93
- @apply text-surface-z5;
94
- }
95
-
96
- [data-style='ant-design'] [data-upload-actions] button:hover {
97
- @apply bg-surface-z2 text-primary-z5;
98
- }
99
-
100
- [data-style='ant-design'] [data-upload-file-status][data-status='error'] [data-upload-retry]:hover {
101
- @apply text-primary-z6;
102
- }
@@ -1,50 +0,0 @@
1
- /**
2
- * UploadTarget - Ant Design Theme Styles
3
- *
4
- * Enterprise clean: thin dashed border, primary drag-over highlight.
5
- */
6
-
7
- /* =============================================================================
8
- Drop Zone
9
- ============================================================================= */
10
-
11
- [data-style='ant-design'] [data-upload-target] {
12
- @apply border-surface-z4 text-surface-z6 rounded;
13
- }
14
-
15
- [data-style='ant-design'] [data-upload-target]:hover:not([data-disabled]) {
16
- @apply border-primary-z4 text-primary-z5 bg-primary-z1;
17
- }
18
-
19
- [data-style='ant-design'] [data-upload-target]:focus-visible:not([data-disabled]) {
20
- @apply border-primary-z5 ring-primary-z3 ring-1;
21
- }
22
-
23
- /* Drag-over highlight */
24
- [data-style='ant-design'] [data-upload-target][data-dragging] {
25
- @apply border-primary-z5 bg-primary-z1 text-primary-z6;
26
- }
27
-
28
- /* =============================================================================
29
- Upload Icon
30
- ============================================================================= */
31
-
32
- [data-style='ant-design'] [data-upload-target] [data-upload-icon] {
33
- @apply text-surface-z4;
34
- }
35
-
36
- [data-style='ant-design'] [data-upload-target][data-dragging] [data-upload-icon] {
37
- @apply text-primary-z5;
38
- }
39
-
40
- /* =============================================================================
41
- Browse Button
42
- ============================================================================= */
43
-
44
- [data-style='ant-design'] [data-upload-target] [data-upload-button] {
45
- @apply border-primary-z4 text-primary-z5 rounded border;
46
- }
47
-
48
- [data-style='ant-design'] [data-upload-target] [data-upload-button]:hover:not(:disabled) {
49
- @apply bg-primary-z1 text-primary-z6;
50
- }
@@ -1,176 +0,0 @@
1
- /**
2
- * Button - bits-ui Theme Styles
3
- *
4
- * Softer, more premium styling with rounded corners and subtle elevation.
5
- */
6
-
7
- /* =============================================================================
8
- Default Style (filled)
9
- ============================================================================= */
10
-
11
- [data-style='bits-ui'] [data-button][data-style='default'][data-variant='default'],
12
- [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='default'],
13
- [data-style='bits-ui'] [data-button][data-style='default']:not([data-variant]),
14
- [data-style='bits-ui'] [data-button]:not([data-style]):not([data-variant]) {
15
- @apply bg-surface-z2 border-surface-z3 text-surface-z8 rounded-lg border bg-none shadow-sm;
16
- }
17
-
18
- [data-style='bits-ui'] [data-button][data-style='default'][data-variant='primary'],
19
- [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='primary'] {
20
- @apply bg-primary-z5 text-on-primary rounded-lg border-transparent bg-none shadow-sm;
21
- }
22
-
23
- [data-style='bits-ui'] [data-button][data-style='default'][data-variant='secondary'],
24
- [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='secondary'] {
25
- @apply bg-secondary-z4 text-on-secondary rounded-lg border-transparent bg-none shadow-sm;
26
- }
27
-
28
- [data-style='bits-ui'] [data-button][data-style='default'][data-variant='accent'],
29
- [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='accent'] {
30
- @apply bg-accent-z4 text-on-accent rounded-lg border-transparent bg-none shadow-sm;
31
- }
32
-
33
- [data-style='bits-ui'] [data-button][data-style='default'][data-variant='danger'],
34
- [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='danger'] {
35
- @apply bg-danger-z4 text-on-danger rounded-lg border-transparent bg-none shadow-sm;
36
- }
37
-
38
- /* =============================================================================
39
- Outline Style
40
- ============================================================================= */
41
-
42
- [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='default'],
43
- [data-style='bits-ui'] [data-button][data-style='outline']:not([data-variant]) {
44
- @apply border-surface-z3 text-surface-z7 rounded-lg border bg-transparent shadow-sm;
45
- }
46
-
47
- [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='primary'] {
48
- @apply border-primary-z4 text-primary-z6 rounded-lg border bg-transparent shadow-sm;
49
- }
50
-
51
- [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='secondary'] {
52
- @apply border-secondary-z4 text-secondary-z6 rounded-lg border bg-transparent shadow-sm;
53
- }
54
-
55
- [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='accent'] {
56
- @apply border-accent-z4 text-accent-z6 rounded-lg border bg-transparent shadow-sm;
57
- }
58
-
59
- [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='danger'] {
60
- @apply border-danger-z4 text-danger-z4 rounded-lg border bg-transparent shadow-sm;
61
- }
62
-
63
- /* =============================================================================
64
- Ghost Style
65
- ============================================================================= */
66
-
67
- [data-style='bits-ui'] [data-button][data-style='ghost'] {
68
- @apply rounded-lg border-transparent bg-transparent;
69
- }
70
-
71
- [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='default'],
72
- [data-style='bits-ui'] [data-button][data-style='ghost']:not([data-variant]) {
73
- @apply text-surface-z7;
74
- }
75
-
76
- [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='primary'] {
77
- @apply text-primary-z6;
78
- }
79
-
80
- [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='secondary'] {
81
- @apply text-secondary-z6;
82
- }
83
-
84
- [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='accent'] {
85
- @apply text-accent-z6;
86
- }
87
-
88
- [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='danger'] {
89
- @apply text-danger-z4;
90
- }
91
-
92
- /* =============================================================================
93
- Gradient Style
94
- ============================================================================= */
95
-
96
- [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='default'],
97
- [data-style='bits-ui'] [data-button][data-style='gradient']:not([data-variant]) {
98
- @apply from-surface-z3 to-surface-z1 text-surface-z10 rounded-lg bg-gradient-to-br shadow-sm;
99
- }
100
-
101
- [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='primary'] {
102
- @apply from-primary-z5 to-primary-z3 text-on-primary rounded-lg bg-gradient-to-br shadow-sm;
103
- }
104
-
105
- [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='secondary'] {
106
- @apply from-secondary-z5 to-secondary-z3 text-on-secondary rounded-lg bg-gradient-to-br shadow-sm;
107
- }
108
-
109
- [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='accent'] {
110
- @apply from-accent-z5 to-accent-z3 text-on-accent rounded-lg bg-gradient-to-br shadow-sm;
111
- }
112
-
113
- [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='danger'] {
114
- @apply from-danger-z5 to-danger-z3 text-on-danger rounded-lg bg-gradient-to-br shadow-sm;
115
- }
116
-
117
- [data-style='bits-ui']
118
- [data-button][data-style='gradient']:hover:not(:disabled):not([data-disabled]) {
119
- filter: brightness(1.05);
120
- }
121
-
122
- /* =============================================================================
123
- Link Style
124
- ============================================================================= */
125
-
126
- [data-style='bits-ui'] [data-button][data-style='link'][data-variant='default'],
127
- [data-style='bits-ui'] [data-button][data-style='link']:not([data-variant]) {
128
- @apply text-surface-z7;
129
- }
130
-
131
- [data-style='bits-ui'] [data-button][data-style='link'][data-variant='primary'] {
132
- @apply text-primary-z6;
133
- }
134
-
135
- [data-style='bits-ui'] [data-button][data-style='link'][data-variant='secondary'] {
136
- @apply text-secondary-z6;
137
- }
138
-
139
- [data-style='bits-ui'] [data-button][data-style='link'][data-variant='accent'] {
140
- @apply text-accent-z6;
141
- }
142
-
143
- [data-style='bits-ui'] [data-button][data-style='link'][data-variant='danger'] {
144
- @apply text-danger-z4;
145
- }
146
-
147
- [data-style='bits-ui'] [data-button][data-style='link']:hover:not(:disabled):not([data-disabled]) {
148
- @apply text-surface-z9;
149
- }
150
-
151
- /* =============================================================================
152
- Hover States
153
- ============================================================================= */
154
-
155
- [data-style='bits-ui']
156
- [data-button][data-style='default']:hover:not(:disabled):not([data-disabled]),
157
- [data-style='bits-ui'] [data-button]:not([data-style]):hover:not(:disabled):not([data-disabled]) {
158
- @apply bg-surface-z3 border-surface-z4 bg-none shadow-md;
159
- }
160
-
161
- [data-style='bits-ui']
162
- [data-button][data-style='outline']:hover:not(:disabled):not([data-disabled]) {
163
- @apply bg-surface-z1 border-surface-z4 bg-none shadow-md;
164
- }
165
-
166
- [data-style='bits-ui'] [data-button][data-style='ghost']:hover:not(:disabled):not([data-disabled]) {
167
- @apply bg-surface-z2;
168
- }
169
-
170
- /* =============================================================================
171
- Focus
172
- ============================================================================= */
173
-
174
- [data-style='bits-ui'] [data-button]:focus-visible {
175
- @apply ring-primary-z3 ring-2 outline-none;
176
- }
@@ -1,99 +0,0 @@
1
- /**
2
- * Card - bits-ui Theme Styles
3
- *
4
- * Premium card styling with rounded-xl and shadow.
5
- */
6
-
7
- /* =============================================================================
8
- Base Card Styles
9
- ============================================================================= */
10
-
11
- [data-style='bits-ui'] [data-card] {
12
- @apply bg-surface-z1 border-surface-z2 text-surface-z9 rounded-xl border bg-none shadow-sm;
13
- }
14
-
15
- /* Interactive cards (buttons) */
16
- [data-style='bits-ui'] [data-card][data-card-interactive] {
17
- cursor: pointer;
18
- transition:
19
- border-color 0.2s ease,
20
- box-shadow 0.2s ease;
21
- }
22
-
23
- [data-style='bits-ui'] [data-card][data-card-interactive]:hover {
24
- @apply border-surface-z4 shadow-md;
25
- }
26
-
27
- [data-style='bits-ui'] [data-card][data-card-interactive]:active {
28
- @apply bg-surface-z2;
29
- }
30
-
31
- /* =============================================================================
32
- Card Sections
33
- ============================================================================= */
34
-
35
- [data-style='bits-ui'] [data-card-header] {
36
- @apply border-surface-z2 border-b;
37
- }
38
-
39
- [data-style='bits-ui'] [data-card-body] {
40
- @apply text-surface-z8;
41
- }
42
-
43
- [data-style='bits-ui'] [data-card-footer] {
44
- @apply border-surface-z2 text-surface-z7 border-t;
45
- }
46
-
47
- /* =============================================================================
48
- Focus States
49
- ============================================================================= */
50
-
51
- [data-style='bits-ui'] [data-card][data-card-interactive]:focus-visible {
52
- @apply ring-primary-z3 ring-2 outline-none;
53
- }
54
-
55
- /* =============================================================================
56
- Disabled State
57
- ============================================================================= */
58
-
59
- [data-style='bits-ui'] [data-card][data-card-interactive][data-disabled],
60
- [data-style='bits-ui'] [data-card][data-card-interactive]:disabled {
61
- @apply cursor-not-allowed opacity-50;
62
- }
63
-
64
- /* =============================================================================
65
- Variants
66
- ============================================================================= */
67
-
68
- /* Primary — solid primary fill */
69
- [data-style='bits-ui'] [data-card][data-variant='primary'] {
70
- @apply bg-primary-z5 border-primary-z6 text-on-primary border bg-none shadow-sm;
71
- }
72
-
73
- [data-style='bits-ui'] [data-card][data-variant='primary'] [data-card-header],
74
- [data-style='bits-ui'] [data-card][data-variant='primary'] [data-card-footer] {
75
- @apply border-primary-z4/40;
76
- }
77
-
78
- [data-style='bits-ui'] [data-card][data-variant='primary'] [data-card-body] {
79
- @apply text-on-primary/80;
80
- }
81
-
82
- /* Secondary — solid secondary fill */
83
- [data-style='bits-ui'] [data-card][data-variant='secondary'] {
84
- @apply bg-secondary-z4 border-secondary-z5 text-on-secondary border bg-none shadow-sm;
85
- }
86
-
87
- [data-style='bits-ui'] [data-card][data-variant='secondary'] [data-card-header],
88
- [data-style='bits-ui'] [data-card][data-variant='secondary'] [data-card-footer] {
89
- @apply border-secondary-z3/40;
90
- }
91
-
92
- [data-style='bits-ui'] [data-card][data-variant='secondary'] [data-card-body] {
93
- @apply text-on-secondary/80;
94
- }
95
-
96
- /* Tertiary — recessed surface, lighter border */
97
- [data-style='bits-ui'] [data-card][data-variant='tertiary'] {
98
- @apply bg-surface-z0 border-surface-z2 text-surface-z7 border bg-none shadow-none;
99
- }
@@ -1,34 +0,0 @@
1
- /**
2
- * Chart - Bits UI Theme Styles
3
- */
4
-
5
- [data-style='bits-ui'] [data-chart-axis-line],
6
- [data-style='bits-ui'] [data-chart-tick] line {
7
- @apply stroke-surface-z3;
8
- }
9
-
10
- [data-style='bits-ui'] [data-chart-tick-label] {
11
- @apply fill-surface-z5;
12
- }
13
-
14
- [data-style='bits-ui'] [data-chart-grid-line] {
15
- @apply stroke-surface-z3;
16
- stroke-opacity: 0.5;
17
- stroke-dasharray: 2 4;
18
- }
19
-
20
- [data-style='bits-ui'] [data-chart-legend-label] {
21
- @apply fill-surface-z5;
22
- }
23
-
24
- [data-style='bits-ui'] [data-chart-legend-item]:hover {
25
- @apply text-surface-z8;
26
- }
27
-
28
- [data-style='bits-ui'] [data-plot-element='bar'][data-dimmed],
29
- [data-style='bits-ui'] [data-plot-element='point'][data-dimmed],
30
- [data-style='bits-ui'] [data-plot-element='arc'][data-dimmed],
31
- [data-style='bits-ui'] [data-plot-element='line'][data-dimmed],
32
- [data-style='bits-ui'] [data-plot-element='area'][data-dimmed] {
33
- opacity: 0.15;
34
- }
@@ -1,11 +0,0 @@
1
- /**
2
- * Connector - bits-ui Theme Styles
3
- *
4
- * Visual theming for tree line connectors.
5
- */
6
-
7
- [data-style='bits-ui'] [data-connector] [data-connector-v],
8
- [data-style='bits-ui'] [data-connector] [data-connector-h],
9
- [data-style='bits-ui'] [data-connector] [data-connector-corner] {
10
- @apply border-surface-z3;
11
- }
@@ -1,50 +0,0 @@
1
- /**
2
- * Dropdown - bits-ui Theme Styles
3
- *
4
- * Rounded trigger with shadow, panel with rounded-xl and elevated shadow.
5
- */
6
-
7
- [data-style='bits-ui'] [data-dropdown-trigger] {
8
- @apply border-surface-z3 text-surface-z7 bg-surface-z1 rounded-lg border bg-none shadow-sm;
9
- }
10
-
11
- [data-style='bits-ui'] [data-dropdown-trigger]:hover:not(:disabled) {
12
- @apply text-surface-z9 border-surface-z4 bg-none shadow-md;
13
- }
14
-
15
- [data-style='bits-ui'] [data-dropdown-trigger]:focus-visible {
16
- @apply ring-primary-z3 ring-2 outline-none;
17
- }
18
-
19
- [data-style='bits-ui'] [data-dropdown][data-open='true'] [data-dropdown-trigger] {
20
- @apply border-surface-z5 ring-primary-z3 bg-none ring-2;
21
- }
22
-
23
- [data-style='bits-ui'] [data-dropdown-trigger] [data-dropdown-icon] {
24
- @apply text-surface-z5;
25
- }
26
-
27
- [data-style='bits-ui'] [data-dropdown-trigger] [data-dropdown-arrow] {
28
- @apply text-surface-z4;
29
- }
30
-
31
- [data-style='bits-ui'] [data-dropdown-panel] {
32
- @apply bg-surface-z1 border-surface-z3 rounded-xl border bg-none shadow-lg;
33
- }
34
-
35
- [data-style='bits-ui'] [data-dropdown-option] {
36
- @apply text-surface-z7 rounded-lg;
37
- }
38
-
39
- [data-style='bits-ui'] [data-dropdown-option]:hover:not(:disabled),
40
- [data-style='bits-ui'] [data-dropdown-option]:focus:not(:disabled) {
41
- @apply bg-surface-z2 text-surface-z9 outline-none;
42
- }
43
-
44
- [data-style='bits-ui'] [data-dropdown-option][data-active='true'] {
45
- @apply bg-primary-z2 text-primary-z8;
46
- }
47
-
48
- [data-style='bits-ui'] [data-dropdown-separator] {
49
- @apply bg-surface-z3 bg-none;
50
- }