@innertia-solutions/nuxt-theme-spark 0.1.106 → 0.1.108

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 (17) hide show
  1. package/components/Admin/Base.vue +10 -10
  2. package/components/Admin/Page.vue +8 -8
  3. package/components/Nav/Tabs.vue +3 -3
  4. package/components/Table/Standard.vue +14 -14
  5. package/css/themes/autumn.css +401 -0
  6. package/css/themes/bubblegum.css +408 -0
  7. package/css/themes/cashmere.css +412 -0
  8. package/css/themes/harvest.css +416 -0
  9. package/css/themes/moon.css +140 -0
  10. package/css/themes/ocean.css +273 -0
  11. package/css/themes/olive.css +413 -0
  12. package/css/themes/retro.css +431 -0
  13. package/css/themes/theme.css +725 -0
  14. package/nuxt.config.ts +5 -0
  15. package/package.json +1 -1
  16. package/plugins/theme.client.ts +7 -0
  17. package/spark.css +8 -0
package/css/themes/cashmere.css ADDED
@@ -0,0 +1,412 @@
1
+ /* ------------------------------ */
2
+ /* --------- Cashmere ----------- */
3
+ /* ------------------------------ */
4
+
5
+ @theme theme-cashmere inline {
6
+
7
+ }
8
+
9
+ :root[data-theme="theme-cashmere"],
10
+ [data-theme="theme-cashmere"] {
11
+ --background-1: var(--color-stone-50);
12
+ --background-2: var(--color-stone-100);
13
+ --foreground: var(--color-stone-800);
14
+
15
+ --inverse: var(--color-stone-800);
16
+
17
+ --border: var(--color-stone-200);
18
+ --border-line-1: var(--color-stone-100);
19
+ --border-line-2: var(--color-stone-200);
20
+ --border-line-3: var(--color-stone-300);
21
+ --border-line-4: var(--color-stone-400);
22
+ --border-line-5: var(--color-stone-500);
23
+ --border-line-6: var(--color-stone-600);
24
+ --border-line-7: var(--color-stone-700);
25
+ --border-line-8: var(--color-stone-800);
26
+
27
+ --primary-50: var(--color-preline-mauve-50);
28
+ --primary-100: var(--color-preline-mauve-100);
29
+ --primary-200: var(--color-preline-mauve-200);
30
+ --primary-300: var(--color-preline-mauve-300);
31
+ --primary-400: var(--color-preline-mauve-400);
32
+ --primary-500: var(--color-preline-mauve-500);
33
+ --primary-600: var(--color-preline-mauve-600);
34
+ --primary-700: var(--color-preline-mauve-700);
35
+ --primary-800: var(--color-preline-mauve-800);
36
+ --primary-900: var(--color-preline-mauve-900);
37
+ --primary-950: var(--color-preline-mauve-950);
38
+
39
+ --primary: var(--color-primary-600);
40
+ --primary-hover: var(--color-primary-700);
41
+ --primary-focus: var(--color-primary-700);
42
+ --primary-active: var(--color-primary-700);
43
+ --primary-checked: var(--color-primary-600);
44
+
45
+ --secondary: var(--color-stone-900);
46
+ --secondary-hover: var(--color-stone-800);
47
+ --secondary-focus: var(--color-stone-800);
48
+ --secondary-active: var(--color-stone-800);
49
+
50
+ --layer-line: var(--color-stone-200);
51
+ --layer-foreground: var(--color-stone-800);
52
+ --layer-hover: var(--color-stone-50);
53
+ --layer-focus: var(--color-stone-50);
54
+ --layer-active: var(--color-stone-50);
55
+
56
+ --surface: var(--color-stone-100);
57
+ --surface-1: var(--color-stone-200);
58
+ --surface-2: var(--color-stone-300);
59
+ --surface-3: var(--color-stone-400);
60
+ --surface-4: var(--color-stone-500);
61
+ --surface-5: var(--color-stone-600);
62
+ --surface-foreground: var(--color-stone-800);
63
+ --surface-hover: var(--color-stone-200);
64
+ --surface-focus: var(--color-stone-200);
65
+ --surface-active: var(--color-stone-200);
66
+
67
+ --muted: var(--color-stone-50);
68
+ --muted-foreground: var(--color-stone-400);
69
+ --muted-foreground-1: var(--color-stone-500);
70
+ --muted-foreground-2: var(--color-stone-600);
71
+ --muted-hover: var(--color-stone-100);
72
+ --muted-focus: var(--color-stone-100);
73
+ --muted-active: var(--color-stone-100);
74
+
75
+ --navbar-line: var(--color-stone-200);
76
+ --navbar-divider: var(--color-stone-200);
77
+ --navbar-nav-foreground: var(--color-stone-800);
78
+ --navbar-nav-hover: var(--color-stone-100);
79
+ --navbar-nav-focus: var(--color-stone-100);
80
+ --navbar-nav-active: var(--color-stone-100);
81
+ --navbar-nav-list-divider: var(--color-stone-200);
82
+ --navbar-inverse: var(--color-primary-950);
83
+
84
+ --navbar-1: var(--color-stone-50);
85
+ --navbar-1-line: var(--color-stone-200);
86
+ --navbar-1-divider: var(--color-stone-200);
87
+ --navbar-1-nav-foreground: var(--color-stone-800);
88
+ --navbar-1-nav-hover: var(--color-stone-200);
89
+ --navbar-1-nav-focus: var(--color-stone-200);
90
+ --navbar-1-nav-active: var(--color-stone-200);
91
+ --navbar-1-nav-list-divider: var(--color-stone-200);
92
+
93
+ --navbar-2: var(--color-stone-100);
94
+ --navbar-2-divider: var(--color-stone-300);
95
+ --navbar-2-nav-foreground: var(--color-stone-800);
96
+ --navbar-2-nav-hover: var(--color-stone-200);
97
+ --navbar-2-nav-focus: var(--color-stone-200);
98
+ --navbar-2-nav-active: var(--color-stone-200);
99
+ --navbar-2-nav-list-divider: var(--color-stone-200);
100
+
101
+ --sidebar-line: var(--color-stone-200);
102
+ --sidebar-divider: var(--color-stone-200);
103
+ --sidebar-nav-foreground: var(--color-stone-800);
104
+ --sidebar-nav-hover: var(--color-stone-100);
105
+ --sidebar-nav-focus: var(--color-stone-100);
106
+ --sidebar-nav-active: var(--color-stone-100);
107
+ --sidebar-nav-list-divider: var(--color-stone-200);
108
+ --sidebar-inverse: var(--color-primary-950);
109
+
110
+ --sidebar-1: var(--color-stone-50);
111
+ --sidebar-1-line: var(--color-stone-200);
112
+ --sidebar-1-divider: var(--color-stone-200);
113
+ --sidebar-1-nav-foreground: var(--color-stone-800);
114
+ --sidebar-1-nav-hover: var(--color-stone-200);
115
+ --sidebar-1-nav-focus: var(--color-stone-200);
116
+ --sidebar-1-nav-active: var(--color-stone-200);
117
+ --sidebar-1-nav-list-divider: var(--color-stone-200);
118
+
119
+ --sidebar-2: var(--color-stone-100);
120
+ --sidebar-2-divider: var(--color-stone-200);
121
+ --sidebar-2-nav-foreground: var(--color-stone-800);
122
+ --sidebar-2-nav-hover: var(--color-stone-200);
123
+ --sidebar-2-nav-focus: var(--color-stone-200);
124
+ --sidebar-2-nav-active: var(--color-stone-200);
125
+ --sidebar-2-nav-list-divider: var(--color-stone-200);
126
+
127
+ --card-line: var(--color-stone-200);
128
+ --card-divider: var(--color-stone-200);
129
+ --card-header: var(--color-stone-200);
130
+ --card-footer: var(--color-stone-200);
131
+ --card-inverse: var(--color-primary-950);
132
+
133
+ --dropdown-divider: var(--color-stone-200);
134
+ --dropdown-header: var(--color-stone-200);
135
+ --dropdown-footer: var(--color-stone-200);
136
+ --dropdown-item-foreground: var(--color-stone-800);
137
+ --dropdown-item-hover: var(--color-stone-100);
138
+ --dropdown-item-focus: var(--color-stone-100);
139
+ --dropdown-item-active: var(--color-stone-100);
140
+ --dropdown-inverse: var(--color-primary-950);
141
+
142
+ --select-item-foreground: var(--color-stone-800);
143
+ --select-item-hover: var(--color-stone-100);
144
+ --select-item-focus: var(--color-stone-100);
145
+ --select-item-active: var(--color-stone-100);
146
+ --select-inverse: var(--color-primary-950);
147
+
148
+ --overlay-divider: var(--color-stone-200);
149
+ --overlay-header: var(--color-stone-200);
150
+ --overlay-footer: var(--color-stone-200);
151
+ --overlay-inverse: var(--color-primary-950);
152
+
153
+ --popover-line: var(--color-stone-100);
154
+
155
+ --tooltip: var(--color-stone-900);
156
+
157
+ --table-line: var(--color-stone-200);
158
+
159
+ --footer-line: var(--color-stone-200);
160
+ --footer-inverse: var(--color-primary-950);
161
+
162
+ --scrollbar-track: var(--color-stone-100);
163
+ --scrollbar-thumb: var(--color-stone-300);
164
+
165
+ --chart-colors-background-inverse: var(--color-stone-800);
166
+ --chart-colors-foreground: var(--color-stone-800);
167
+ --chart-primary: var(--color-primary-600);
168
+ --chart-colors-primary: var(--color-primary-600);
169
+ --chart-colors-primary-inverse: var(--color-primary-400);
170
+ --chart-colors-primary-hex: var(--color-primary-600);
171
+ --chart-colors-primary-hex-inverse: var(--color-primary-400);
172
+ --chart-1: var(--color-primary-50);
173
+ --chart-colors-chart-1: var(--color-primary-50);
174
+ --chart-colors-chart-1-inverse: var(--color-primary-50);
175
+ --chart-colors-chart-1-hex: var(--color-primary-50);
176
+ --chart-colors-chart-1-hex-inverse: var(--color-primary-50);
177
+ --chart-2: var(--color-primary-200);
178
+ --chart-colors-chart-2: var(--color-primary-200);
179
+ --chart-colors-chart-2-inverse: var(--color-primary-200);
180
+ --chart-colors-chart-2-hex: var(--color-primary-200);
181
+ --chart-colors-chart-2-hex-inverse: var(--color-primary-200);
182
+ --chart-3: var(--color-primary-600);
183
+ --chart-colors-chart-3: var(--color-primary-400);
184
+ --chart-colors-chart-3-inverse: var(--color-primary-400);
185
+ --chart-colors-chart-3-hex: var(--color-primary-400);
186
+ --chart-colors-chart-3-hex-inverse: var(--color-primary-400);
187
+ --chart-4: var(--color-primary-800);
188
+ --chart-colors-chart-4: var(--color-primary-800);
189
+ --chart-colors-chart-4-inverse: var(--color-primary-800);
190
+ --chart-colors-chart-4-hex: var(--color-primary-800);
191
+ --chart-colors-chart-4-hex-inverse: var(--color-primary-800);
192
+ --chart-5: var(--color-amber-700);
193
+ --chart-colors-chart-5: var(--color-amber-700);
194
+ --chart-colors-chart-5-inverse: var(--color-amber-700);
195
+ --chart-colors-chart-5-hex: var(--color-amber-700);
196
+ --chart-colors-chart-5-hex-inverse: var(--color-amber-700);
197
+ --chart-6: var(--color-teal-700);
198
+ --chart-colors-chart-6: var(--color-teal-700);
199
+ --chart-colors-chart-6-inverse: var(--color-teal-700);
200
+ --chart-colors-chart-6-hex: var(--color-teal-700);
201
+ --chart-colors-chart-6-hex-inverse: var(--color-teal-700);
202
+ --chart-7: var(--color-orange-500);
203
+ --chart-colors-chart-7: var(--color-orange-500);
204
+ --chart-colors-chart-7-inverse: var(--color-orange-500);
205
+ --chart-colors-chart-7-hex: var(--color-orange-500);
206
+ --chart-colors-chart-7-hex-inverse: var(--color-orange-500);
207
+ --chart-8: var(--color-stone-100);
208
+ --chart-colors-chart-8: var(--color-stone-100);
209
+ --chart-colors-chart-8-inverse: var(--color-stone-700);
210
+ --chart-colors-chart-8-hex: var(--color-stone-100);
211
+ --chart-colors-chart-8-hex-inverse: var(--color-stone-700);
212
+ --chart-9: var(--color-stone-200);
213
+ --chart-colors-chart-9: var(--color-stone-200);
214
+ --chart-colors-chart-9-inverse: var(--color-stone-500);
215
+ --chart-colors-chart-9-hex: var(--color-stone-200);
216
+ --chart-colors-chart-9-hex-inverse: var(--color-stone-500);
217
+ --chart-10: var(--color-stone-300);
218
+ --chart-colors-chart-10: var(--color-stone-300);
219
+ --chart-colors-chart-10-inverse: var(--color-stone-700);
220
+ --chart-colors-chart-10-hex: var(--color-stone-300);
221
+ --chart-colors-chart-10-hex-inverse: var(--color-stone-700);
222
+ --chart-colors-candlestick-upward: var(--color-primary-600);
223
+ --chart-colors-candlestick-upward-inverse: var(--color-primary-500);
224
+ --chart-colors-candlestick-downward: var(--color-primary-600);
225
+ --chart-colors-candlestick-downward-inverse: var(--color-primary-500);
226
+ --chart-colors-labels: var(--color-stone-400);
227
+ --chart-colors-labels-inverse: var(--color-stone-400);
228
+ --chart-colors-xaxis-labels: var(--color-stone-400);
229
+ --chart-colors-xaxis-labels-inverse: var(--color-stone-400);
230
+ --chart-colors-yaxis-labels: var(--color-stone-400);
231
+ --chart-colors-yaxis-labels-inverse: var(--color-stone-400);
232
+ --chart-colors-grid-border: var(--color-stone-200);
233
+ --chart-colors-grid-border-inverse: var(--color-stone-700);
234
+ --chart-colors-bar-ranges: var(--color-stone-200);
235
+
236
+ --map-colors-primary: var(--color-primary-600);
237
+ --map-colors-primary-inverse: var(--color-primary-400);
238
+ --map-colors-default: var(--color-stone-300);
239
+ --map-colors-default-inverse: var(--color-stone-600);
240
+ --map-colors-highlight: var(--color-primary-300);
241
+ --map-colors-highlight-inverse: var(--color-primary-300);
242
+ --map-colors-border: var(--color-stone-100);
243
+ --map-colors-border-inverse: var(--color-stone-800);
244
+ }
245
+
246
+ [data-theme="theme-cashmere"].dark {
247
+ --background: var(--color-stone-800);
248
+ --background-1: var(--color-stone-900);
249
+ --background-2: var(--color-stone-900);
250
+ --foreground: var(--color-stone-200);
251
+
252
+ --inverse: var(--color-stone-950);
253
+
254
+ --border: var(--color-stone-700);
255
+ --border-line-1: var(--color-stone-700);
256
+ --border-line-2: var(--color-stone-700);
257
+ --border-line-3: var(--color-stone-600);
258
+ --border-line-4: var(--color-stone-500);
259
+ --border-line-5: var(--color-stone-400);
260
+ --border-line-6: var(--color-stone-300);
261
+ --border-line-7: var(--color-stone-200);
262
+ --border-line-8: var(--color-stone-100);
263
+
264
+ --primary: var(--color-primary-400);
265
+ --primary-foreground: var(--color-primary-950);
266
+ --primary-hover: var(--color-primary-500);
267
+ --primary-focus: var(--color-primary-500);
268
+ --primary-active: var(--color-primary-500);
269
+ --primary-checked: var(--color-primary-400);
270
+
271
+ --secondary: var(--color-white);
272
+ --secondary-foreground: var(--color-stone-800);
273
+ --secondary-hover: var(--color-stone-100);
274
+ --secondary-focus: var(--color-stone-100);
275
+ --secondary-active: var(--color-stone-100);
276
+
277
+ --layer: var(--color-stone-800);
278
+ --layer-line: var(--color-stone-700);
279
+ --layer-foreground: var(--color-white);
280
+ --layer-hover: var(--color-stone-700);
281
+ --layer-focus: var(--color-stone-700);
282
+ --layer-active: var(--color-stone-700);
283
+
284
+ --surface: var(--color-stone-700);
285
+ --surface-1: var(--color-stone-600);
286
+ --surface-2: var(--color-stone-500);
287
+ --surface-3: var(--color-stone-600);
288
+ --surface-4: var(--color-stone-500);
289
+ --surface-5: var(--color-stone-400);
290
+ --surface-foreground: var(--color-stone-200);
291
+ --surface-hover: var(--color-stone-600);
292
+ --surface-focus: var(--color-stone-600);
293
+ --surface-active: var(--color-stone-600);
294
+
295
+ --muted: var(--color-stone-800);
296
+ --muted-foreground: var(--color-stone-500);
297
+ --muted-foreground-1: var(--color-stone-400);
298
+ --muted-foreground-2: var(--color-stone-300);
299
+ --muted-hover: var(--color-stone-700);
300
+ --muted-focus: var(--color-stone-700);
301
+ --muted-active: var(--color-stone-700);
302
+
303
+ --navbar: var(--color-stone-800);
304
+ --navbar-line: var(--color-stone-700);
305
+ --navbar-divider: var(--color-stone-700);
306
+ --navbar-nav-foreground: var(--color-stone-200);
307
+ --navbar-nav-hover: var(--color-stone-700);
308
+ --navbar-nav-focus: var(--color-stone-700);
309
+ --navbar-nav-active: var(--color-stone-700);
310
+ --navbar-nav-list-divider: var(--color-stone-700);
311
+ --navbar-inverse: var(--color-black);
312
+
313
+ --navbar-1: var(--color-stone-900);
314
+ --navbar-1-line: var(--color-stone-700);
315
+ --navbar-1-divider: var(--color-stone-700);
316
+ --navbar-1-nav-foreground: var(--color-stone-200);
317
+ --navbar-1-nav-hover: var(--color-stone-700);
318
+ --navbar-1-nav-focus: var(--color-stone-700);
319
+ --navbar-1-nav-active: var(--color-stone-700);
320
+ --navbar-1-nav-list-divider: var(--color-stone-700);
321
+
322
+ --navbar-2: var(--color-stone-900);
323
+ --navbar-2-divider: var(--color-stone-700);
324
+ --navbar-2-nav-foreground: var(--color-stone-200);
325
+ --navbar-2-nav-hover: var(--color-stone-800);
326
+ --navbar-2-nav-focus: var(--color-stone-800);
327
+ --navbar-2-nav-active: var(--color-stone-800);
328
+ --navbar-2-nav-list-divider: var(--color-stone-800);
329
+
330
+ --sidebar: var(--color-stone-800);
331
+ --sidebar-line: var(--color-stone-700);
332
+ --sidebar-divider: var(--color-stone-700);
333
+ --sidebar-nav-foreground: var(--color-stone-200);
334
+ --sidebar-nav-hover: var(--color-stone-700);
335
+ --sidebar-nav-focus: var(--color-stone-700);
336
+ --sidebar-nav-active: var(--color-stone-700);
337
+ --sidebar-nav-list-divider: var(--color-stone-700);
338
+ --sidebar-inverse: var(--color-black);
339
+
340
+ --sidebar-1: var(--color-stone-900);
341
+ --sidebar-1-line: var(--color-stone-700);
342
+ --sidebar-1-divider: var(--color-stone-700);
343
+ --sidebar-1-nav-foreground: var(--color-stone-200);
344
+ --sidebar-1-nav-hover: var(--color-stone-700);
345
+ --sidebar-1-nav-focus: var(--color-stone-700);
346
+ --sidebar-1-nav-active: var(--color-stone-700);
347
+ --sidebar-1-nav-list-divider: var(--color-stone-700);
348
+
349
+ --sidebar-2: var(--color-stone-900);
350
+ --sidebar-2-divider: var(--color-stone-800);
351
+ --sidebar-2-nav-foreground: var(--color-stone-200);
352
+ --sidebar-2-nav-hover: var(--color-stone-800);
353
+ --sidebar-2-nav-focus: var(--color-stone-800);
354
+ --sidebar-2-nav-active: var(--color-stone-800);
355
+ --sidebar-2-nav-list-divider: var(--color-stone-800);
356
+
357
+ --card: var(--color-stone-800);
358
+ --card-line: var(--color-stone-700);
359
+ --card-divider: var(--color-stone-700);
360
+ --card-header: var(--color-stone-700);
361
+ --card-footer: var(--color-stone-700);
362
+ --card-inverse: var(--color-black);
363
+
364
+ --dropdown: var(--color-stone-900);
365
+ --dropdown-1: var(--color-stone-950);
366
+ --dropdown-divider: var(--color-stone-800);
367
+ --dropdown-header: var(--color-stone-700);
368
+ --dropdown-footer: var(--color-stone-700);
369
+ --dropdown-item-foreground: var(--color-stone-200);
370
+ --dropdown-item-hover: var(--color-stone-800);
371
+ --dropdown-item-focus: var(--color-stone-800);
372
+ --dropdown-item-active: var(--color-stone-800);
373
+ --dropdown-inverse: var(--color-black);
374
+
375
+ --select: var(--color-stone-900);
376
+ --select-1: var(--color-stone-950);
377
+ --select-item-foreground: var(--color-stone-200);
378
+ --select-item-hover: var(--color-stone-800);
379
+ --select-item-focus: var(--color-stone-800);
380
+ --select-item-active: var(--color-stone-800);
381
+ --select-inverse: var(--color-black);
382
+
383
+ --overlay: var(--color-stone-800);
384
+ --overlay-divider: var(--color-stone-700);
385
+ --overlay-header: var(--color-stone-700);
386
+ --overlay-footer: var(--color-stone-700);
387
+ --overlay-inverse: var(--color-black);
388
+
389
+ --popover: var(--color-stone-900);
390
+ --popover-line: var(--color-stone-700);
391
+
392
+ --tooltip: var(--color-white);
393
+ --tooltip-foreground: var(--color-stone-800);
394
+
395
+ --table-line: var(--color-stone-700);
396
+
397
+ --switch: var(--color-stone-800);
398
+
399
+ --footer: var(--color-stone-800);
400
+ --footer-line: var(--color-stone-700);
401
+ --footer-inverse: var(--color-black);
402
+
403
+ --scrollbar-track: var(--color-stone-700);
404
+ --scrollbar-thumb: var(--color-stone-500);
405
+ --scrollbar-track-inverse: var(--color-stone-500);
406
+ --scrollbar-thumb-inverse: var(--color-stone-700);
407
+
408
+ --chart-primary: var(--color-primary-400);
409
+ --chart-8: var(--color-stone-700);
410
+ --chart-9: var(--color-stone-500);
411
+ --chart-10: var(--color-stone-700);
412
+ }