@code-coaching/vuetiful 0.25.0 → 0.27.0

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 (257) hide show
  1. package/README.md +47 -55
  2. package/dist/css/animations.css +2 -0
  3. package/{src → dist}/css/overrides/quasar.css +73 -58
  4. package/{src/styles → dist/css}/transitions/slide.css +6 -0
  5. package/dist/favicon.ico +0 -0
  6. package/dist/types/components/atoms/VAvatar.vue.d.ts +39 -90
  7. package/dist/types/components/atoms/VBadge.vue.d.ts +34 -21
  8. package/dist/types/components/atoms/VButton.vue.d.ts +42 -48
  9. package/dist/types/components/atoms/VChip.vue.d.ts +33 -21
  10. package/dist/types/components/atoms/VLightSwitch.vue.d.ts +5 -5
  11. package/dist/types/components/atoms/VRadio/VRadioDescription.vue.d.ts +7 -12
  12. package/dist/types/components/atoms/VRadio/VRadioGroup.vue.d.ts +53 -83
  13. package/dist/types/components/atoms/VRadio/VRadioItem.vue.d.ts +46 -12
  14. package/dist/types/components/atoms/VRadio/VRadioLabel.vue.d.ts +7 -12
  15. package/dist/types/components/atoms/VSwitch/VSwitch.vue.d.ts +51 -72
  16. package/dist/types/components/atoms/VSwitch/VSwitchDescription.vue.d.ts +32 -11
  17. package/dist/types/components/atoms/VSwitch/VSwitchGroup.vue.d.ts +32 -11
  18. package/dist/types/components/atoms/VSwitch/VSwitchLabel.vue.d.ts +33 -20
  19. package/dist/types/components/molecules/VAccordion/VAccordion.vue.d.ts +39 -28
  20. package/dist/types/components/molecules/VAccordion/VAccordionItem.vue.d.ts +35 -19
  21. package/dist/types/components/molecules/VAlert.vue.d.ts +50 -73
  22. package/dist/types/components/molecules/VCard/VCard.vue.d.ts +37 -48
  23. package/dist/types/components/molecules/VCard/VCardBody.vue.d.ts +33 -12
  24. package/dist/types/components/molecules/VCard/VCardFooter.vue.d.ts +36 -20
  25. package/dist/types/components/molecules/VCard/VCardHeader.vue.d.ts +36 -20
  26. package/dist/types/components/molecules/VCodeBlock.vue.d.ts +15 -16
  27. package/dist/types/components/molecules/VDrawer.vue.d.ts +13 -7
  28. package/dist/types/components/molecules/VListbox/VListbox.vue.d.ts +54 -132
  29. package/dist/types/components/molecules/VListbox/VListboxButton.vue.d.ts +22 -21
  30. package/dist/types/components/molecules/VListbox/VListboxItem.vue.d.ts +22 -19
  31. package/dist/types/components/molecules/VListbox/VListboxItems.vue.d.ts +19 -30
  32. package/dist/types/components/molecules/VListbox/VListboxLabel.vue.d.ts +7 -12
  33. package/dist/types/components/molecules/VPreview.vue.d.ts +57 -74
  34. package/dist/types/components/molecules/VRail/VRail.vue.d.ts +28 -13
  35. package/dist/types/components/molecules/VRail/VRailTile.vue.d.ts +49 -16
  36. package/dist/types/components/molecules/VShell.vue.d.ts +76 -44
  37. package/dist/types/components/molecules/VShellConfigurator.vue.d.ts +99 -0
  38. package/dist/types/components/molecules/VTabs/VTab.vue.d.ts +52 -20
  39. package/dist/types/components/molecules/VTabs/VTabPanel.vue.d.ts +8 -1
  40. package/dist/types/components/molecules/VTabs/VTabs.vue.d.ts +43 -101
  41. package/dist/types/components/molecules/Vuetiful.vue.d.ts +22 -0
  42. package/dist/types/components/molecules/index.d.ts +3 -4
  43. package/dist/types/directives/click-outside-group.d.ts +9 -0
  44. package/dist/types/directives/click-outside.d.ts +9 -0
  45. package/dist/types/directives/clipboard.d.ts +1 -1
  46. package/dist/types/directives/index.d.ts +3 -1
  47. package/dist/types/index.d.ts +1 -8
  48. package/dist/types/props/props.d.ts +1 -14
  49. package/dist/types/services/dark-mode.service.d.ts +1 -1
  50. package/dist/types/services/drawer.service.d.ts +3 -3
  51. package/dist/types/services/index.d.ts +2 -2
  52. package/dist/types/utils/id-generator.d.ts +1 -0
  53. package/dist/types/utils/index.d.ts +3 -4
  54. package/dist/types/utils/tailwind-merge.d.ts +1 -0
  55. package/dist/types/utils/theme/rocket.theme.d.ts +223 -0
  56. package/dist/types/utils/theme/theme-switcher.vue.d.ts +14 -5
  57. package/dist/types/utils/theme/theme.service.d.ts +6 -9
  58. package/dist/types/utils/theme/themes.d.ts +3 -39
  59. package/dist/types/utils/theme/vuetiful.theme.d.ts +224 -0
  60. package/dist/vuetiful.es.mjs +54837 -49494
  61. package/dist/vuetiful.umd.cjs +189 -0
  62. package/package.json +53 -37
  63. package/dist/style.css +0 -10
  64. package/dist/types/components/VBootstrap.vue.d.ts +0 -15
  65. package/dist/types/components/atoms/VAvatar.test.d.ts +0 -1
  66. package/dist/types/components/atoms/VBadge.test.d.ts +0 -1
  67. package/dist/types/components/atoms/VButton.test.d.ts +0 -1
  68. package/dist/types/components/atoms/VChip.test.d.ts +0 -1
  69. package/dist/types/components/atoms/VLightSwitch.test.d.ts +0 -1
  70. package/dist/types/components/atoms/VRadio/VRadioDescription.test.d.ts +0 -1
  71. package/dist/types/components/atoms/VRadio/VRadioGroup.test.d.ts +0 -1
  72. package/dist/types/components/atoms/VRadio/VRadioItem.test.d.ts +0 -1
  73. package/dist/types/components/atoms/VRadio/VRadioLabel.test.d.ts +0 -1
  74. package/dist/types/components/atoms/VSwitch/VSwitch.test.d.ts +0 -1
  75. package/dist/types/components/atoms/VSwitch/VSwitchDescription.test.d.ts +0 -1
  76. package/dist/types/components/atoms/VSwitch/VSwitchGroup.test.d.ts +0 -1
  77. package/dist/types/components/atoms/VSwitch/VSwitchLabel.test.d.ts +0 -1
  78. package/dist/types/components/molecules/VAccordion/VAccordion.test.d.ts +0 -1
  79. package/dist/types/components/molecules/VAccordion/VAccordionItem.test.d.ts +0 -1
  80. package/dist/types/components/molecules/VAlert.test.d.ts +0 -1
  81. package/dist/types/components/molecules/VCard/VCard.test.d.ts +0 -1
  82. package/dist/types/components/molecules/VCard/VCardBody.test.d.ts +0 -1
  83. package/dist/types/components/molecules/VCard/VCardFooter.test.d.ts +0 -1
  84. package/dist/types/components/molecules/VCard/VCardHeader.test.d.ts +0 -1
  85. package/dist/types/components/molecules/VCodeBlock.test.d.ts +0 -1
  86. package/dist/types/components/molecules/VDrawer.test.d.ts +0 -1
  87. package/dist/types/components/molecules/VListbox/VListbox.test.d.ts +0 -1
  88. package/dist/types/components/molecules/VListbox/VListboxButton.test.d.ts +0 -1
  89. package/dist/types/components/molecules/VListbox/VListboxItem.test.d.ts +0 -1
  90. package/dist/types/components/molecules/VListbox/VListboxItems.test.d.ts +0 -1
  91. package/dist/types/components/molecules/VListbox/VListboxLabel.test.d.ts +0 -1
  92. package/dist/types/components/molecules/VPreview.test.d.ts +0 -1
  93. package/dist/types/components/molecules/VRail/VRail.test.d.ts +0 -1
  94. package/dist/types/components/molecules/VRail/VRailTile.test.d.ts +0 -1
  95. package/dist/types/components/molecules/VShell.test.d.ts +0 -1
  96. package/dist/types/components/molecules/VTabs/VTab.test.d.ts +0 -1
  97. package/dist/types/components/molecules/VTabs/VTabPanel.test.d.ts +0 -1
  98. package/dist/types/components/molecules/VTabs/VTabs.test.d.ts +0 -1
  99. package/dist/types/directives/clipboard.test.d.ts +0 -1
  100. package/dist/types/services/dark-mode.service.test.d.ts +0 -1
  101. package/dist/types/services/drawer.service.test.d.ts +0 -1
  102. package/dist/types/services/highlight.service.test.d.ts +0 -1
  103. package/dist/types/services/rail.service.test.d.ts +0 -1
  104. package/dist/types/services/settings.service.test.d.ts +0 -1
  105. package/dist/types/types/index.d.ts +0 -54
  106. package/dist/types/types/tailwind.d.ts +0 -4
  107. package/dist/types/utils/colors/colors.service.d.ts +0 -69
  108. package/dist/types/utils/platform/platform.service.test.d.ts +0 -1
  109. package/dist/types/utils/theme/callback.test.d.ts +0 -1
  110. package/dist/types/utils/theme/remove.test.d.ts +0 -1
  111. package/dist/types/utils/theme/theme.service.test.d.ts +0 -1
  112. package/dist/vuetiful.umd.js +0 -99
  113. package/src/assets/fonts/myfont.woff +0 -0
  114. package/src/assets/main.css +0 -17
  115. package/src/components/VBootstrap.vue +0 -62
  116. package/src/components/atoms/VAvatar.test.ts +0 -175
  117. package/src/components/atoms/VAvatar.vue +0 -89
  118. package/src/components/atoms/VBadge.test.ts +0 -28
  119. package/src/components/atoms/VBadge.vue +0 -17
  120. package/src/components/atoms/VButton.test.ts +0 -180
  121. package/src/components/atoms/VButton.vue +0 -76
  122. package/src/components/atoms/VChip.test.ts +0 -33
  123. package/src/components/atoms/VChip.vue +0 -17
  124. package/src/components/atoms/VLightSwitch.test.ts +0 -69
  125. package/src/components/atoms/VLightSwitch.vue +0 -121
  126. package/src/components/atoms/VRadio/VRadioDescription.test.ts +0 -55
  127. package/src/components/atoms/VRadio/VRadioDescription.vue +0 -14
  128. package/src/components/atoms/VRadio/VRadioGroup.test.ts +0 -81
  129. package/src/components/atoms/VRadio/VRadioGroup.vue +0 -88
  130. package/src/components/atoms/VRadio/VRadioItem.test.ts +0 -183
  131. package/src/components/atoms/VRadio/VRadioItem.vue +0 -36
  132. package/src/components/atoms/VRadio/VRadioLabel.test.ts +0 -55
  133. package/src/components/atoms/VRadio/VRadioLabel.vue +0 -16
  134. package/src/components/atoms/VSwitch/VSwitch.test.ts +0 -100
  135. package/src/components/atoms/VSwitch/VSwitch.vue +0 -106
  136. package/src/components/atoms/VSwitch/VSwitchDescription.test.ts +0 -55
  137. package/src/components/atoms/VSwitch/VSwitchDescription.vue +0 -16
  138. package/src/components/atoms/VSwitch/VSwitchGroup.test.ts +0 -26
  139. package/src/components/atoms/VSwitch/VSwitchGroup.vue +0 -16
  140. package/src/components/atoms/VSwitch/VSwitchLabel.test.ts +0 -89
  141. package/src/components/atoms/VSwitch/VSwitchLabel.vue +0 -20
  142. package/src/components/atoms/index.ts +0 -31
  143. package/src/components/index.ts +0 -2
  144. package/src/components/molecules/VAccordion/VAccordion.test.ts +0 -27
  145. package/src/components/molecules/VAccordion/VAccordion.vue +0 -32
  146. package/src/components/molecules/VAccordion/VAccordionItem.test.ts +0 -134
  147. package/src/components/molecules/VAccordion/VAccordionItem.vue +0 -68
  148. package/src/components/molecules/VAlert.test.ts +0 -100
  149. package/src/components/molecules/VAlert.vue +0 -137
  150. package/src/components/molecules/VCard/VCard.test.ts +0 -47
  151. package/src/components/molecules/VCard/VCard.vue +0 -74
  152. package/src/components/molecules/VCard/VCardBody.test.ts +0 -39
  153. package/src/components/molecules/VCard/VCardBody.vue +0 -16
  154. package/src/components/molecules/VCard/VCardFooter.test.ts +0 -63
  155. package/src/components/molecules/VCard/VCardFooter.vue +0 -31
  156. package/src/components/molecules/VCard/VCardHeader.test.ts +0 -86
  157. package/src/components/molecules/VCard/VCardHeader.vue +0 -53
  158. package/src/components/molecules/VCodeBlock.test.ts +0 -133
  159. package/src/components/molecules/VCodeBlock.vue +0 -113
  160. package/src/components/molecules/VDrawer.test.ts +0 -14
  161. package/src/components/molecules/VDrawer.vue +0 -87
  162. package/src/components/molecules/VListbox/VListbox.test.ts +0 -146
  163. package/src/components/molecules/VListbox/VListbox.vue +0 -149
  164. package/src/components/molecules/VListbox/VListboxButton.test.ts +0 -66
  165. package/src/components/molecules/VListbox/VListboxButton.vue +0 -57
  166. package/src/components/molecules/VListbox/VListboxItem.test.ts +0 -51
  167. package/src/components/molecules/VListbox/VListboxItem.vue +0 -39
  168. package/src/components/molecules/VListbox/VListboxItems.test.ts +0 -44
  169. package/src/components/molecules/VListbox/VListboxItems.vue +0 -42
  170. package/src/components/molecules/VListbox/VListboxLabel.test.ts +0 -30
  171. package/src/components/molecules/VListbox/VListboxLabel.vue +0 -14
  172. package/src/components/molecules/VPreview.test.ts +0 -73
  173. package/src/components/molecules/VPreview.vue +0 -230
  174. package/src/components/molecules/VRail/VRail.test.ts +0 -14
  175. package/src/components/molecules/VRail/VRail.vue +0 -33
  176. package/src/components/molecules/VRail/VRailTile.test.ts +0 -97
  177. package/src/components/molecules/VRail/VRailTile.vue +0 -49
  178. package/src/components/molecules/VShell.test.ts +0 -14
  179. package/src/components/molecules/VShell.vue +0 -63
  180. package/src/components/molecules/VTabs/VTab.test.ts +0 -143
  181. package/src/components/molecules/VTabs/VTab.vue +0 -50
  182. package/src/components/molecules/VTabs/VTabPanel.test.ts +0 -24
  183. package/src/components/molecules/VTabs/VTabPanel.vue +0 -9
  184. package/src/components/molecules/VTabs/VTabs.test.ts +0 -92
  185. package/src/components/molecules/VTabs/VTabs.vue +0 -104
  186. package/src/components/molecules/index.ts +0 -51
  187. package/src/directives/clipboard.test.ts +0 -26
  188. package/src/directives/clipboard.ts +0 -9
  189. package/src/directives/index.ts +0 -3
  190. package/src/env.d.ts +0 -8
  191. package/src/index.ts +0 -21
  192. package/src/props/index.ts +0 -1
  193. package/src/props/props.ts +0 -62
  194. package/src/services/dark-mode.service.test.ts +0 -104
  195. package/src/services/dark-mode.service.ts +0 -75
  196. package/src/services/drawer.service.test.ts +0 -45
  197. package/src/services/drawer.service.ts +0 -46
  198. package/src/services/highlight.service.test.ts +0 -24
  199. package/src/services/highlight.service.ts +0 -19
  200. package/src/services/index.ts +0 -8
  201. package/src/services/rail.service.test.ts +0 -13
  202. package/src/services/rail.service.ts +0 -11
  203. package/src/services/settings.service.test.ts +0 -17
  204. package/src/services/settings.service.ts +0 -136
  205. package/src/styles/all.css +0 -24
  206. package/src/styles/core.css +0 -66
  207. package/src/styles/elements/alerts.css +0 -17
  208. package/src/styles/elements/badges.css +0 -31
  209. package/src/styles/elements/breadcrumbs.css +0 -26
  210. package/src/styles/elements/buttons.css +0 -103
  211. package/src/styles/elements/cards.css +0 -32
  212. package/src/styles/elements/chips.css +0 -22
  213. package/src/styles/elements/forms.css +0 -269
  214. package/src/styles/elements/lists.css +0 -48
  215. package/src/styles/elements/logo-clouds.css +0 -29
  216. package/src/styles/elements/modals.css +0 -15
  217. package/src/styles/elements/placeholders.css +0 -17
  218. package/src/styles/elements/popups.css +0 -16
  219. package/src/styles/elements/tables.css +0 -102
  220. package/src/styles/elements.css +0 -19
  221. package/src/styles/highlight-js.css +0 -116
  222. package/src/styles/tailwind.css +0 -16
  223. package/src/styles/transitions.css +0 -2
  224. package/src/styles/typography.css +0 -101
  225. package/src/styles/variants.css +0 -156
  226. package/src/tailwind/core.cjs +0 -37
  227. package/src/tailwind/generated/intellisense-classes.cjs +0 -558
  228. package/src/tailwind/intellisense.cjs +0 -21
  229. package/src/tailwind/settings.cjs +0 -20
  230. package/src/tailwind/theme/colors.cjs +0 -20
  231. package/src/tailwind/tokens/backgrounds.cjs +0 -48
  232. package/src/tailwind/tokens/border-radius.cjs +0 -21
  233. package/src/tailwind/tokens/borders.cjs +0 -24
  234. package/src/tailwind/tokens/fills.cjs +0 -20
  235. package/src/tailwind/tokens/rings.cjs +0 -50
  236. package/src/tailwind/tokens/text.cjs +0 -35
  237. package/src/tailwind/vuetiful.cjs +0 -19
  238. package/src/themes/theme-rocket.css +0 -119
  239. package/src/themes/theme-sahara.css +0 -128
  240. package/src/themes/theme-seafoam.css +0 -120
  241. package/src/themes/theme-seasonal.css +0 -115
  242. package/src/themes/theme-skeleton.css +0 -115
  243. package/src/themes/theme-vintage.css +0 -125
  244. package/src/themes/theme-vuetiful.css +0 -136
  245. package/src/types/index.ts +0 -59
  246. package/src/types/tailwind.ts +0 -7
  247. package/src/utils/colors/colors.service.ts +0 -293
  248. package/src/utils/index.ts +0 -8
  249. package/src/utils/platform/platform.service.test.ts +0 -19
  250. package/src/utils/platform/platform.service.ts +0 -8
  251. package/src/utils/theme/callback.test.ts +0 -28
  252. package/src/utils/theme/remove.test.ts +0 -27
  253. package/src/utils/theme/theme-switcher.vue +0 -74
  254. package/src/utils/theme/theme.service.test.ts +0 -269
  255. package/src/utils/theme/theme.service.ts +0 -173
  256. package/src/utils/theme/themes.ts +0 -282
  257. /package/{src/styles → dist/css}/transitions/fade.css +0 -0
@@ -1,558 +0,0 @@
1
- /* This file is generated by Code Coaching scripts/convert-css-to-tailwind-intellisense.js */
2
- module.exports = {
3
- ".hide-scrollbar::-webkit-scrollbar": {
4
- "display": "none",
5
- },
6
- ".hide-scrollbar": {
7
- "-ms-overflow-style": "none ",
8
- "scrollbar-width": "none ",
9
- },
10
- ".divider-vertical": {
11
- "@apply mx-auto inline-block min-h-[10px] border-l border-solid border-surface-300-600-token": {},
12
- },
13
- ".hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_": {
14
- "@apply text-red-400": {},
15
- },
16
- ".hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_": {
17
- "@apply text-purple-400": {},
18
- },
19
- ".hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable": {
20
- "@apply text-sky-300": {},
21
- },
22
- ".hljs-meta .hljs-string,.hljs-regexp,.hljs-string": {
23
- "@apply text-blue-400": {},
24
- },
25
- ".hljs-built_in,.hljs-symbol": {
26
- "@apply text-amber-400": {},
27
- },
28
- ".hljs-code,.hljs-comment,.hljs-formula": {
29
- "@apply text-neutral-500": {},
30
- },
31
- ".hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag": {
32
- "@apply text-green-400": {},
33
- },
34
- ".hljs-subst": {
35
- "@apply text-pink-300": {},
36
- },
37
- ".hljs-section": {
38
- "@apply font-bold text-sky-400": {},
39
- },
40
- ".hljs-bullet": {
41
- "@apply text-yellow-400": {},
42
- },
43
- ".hljs-emphasis": {
44
- "@apply italic text-neutral-200": {},
45
- },
46
- ".hljs-strong": {
47
- "@apply font-bold text-neutral-200": {},
48
- },
49
- ".hljs-addition": {
50
- "@apply bg-green-700 text-lime-300": {},
51
- },
52
- ".hljs-deletion": {
53
- "@apply bg-rose-700 text-rose-300": {},
54
- },
55
- ".variant-outline-primary": {
56
- "@apply ring-[1px] ring-inset ring-primary-500 dark:ring-primary-500": {},
57
- },
58
- ".variant-outline-secondary": {
59
- "@apply ring-[1px] ring-inset ring-secondary-500 dark:ring-secondary-500": {},
60
- },
61
- ".variant-outline-tertiary": {
62
- "@apply ring-[1px] ring-inset ring-tertiary-500 dark:ring-tertiary-500": {},
63
- },
64
- ".variant-outline-success": {
65
- "@apply ring-[1px] ring-inset ring-success-500 dark:ring-success-500": {},
66
- },
67
- ".variant-outline-warning": {
68
- "@apply ring-[1px] ring-inset ring-warning-500 dark:ring-warning-500": {},
69
- },
70
- ".variant-outline-error": {
71
- "@apply ring-[1px] ring-inset ring-error-500 dark:ring-error-500": {},
72
- },
73
- ".variant-outline,.variant-outline-surface": {
74
- "@apply ring-[1px] ring-inset ring-surface-500 dark:ring-surface-500": {},
75
- },
76
- ".variant-filled": {
77
- "@apply bg-surface-900-50-token text-surface-50-900-token": {},
78
- },
79
- ".variant-filled-primary": {
80
- "@apply bg-primary-500 text-on-primary-token dark:bg-primary-500 dark:text-on-primary-token": {},
81
- },
82
- ".variant-filled-secondary": {
83
- "@apply bg-secondary-500 text-on-secondary-token dark:bg-secondary-500 dark:text-on-secondary-token": {},
84
- },
85
- ".variant-filled-tertiary": {
86
- "@apply bg-tertiary-500 text-on-tertiary-token dark:bg-tertiary-500 dark:text-on-tertiary-token": {},
87
- },
88
- ".variant-filled-success": {
89
- "@apply bg-success-500 text-on-success-token dark:bg-success-500 dark:text-on-success-token": {},
90
- },
91
- ".variant-filled-warning": {
92
- "@apply bg-warning-500 text-on-warning-token dark:bg-warning-500 dark:text-on-warning-token": {},
93
- },
94
- ".variant-filled-error": {
95
- "@apply bg-error-500 text-on-error-token dark:bg-error-500 dark:text-on-error-token": {},
96
- },
97
- ".variant-filled-surface": {
98
- "@apply bg-surface-400-500-token text-on-surface-token dark:text-on-surface-token": {},
99
- },
100
- ".variant-ringed": {
101
- "@apply variant-outline bg-transparent dark:bg-transparent": {},
102
- },
103
- ".variant-ringed-primary": {
104
- "@apply variant-outline-primary bg-transparent dark:bg-transparent": {},
105
- },
106
- ".variant-ringed-secondary": {
107
- "@apply variant-outline-secondary bg-transparent dark:bg-transparent": {},
108
- },
109
- ".variant-ringed-tertiary": {
110
- "@apply variant-outline-tertiary bg-transparent dark:bg-transparent": {},
111
- },
112
- ".variant-ringed-success": {
113
- "@apply variant-outline-success bg-transparent dark:bg-transparent": {},
114
- },
115
- ".variant-ringed-warning": {
116
- "@apply variant-outline-warning bg-transparent dark:bg-transparent": {},
117
- },
118
- ".variant-ringed-error": {
119
- "@apply variant-outline-error bg-transparent dark:bg-transparent": {},
120
- },
121
- ".variant-ringed-surface": {
122
- "@apply variant-outline-surface bg-transparent dark:bg-transparent": {},
123
- },
124
- ".variant-ghost-primary": {
125
- "@apply variant-outline-primary bg-primary-500/20 dark:bg-primary-500/20": {},
126
- },
127
- ".variant-ghost-secondary": {
128
- "@apply variant-outline-secondary bg-secondary-500/20 dark:bg-secondary-500/20": {},
129
- },
130
- ".variant-ghost-tertiary": {
131
- "@apply variant-outline-tertiary bg-tertiary-500/20 dark:bg-tertiary-500/20": {},
132
- },
133
- ".variant-ghost-success": {
134
- "@apply variant-outline-success bg-success-500/20 dark:bg-success-500/20": {},
135
- },
136
- ".variant-ghost-warning": {
137
- "@apply variant-outline-warning bg-warning-500/20 dark:bg-warning-500/20": {},
138
- },
139
- ".variant-ghost-error": {
140
- "@apply variant-outline-error bg-error-500/20 dark:bg-error-500/20": {},
141
- },
142
- ".variant-ghost,.variant-ghost-surface": {
143
- "@apply variant-outline-surface bg-surface-500/20 dark:bg-surface-500/20": {},
144
- },
145
- ".variant-soft-primary": {
146
- "@apply bg-primary-400/20 !ring-0 text-primary-700-200-token dark:bg-primary-500/20": {},
147
- },
148
- ".variant-soft-secondary": {
149
- "@apply bg-secondary-400/20 !ring-0 text-secondary-700-200-token dark:bg-secondary-500/20": {},
150
- },
151
- ".variant-soft-tertiary": {
152
- "@apply bg-tertiary-400/20 !ring-0 text-tertiary-700-200-token dark:bg-tertiary-500/20": {},
153
- },
154
- ".variant-soft-success": {
155
- "@apply bg-success-400/20 !ring-0 text-success-700-200-token dark:bg-success-500/20": {},
156
- },
157
- ".variant-soft-warning": {
158
- "@apply bg-warning-400/20 !ring-0 text-warning-700-200-token dark:bg-warning-500/20": {},
159
- },
160
- ".variant-soft-error": {
161
- "@apply bg-error-400/20 !ring-0 text-error-700-200-token dark:bg-error-500/20": {},
162
- },
163
- ".variant-soft,.variant-soft-surface": {
164
- "@apply bg-surface-400/20 !ring-0 text-surface-700-200-token dark:bg-surface-500/20": {},
165
- },
166
- ".variant-glass-primary": {
167
- "@apply bg-primary-500/20 backdrop-blur-lg dark:bg-primary-500/20": {},
168
- },
169
- ".variant-glass-secondary": {
170
- "@apply bg-secondary-500/20 backdrop-blur-lg dark:bg-secondary-500/20": {},
171
- },
172
- ".variant-glass-tertiary": {
173
- "@apply bg-tertiary-500/20 backdrop-blur-lg dark:bg-tertiary-500/20": {},
174
- },
175
- ".variant-glass-success": {
176
- "@apply bg-success-500/20 backdrop-blur-lg dark:bg-success-500/20": {},
177
- },
178
- ".variant-glass-warning": {
179
- "@apply bg-warning-500/20 backdrop-blur-lg dark:bg-warning-500/20": {},
180
- },
181
- ".variant-glass-error": {
182
- "@apply bg-error-500/20 backdrop-blur-lg dark:bg-error-500/20": {},
183
- },
184
- ".variant-glass-surface": {
185
- "@apply bg-surface-500/20 backdrop-blur-lg dark:bg-surface-500/20": {},
186
- },
187
- ".variant-glass": {
188
- "@apply bg-surface-50/30 backdrop-blur-lg dark:bg-surface-900/30": {},
189
- },
190
- ".alert": {
191
- "@apply flex flex-col items-start space-y-4 p-4 lg:flex-row lg:items-center lg:space-x-4 lg:space-y-0": {},
192
- "@apply text-surface-900-50-token": {},
193
- "@apply rounded-container-token": {},
194
- },
195
- ".alert-message": {
196
- "@apply flex-auto space-y-2": {},
197
- },
198
- ".alert-actions": {
199
- "@apply flex items-center space-x-2": {},
200
- },
201
- ".badge": {
202
- "@apply inline-flex items-center justify-center space-x-2 whitespace-nowrap": {},
203
- "@apply text-xs font-semibold": {},
204
- "@apply px-2 py-1": {},
205
- "@apply rounded-token": {},
206
- },
207
- ".badge-icon": {
208
- "@apply flex h-5 w-5 items-center justify-center rounded-full": {},
209
- "@apply text-xs font-semibold": {},
210
- "@apply shadow": {},
211
- },
212
- ".badge-glass": {
213
- "@apply bg-surface-500/20 backdrop-blur-lg dark:bg-surface-500/20": {},
214
- "@apply ring-[1px] ring-inset ring-neutral-900/5 dark:ring-neutral-50/5": {},
215
- },
216
- ".breadcrumb,.breadcrumb-nonresponsive": {
217
- "@apply hide-scrollbar flex w-full items-center space-x-4 overflow-x-auto": {},
218
- },
219
- ".crumb": {
220
- "@apply flex items-center justify-center space-x-2": {},
221
- },
222
- ".crumb-separator": {
223
- "@apply flex opacity-50 text-surface-700-200-token": {},
224
- },
225
- ".breadcrumb li": {
226
- "@apply hidden md:block": {},
227
- },
228
- ".breadcrumb li:nth-last-child(3),.breadcrumb li:nth-last-child(2),.breadcrumb li:nth-last-child(1)": {
229
- "@apply block": {},
230
- },
231
- ".button-base-styles": {
232
- "@apply px-5 py-[9px] text-base": {},
233
- "@apply whitespace-nowrap text-center": {},
234
- "@apply inline-flex items-center justify-center space-x-2": {},
235
- "@apply hover:brightness-[1.15]": {},
236
- "@apply transition-all": {},
237
- },
238
- ".btn": {
239
- "@apply button-base-styles rounded-token active:scale-[95%] active:brightness-90": {},
240
- },
241
- ".btn-sm": {
242
- "@apply px-3 py-1.5 text-sm": {},
243
- },
244
- ".btn-lg": {
245
- "@apply px-7 py-3 text-lg": {},
246
- },
247
- ".btn-xl": {
248
- "@apply px-9 py-4 text-xl": {},
249
- },
250
- ".btn-icon": {
251
- "@apply btn": {},
252
- "@apply aspect-square w-[43px] text-base": {},
253
- "@apply rounded-full": {},
254
- },
255
- ".btn-icon-sm": {
256
- "@apply aspect-square w-[33px] text-sm": {},
257
- },
258
- ".btn-icon-base": {
259
- "@apply aspect-square w-[43px] text-base": {},
260
- },
261
- ".btn-icon-lg": {
262
- "@apply aspect-square w-[53px] text-lg": {},
263
- },
264
- ".btn-icon-xl": {
265
- "@apply aspect-square w-[63px] text-xl": {},
266
- },
267
- ".btn-group": {
268
- "@apply inline-flex flex-row space-x-0 overflow-hidden rounded-token": {},
269
- "isolation": "isolate",
270
- },
271
- ".btn-group-vertical": {
272
- "@apply btn-group flex-col space-y-0 rounded-container-token": {},
273
- "isolation": "isolate",
274
- },
275
- ".btn-group button,.btn-group a,.btn-group-vertical button,.btn-group-vertical a": {
276
- "@apply button-base-styles hover:bg-surface-50/[3%] active:bg-surface-900/[3%]": {},
277
- "@apply !text-inherit !no-underline": {},
278
- },
279
- ".btn-group * + *": {
280
- "@apply border-l border-t-0 border-surface-500/20": {},
281
- },
282
- ".btn-group-vertical * + *": {
283
- "@apply border-l-0 border-t border-surface-500/20": {},
284
- },
285
- ".card": {
286
- "@apply bg-surface-100-800-token": {},
287
- "@apply ring-outline-token": {},
288
- "@apply rounded-container-token": {},
289
- },
290
- ".card-header": {
291
- "@apply p-4 pb-0": {},
292
- },
293
- ".card-footer": {
294
- "@apply p-4 pt-0": {},
295
- },
296
- ".card-hover": {
297
- "@apply transition-all hover:scale-[101%] hover:shadow-xl": {},
298
- },
299
- ".chip": {
300
- "@apply cursor-pointer whitespace-nowrap px-3 py-1.5": {},
301
- "@apply text-center text-xs": {},
302
- "@apply rounded": {},
303
- "@apply inline-flex items-center justify-center space-x-2": {},
304
- "@apply hover:brightness-[1.15]": {},
305
- "@apply transition-all": {},
306
- },
307
- ".chip-disabled,.chip:disabled": {
308
- "@apply !cursor-not-allowed !opacity-50 active:scale-100": {},
309
- },
310
- ".legend": {
311
- "@apply text-xl font-heading-token md:text-2xl": {},
312
- },
313
- ".label": {
314
- "@apply space-y-1": {},
315
- },
316
- ".input,.textarea,.select,.input-group": {
317
- "@apply w-full transition duration-200": {},
318
- "@apply bg-surface-200-700-token hover:brightness-105 focus:brightness-105": {},
319
- "@apply !ring-0": {},
320
- "@apply border-token border-surface-400-500-token focus-within:border-primary-500": {},
321
- },
322
- ".input,.input-group": {
323
- "@apply rounded-token": {},
324
- },
325
- ".textarea,.select": {
326
- "@apply rounded-container-token": {},
327
- },
328
- ".select": {
329
- "@apply space-y-1 p-2 pr-8": {},
330
- },
331
- ".select[size]": {
332
- "@apply bg-none": {},
333
- },
334
- ".select optgroup": {
335
- "@apply space-y-1 font-bold": {},
336
- },
337
- ".select optgroup option": {
338
- "@apply ml-0 pl-0": {},
339
- },
340
- ".select optgroup option:first-of-type": {
341
- "@apply mt-3": {},
342
- },
343
- ".select optgroup option:last-child": {
344
- "@apply !mb-3": {},
345
- },
346
- ".select option": {
347
- "@apply cursor-pointer px-4 py-2 bg-surface-200-700-token rounded-token": {},
348
- },
349
- ".select option:checked": {
350
- "background": "rgb(var(--color-primary-500)) linear-gradient(0deg, rgb(var(--color-primary-500)) 0%, rgb(var(--color-primary-500)) 100%);",
351
- "@apply text-on-primary-token": {},
352
- },
353
- ".checkbox,.radio": {
354
- "@apply h-5 w-5 cursor-pointer rounded !ring-0": {},
355
- "@apply bg-surface-200-700-token hover:brightness-105 focus:brightness-105": {},
356
- "@apply border-token border-surface-400-500-token focus:border-primary-500": {},
357
- },
358
- ".checkbox:checked,.radio:checked": {
359
- "@apply bg-primary-500 hover:bg-primary-500 focus:bg-primary-500 focus:ring-0": {},
360
- },
361
- ".radio": {
362
- "@apply rounded-token": {},
363
- },
364
- ".input[type='file']": {
365
- "@apply p-1": {},
366
- },
367
- ".input[type='color']": {
368
- "@apply h-10 w-10 cursor-pointer overflow-hidden border-none rounded-token": {},
369
- "-webkit-appearance": "none ",
370
- },
371
- ".input[type='color']::-webkit-color-swatch-wrapper": {
372
- "@apply p-0": {},
373
- },
374
- ".input[type='color']::-webkit-color-swatch": {
375
- "@apply border-none hover:brightness-110": {},
376
- },
377
- ".input[type='color']::-moz-color-swatch": {
378
- "@apply border-none": {},
379
- },
380
- ".input:disabled,.textarea:disabled,.select:disabled": {
381
- "@apply !cursor-not-allowed !opacity-50 hover:!brightness-100": {},
382
- },
383
- ".input[readonly],.textarea[readonly],.select[readonly]": {
384
- "@apply !cursor-not-allowed !border-0 hover:!brightness-100": {},
385
- },
386
- ".input-group": {
387
- "@apply grid overflow-hidden": {},
388
- },
389
- ".input-group input,.input-group select": {
390
- "@apply border-0 bg-transparent ring-0": {},
391
- },
392
- ".input-group select option": {
393
- "@apply bg-surface-200-700-token": {},
394
- },
395
- ".input-group div,.input-group a,.input-group button": {
396
- "@apply flex items-center justify-between px-4": {},
397
- },
398
- ".input-group-divider input,.input-group-divider select,.input-group-divider div,.input-group-divider a": {
399
- "@apply border-l border-surface-400-500-token focus:border-surface-400-500-token": {},
400
- "@apply !ring-0": {},
401
- "@apply !min-w-fit": {},
402
- },
403
- ".input-group-divider *:first-child": {
404
- "@apply !border-l-0": {},
405
- },
406
- ".input-group-shim": {
407
- "@apply bg-surface-400/10 text-surface-600-300-token": {},
408
- },
409
- ".input-success": {
410
- "@apply !border-success-500 !bg-success-200 !text-success-700": {},
411
- },
412
- ".input-success::-moz-placeholder": {
413
- "@apply text-success-700": {},
414
- },
415
- ".input-success:-ms-input-placeholder": {
416
- "@apply text-success-700": {},
417
- },
418
- ".input-success::placeholder": {
419
- "@apply text-success-700": {},
420
- },
421
- ".input-warning": {
422
- "@apply !border-warning-500 !bg-warning-200 !text-warning-700": {},
423
- },
424
- ".input-warning::-moz-placeholder": {
425
- "@apply text-warning-700": {},
426
- },
427
- ".input-warning:-ms-input-placeholder": {
428
- "@apply text-warning-700": {},
429
- },
430
- ".input-warning::placeholder": {
431
- "@apply text-warning-700": {},
432
- },
433
- ".input-error": {
434
- "@apply !border-error-500 !bg-error-200 !text-error-500": {},
435
- },
436
- ".input-error::-moz-placeholder": {
437
- "@apply text-error-500": {},
438
- },
439
- ".input-error:-ms-input-placeholder": {
440
- "@apply text-error-500": {},
441
- },
442
- ".input-error::placeholder": {
443
- "@apply text-error-500": {},
444
- },
445
- ".variant-form-material": {
446
- "@apply !rounded-bl-none !rounded-br-none !rounded-tl !rounded-tr": {},
447
- "@apply bg-surface-500/10 dark:bg-surface-500/20": {},
448
- "@apply border-0 border-b-2": {},
449
- "@apply backdrop-blur": {},
450
- },
451
- ".variant-form-material[type='file']": {
452
- "@apply !py-1.5": {},
453
- },
454
- ".list,.list-dl,.list-nav ul": {
455
- "@apply list-none": {},
456
- "@apply space-y-1": {},
457
- },
458
- ".list li": {
459
- "@apply flex items-center space-x-4 whitespace-nowrap": {},
460
- "@apply p-2": {},
461
- "@apply rounded-token": {},
462
- },
463
- ".list-dl div": {
464
- "@apply flex items-center space-x-4 whitespace-nowrap": {},
465
- "@apply p-2": {},
466
- "@apply rounded-token": {},
467
- },
468
- ".list-nav a,.list-nav button,.list-option": {
469
- "@apply flex items-center space-x-4 whitespace-nowrap": {},
470
- "@apply px-4 py-2": {},
471
- "@apply bg-primary-hover-token": {},
472
- "@apply cursor-pointer": {},
473
- "@apply rounded-token": {},
474
- },
475
- ".logo-cloud": {
476
- "@apply grid overflow-hidden": {},
477
- "@apply rounded-container-token": {},
478
- },
479
- ".logo-item": {
480
- "@apply: flex-auto text-center space-x-4 shadow": {},
481
- "@apply flex items-center justify-center space-x-4": {},
482
- "@apply bg-surface-100-800-token": {},
483
- "@apply text-base font-bold text-black dark:text-white": {},
484
- "@apply py-4 md:py-8": {},
485
- },
486
- ".w-modal-slim": {
487
- "@apply w-full max-w-[400px]": {},
488
- },
489
- ".w-modal": {
490
- "@apply w-full max-w-[640px]": {},
491
- },
492
- ".w-modal-wide": {
493
- "@apply w-full max-w-[80%]": {},
494
- },
495
- ".placeholder": {
496
- "@apply h-5 bg-surface-300-600-token": {},
497
- "@apply rounded-token": {},
498
- },
499
- ".placeholder-circle": {
500
- "@apply aspect-square rounded-full bg-surface-300-600-token": {},
501
- },
502
- ".table-container": {
503
- "@apply w-full overflow-x-auto rounded-container-token": {},
504
- },
505
- ".table": {
506
- "@apply w-full table-auto overflow-hidden": {},
507
- "@apply bg-surface-100-800-token": {},
508
- "@apply rounded-container-token": {},
509
- },
510
- ".table-hover tbody tr": {
511
- "@apply hover:bg-surface-500/20 even:hover:bg-surface-500/20": {},
512
- },
513
- ".table-interactive tbody tr": {
514
- "@apply cursor-pointer hover:bg-primary-hover-token even:hover:bg-primary-hover-token": {},
515
- },
516
- ".table-sort-asc": {
517
- "@apply after:opacity-50 after:!content-['↓']": {},
518
- },
519
- ".table-sort-dsc": {
520
- "@apply after:opacity-50 after:!content-['↑']": {},
521
- },
522
- ".table thead": {
523
- "@apply border-b border-surface-500/20 bg-surface-200-700-token": {},
524
- },
525
- ".table thead tr": {
526
- "@apply text-left capitalize": {},
527
- },
528
- ".table thead th": {
529
- "@apply p-4 font-bold": {},
530
- },
531
- ".table tbody tr": {
532
- "@apply border-b border-surface-500/20 even:bg-surface-500/5": {},
533
- },
534
- ".table tbody td": {
535
- "@apply whitespace-nowrap px-3 py-4 align-top text-sm lg:whitespace-normal": {},
536
- },
537
- ".table-compact tbody td": {
538
- "@apply !py-3": {},
539
- },
540
- ".table-comfortable tbody td": {
541
- "@apply !py-5": {},
542
- },
543
- ".table tfoot": {
544
- "@apply bg-surface-100-800-token": {},
545
- },
546
- ".table tfoot tr": {
547
- "@apply text-left capitalize": {},
548
- },
549
- ".table tfoot th,.table tfoot td": {
550
- "@apply p-4": {},
551
- },
552
- ".table-row-checked": {
553
- "@apply !bg-secondary-500/20": {},
554
- },
555
- ".table-cell-fit": {
556
- "@apply w-[1%] whitespace-nowrap": {},
557
- },
558
- };
@@ -1,21 +0,0 @@
1
- // The Vuetiful Intellisense Tailwind Plugin
2
- // Tailwind Docs: https://tailwindcss.com/docs/plugins
3
- // Vuetiful Docs: https://www.vuetiful.dev/docs/get-started
4
-
5
- const plugin = require("tailwindcss/plugin");
6
-
7
- module.exports = plugin(({ addComponents }) => {
8
- // The following will generate the non-token classes PURELY for Intellisense.
9
- // These are excluded from production, which means we still need to lean into
10
- // using the `all.css` stylesheet to import non-token styles.
11
- if (process.env.NODE_ENV !== "production") {
12
- // try/catch because it will throw when allComponents.cjs isn't generated yet
13
- try {
14
- const all = require("./generated/intellisense-classes.cjs");
15
- addComponents(all, {
16
- respectImportant: true,
17
- respectPrefix: true,
18
- });
19
- } catch {}
20
- }
21
- });
@@ -1,20 +0,0 @@
1
- // Common Shared Settings and Constants
2
-
3
- module.exports = {
4
- colorNames: ['primary', 'secondary', 'tertiary', 'success', 'warning', 'error', 'surface'],
5
- colorShades: [50, 100, 200, 300, 400, 500, 600, 700, 800, 900],
6
- colorPairings: [
7
- // forward:
8
- { light: 50, dark: 900 },
9
- { light: 100, dark: 800 },
10
- { light: 200, dark: 700 },
11
- { light: 300, dark: 600 },
12
- { light: 400, dark: 500 },
13
- // backwards
14
- { light: 900, dark: 50 },
15
- { light: 800, dark: 100 },
16
- { light: 700, dark: 200 },
17
- { light: 600, dark: 300 },
18
- { light: 500, dark: 400 }
19
- ]
20
- };
@@ -1,20 +0,0 @@
1
- // Extends Tailwind with Vuetiful theme-specific colors values
2
- // Doc: https://tailwindcss.com/docs/customizing-colors#using-css-variables
3
-
4
- const settings = require("../settings.cjs");
5
-
6
- // ex: `50: 'rgb(var(--color-primary-50) / <alpha-value>)'`
7
- function generatePaletteShades(colorName) {
8
- const shadeObj = {};
9
- settings.colorShades.forEach(
10
- (s) => (shadeObj[s] = `rgb(var(--color-${colorName}-${s}) / <alpha-value>)`)
11
- );
12
- return shadeObj;
13
- }
14
-
15
- // Generate a a color shade palette 50-900 per each color available
16
- module.exports = () => {
17
- const paletteObj = {};
18
- settings.colorNames.forEach((n) => (paletteObj[n] = generatePaletteShades(n)));
19
- return paletteObj;
20
- };
@@ -1,48 +0,0 @@
1
- // Design Tokens: Background
2
- // Doc: https://www.vuetiful.dev/docs/tokens
3
-
4
- const settings = require("../settings.cjs");
5
-
6
- // Defaults
7
- const backdropAlpha = 0.7;
8
- const hoverAlpha = 0.1;
9
-
10
- module.exports = () => {
11
- const classes = {};
12
- settings.colorNames.forEach((n) => {
13
- // Backdrops
14
- // Example: .bg-primary-backdrop-token
15
- classes[`.bg-${n}-backdrop-token`] = {
16
- "background-color": `rgb(var(--color-${n}-400) / ${backdropAlpha})`,
17
- };
18
- classes[`.dark .bg-${n}-backdrop-token`] = {
19
- "background-color": `rgb(var(--color-${n}-900) / ${backdropAlpha})`,
20
- };
21
-
22
- // Hover
23
- // Example: .bg-primary-hover-token
24
- classes[`.bg-${n}-hover-token:hover`] = {
25
- "background-color": `rgb(var(--color-${n}-500) / ${hoverAlpha})`,
26
- };
27
-
28
- // Active
29
- // Example: .bg-primary-active-token
30
- classes[`.bg-${n}-active-token`] = {
31
- "background-color": `rgb(var(--color-${n}-500)) !important`,
32
- color: `rgb(var(--on-${n}))`,
33
- fill: `rgb(var(--on-${n}))`,
34
- };
35
-
36
- // Color Pairings
37
- // Example: .bg-primary-50-900-token | .bg-primary-900-50-token
38
- settings.colorPairings.forEach((p) => {
39
- classes[`.bg-${n}-${p.light}-${p.dark}-token`] = {
40
- "background-color": `rgb(var(--color-${n}-${p.light}))`,
41
- };
42
- classes[`.dark .bg-${n}-${p.light}-${p.dark}-token`] = {
43
- "background-color": `rgb(var(--color-${n}-${p.dark}))`,
44
- };
45
- });
46
- });
47
- return classes;
48
- };
@@ -1,21 +0,0 @@
1
- // Design Tokens: Border Radius
2
- // Doc: https://www.vuetiful.dev/docs/tokens
3
-
4
- // const settings = require('../settings.cjs');
5
-
6
- module.exports = () => {
7
- return {
8
- // Base
9
- '.rounded-token': { 'border-radius': 'var(--theme-rounded-base)' },
10
- '.rounded-tl-token': { 'border-top-left-radius': 'var(--theme-rounded-base)' },
11
- '.rounded-tr-token': { 'border-top-right-radius': 'var(--theme-rounded-base)' },
12
- '.rounded-bl-token': { 'border-bottom-left-radius': 'var(--theme-rounded-base)' },
13
- '.rounded-br-token': { 'border-bottom-right-radius': 'var(--theme-rounded-base)' },
14
- // Container
15
- '.rounded-container-token': { 'border-radius': 'var(--theme-rounded-container)' },
16
- '.rounded-tl-container-token': { 'border-top-left-radius': 'var(--theme-rounded-container)' },
17
- '.rounded-tr-container-token': { 'border-top-right-radius': 'var(--theme-rounded-container)' },
18
- '.rounded-bl-container-token': { 'border-bottom-left-radius': 'var(--theme-rounded-container)' },
19
- '.rounded-br-container-token': { 'border-bottom-right-radius': 'var(--theme-rounded-container)' }
20
- };
21
- };