@fylib/theme 0.1.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.
@@ -0,0 +1,413 @@
1
+ export const fineyNexus1Theme = {
2
+ name: 'finey-nexus-1',
3
+ backgroundEffect: {
4
+ name: 'matrix',
5
+ intensity: 40,
6
+ speed: 0.8,
7
+ loop: true
8
+ },
9
+ // wallpaper: {
10
+ // name: 'cyber-grid',
11
+ // type: 'pattern',
12
+ // opacity: 1
13
+ // },
14
+ tokens: {
15
+ colors: {
16
+ primary: '#22c55e',
17
+ secondary: '#0fe3ff',
18
+ success: '#22c55e',
19
+ danger: '#ef4444',
20
+ warning: '#f59e0b',
21
+ info: '#0fe3ff',
22
+ white: '#ffffff',
23
+ black: '#000000',
24
+ background: '#0a0f12',
25
+ text: '#eafaf2',
26
+ 'primary-rgb': '34,197,94',
27
+ surface: '#0c1319',
28
+ border: 'rgba(255,255,255,0.08)'
29
+ },
30
+ spacing: {
31
+ xs: '4px',
32
+ sm: '8px',
33
+ md: '16px',
34
+ lg: '24px',
35
+ xl: '32px',
36
+ },
37
+ borderRadius: {
38
+ sm: '8px',
39
+ md: '12px',
40
+ lg: '16px',
41
+ full: '9999px',
42
+ },
43
+ typography: {
44
+ fontFamily: {
45
+ base: '"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
46
+ heading: '"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
47
+ mono: '"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace'
48
+ },
49
+ fontSize: {
50
+ sm: '12px',
51
+ md: '16px',
52
+ lg: '20px',
53
+ },
54
+ fontWeight: {
55
+ normal: '400',
56
+ bold: '700',
57
+ }
58
+ },
59
+ layout: {
60
+ app: {
61
+ gap: '0'
62
+ },
63
+ header: {
64
+ height: '64px',
65
+ padding: '0 24px',
66
+ shadow: '0 1px 0 rgba(255,255,255,0.06)',
67
+ toggle: {
68
+ background: '#0a0f12',
69
+ textColor: '#22c55e',
70
+ borderColor: 'rgba(34,197,94,0.6)',
71
+ borderRadius: '5px',
72
+ icon: 'menu'
73
+ },
74
+ logoFilterDarkOpacity: '0.85'
75
+ },
76
+ sidebar: {
77
+ width: '260px',
78
+ padding: '16px 0',
79
+ toggle: {
80
+ background: '#0a0f12',
81
+ textColor: '#22c55e',
82
+ borderColor: 'rgba(34,197,94,0.6)',
83
+ borderRadius: '5px',
84
+ icon: 'menu',
85
+ mode: 'floating',
86
+ tonguePosition: 'bottom'
87
+ },
88
+ logoFilterDarkOpacity: '0.85'
89
+ },
90
+ content: {
91
+ padding: '24px'
92
+ }
93
+ },
94
+ effects: {
95
+ button: {
96
+ background: 'linear-gradient(90deg, #00c8ff 0%, #22c55e 100%)',
97
+ borderColor: 'transparent',
98
+ shadow: '0 12px 40px rgba(34,197,94,0.35)',
99
+ textColor: '#0b0f14'
100
+ },
101
+ window: {
102
+ background: '#0f172a',
103
+ shadow: '0 12px 40px rgba(0,0,0,0.55)',
104
+ borderColor: 'rgba(255,255,255,0.08)'
105
+ },
106
+ modal: {
107
+ background: '#0c1319',
108
+ borderColor: 'rgba(255,255,255,0.16)',
109
+ shadow: '0 28px 70px rgba(0,0,0,0.65)',
110
+ overlayColor: 'rgba(0,0,0,0.55)',
111
+ borderWidth: '1px',
112
+ borderRadius: '14px',
113
+ dividerColor: 'rgba(255,255,255,0.12)'
114
+ },
115
+ input: {
116
+ background: '#0a0f12',
117
+ borderColor: 'rgba(255,255,255,0.16)',
118
+ shadow: '0 0 0 1px rgba(255,255,255,0.08) inset',
119
+ placeholderColor: '#93b5a6',
120
+ borderWidth: '1px',
121
+ borderRadius: '14px',
122
+ icons: {
123
+ mode: 'inside',
124
+ name: 'user',
125
+ position: 'left',
126
+ outsideGap: '8px',
127
+ color: 'currentColor'
128
+ }
129
+ },
130
+ select: {
131
+ background: '#0a0f12',
132
+ borderColor: 'rgba(255,255,255,0.16)',
133
+ shadow: '0 0 0 1px rgba(255,255,255,0.08) inset',
134
+ borderWidth: '1px',
135
+ borderRadius: '14px'
136
+ },
137
+ table: {
138
+ background: '#0c1319',
139
+ borderColor: 'rgba(34, 197, 94, 0.2)',
140
+ headerBackground: 'rgba(34, 197, 94, 0.05)',
141
+ rowHoverBackground: 'rgba(34, 197, 94, 0.08)',
142
+ stripedBackground: 'rgba(255, 255, 255, 0.01)',
143
+ textColor: '#eafaf2',
144
+ headerTextColor: '#22c55e'
145
+ },
146
+ chart: {
147
+ background: 'transparent',
148
+ borderColor: 'rgba(34, 197, 94, 0.2)',
149
+ gridColor: 'rgba(255, 255, 255, 0.05)',
150
+ labelColor: '#93b5a6',
151
+ colors: ['#22c55e', '#0fe3ff', '#00c8ff', '#14b8a6', '#06b6d4'],
152
+ fontFamily: 'inherit'
153
+ },
154
+ accordion: {
155
+ background: '#0c1319',
156
+ borderColor: 'rgba(255,255,255,0.16)',
157
+ shadow: 'none',
158
+ dividerColor: 'rgba(255,255,255,0.12)',
159
+ borderRadius: '14px',
160
+ headerBackground: 'transparent'
161
+ },
162
+ card: {
163
+ background: '#0c1319',
164
+ borderColor: 'rgba(34,197,94,0.7)',
165
+ shadow: '0 24px 50px rgba(0,0,0,0.6)',
166
+ dividerColor: 'rgba(255,255,255,0.08)',
167
+ icons: {
168
+ header: '',
169
+ footer: ''
170
+ }
171
+ },
172
+ badge: {
173
+ background: '#22c55e',
174
+ textColor: '#0b0f14',
175
+ borderRadius: '9999px',
176
+ animation: 'shine'
177
+ },
178
+ toast: {
179
+ background: 'rgba(12, 19, 25, 0.95)',
180
+ borderColor: '#22c55e',
181
+ textColor: '#eafaf2',
182
+ shadow: '0 0 20px rgba(34, 197, 94, 0.3), inset 0 0 10px rgba(34, 197, 94, 0.1)',
183
+ borderRadius: '4px',
184
+ padding: '14px 20px',
185
+ gap: '12px',
186
+ minWidth: '320px',
187
+ maxWidth: '420px',
188
+ titleFontSize: '14px',
189
+ titleFontWeight: '700',
190
+ messageFontSize: '13px',
191
+ messageLineHeight: '1.5',
192
+ iconSize: '24px',
193
+ closeIcon: 'x',
194
+ closeButtonSize: '18px',
195
+ closeButtonOpacity: '0.7',
196
+ closeButtonHoverOpacity: '1',
197
+ closeButtonBackground: 'transparent',
198
+ closeButtonBorder: '1px solid rgba(34, 197, 94, 0.3)',
199
+ closeButtonBorderRadius: '2px',
200
+ iconColor: {
201
+ info: '#00c8ff',
202
+ success: '#22c55e',
203
+ warning: '#f59e0b',
204
+ error: '#ef4444'
205
+ },
206
+ icons: {
207
+ info: 'lightning-fill',
208
+ success: 'check-circle-fill',
209
+ warning: 'warning-diamond-fill',
210
+ error: 'fire-fill'
211
+ }
212
+ },
213
+ notificationMenu: {
214
+ button: {
215
+ background: 'transparent',
216
+ textColor: '#22c55e',
217
+ icon: 'bell',
218
+ badgeBackground: '#ef4444',
219
+ badgeTextColor: '#ffffff'
220
+ },
221
+ dropdown: {
222
+ background: '#0c1319',
223
+ borderColor: 'rgba(34, 197, 94, 0.4)',
224
+ shadow: '0 20px 50px rgba(0,0,0,0.8), 0 0 15px rgba(34, 197, 94, 0.15)',
225
+ width: '320px',
226
+ maxHeight: '420px',
227
+ borderRadius: '14px'
228
+ },
229
+ item: {
230
+ background: 'transparent',
231
+ hoverBackground: 'rgba(34, 197, 94, 0.1)',
232
+ textColor: '#eafaf2',
233
+ descriptionColor: '#93b5a6',
234
+ dividerColor: 'rgba(255,255,255,0.08)',
235
+ unreadIndicator: '#22c55e'
236
+ },
237
+ config: {
238
+ showAll: false,
239
+ limit: 5,
240
+ allowClear: true,
241
+ accordionMode: true,
242
+ showViewAll: true,
243
+ viewAllPosition: 'footer-right'
244
+ }
245
+ }
246
+ },
247
+ icons: {
248
+ defaultSet: 'ph',
249
+ size: {
250
+ sm: '12px',
251
+ md: '16px',
252
+ lg: '20px'
253
+ },
254
+ strokeWidth: '1.5',
255
+ variant: 'regular'
256
+ },
257
+ scrollbar: {
258
+ width: '12px',
259
+ trackBackground: '#0a0f12',
260
+ thumbBackground: 'linear-gradient(180deg, #00c8ff 0%, #22c55e 100%)',
261
+ thumbHoverBackground: 'linear-gradient(180deg, #00e1ff 0%, #28ff6c 100%)',
262
+ thumbBorderRadius: '2px',
263
+ thumbBorderWidth: '2px',
264
+ thumbBorderColor: '#0a0f12'
265
+ }
266
+ },
267
+ darkTokens: {
268
+ colors: {
269
+ primary: '#22c55e',
270
+ background: '#0b0f14',
271
+ text: '#e5e7eb',
272
+ secondary: '#14b8a6',
273
+ surface: '#0f172a'
274
+ },
275
+ effects: {
276
+ modal: {
277
+ background: '#0f172a',
278
+ borderColor: 'rgba(255,255,255,0.18)',
279
+ shadow: '0 32px 80px rgba(0,0,0,0.75)',
280
+ overlayColor: 'rgba(0,0,0,0.55)',
281
+ borderWidth: '1px',
282
+ borderRadius: '14px',
283
+ dividerColor: 'rgba(255,255,255,0.12)'
284
+ },
285
+ input: {
286
+ borderColor: 'rgba(255,255,255,0.18)',
287
+ placeholderColor: '#a3a3a3',
288
+ shadow: 'none'
289
+ },
290
+ select: {
291
+ borderColor: 'rgba(255,255,255,0.18)',
292
+ shadow: 'none',
293
+ borderWidth: '1px',
294
+ borderRadius: '14px'
295
+ },
296
+ accordion: {
297
+ borderColor: 'rgba(255,255,255,0.18)',
298
+ shadow: 'none',
299
+ dividerColor: 'rgba(255,255,255,0.12)',
300
+ borderRadius: '14px',
301
+ headerBackground: 'transparent'
302
+ },
303
+ button: {
304
+ background: 'linear-gradient(90deg, #0b1e13 0%, #0d2518 100%)',
305
+ borderColor: 'rgba(34, 197, 94, 0.4)',
306
+ shadow: '0 0 15px rgba(34, 197, 94, 0.2)',
307
+ textColor: '#22c55e'
308
+ },
309
+ card: {
310
+ background: '#0c1319',
311
+ borderColor: 'rgba(34, 197, 94, 0.3)',
312
+ dividerColor: 'rgba(255, 255, 255, 0.08)',
313
+ shadow: '0 24px 50px rgba(0,0,0,0.8), 0 0 20px rgba(34, 197, 94, 0.05)'
314
+ },
315
+ table: {
316
+ background: '#0b0f14',
317
+ borderColor: 'rgba(34, 197, 94, 0.3)',
318
+ headerBackground: 'rgba(34, 197, 94, 0.1)',
319
+ rowHoverBackground: 'rgba(34, 197, 94, 0.15)',
320
+ stripedBackground: 'rgba(255, 255, 255, 0.02)',
321
+ textColor: '#e5e7eb',
322
+ headerTextColor: '#22c55e'
323
+ },
324
+ chart: {
325
+ background: 'transparent',
326
+ gridColor: 'rgba(255, 255, 255, 0.08)',
327
+ labelColor: '#9ca3af',
328
+ colors: ['#22c55e', '#0fe3ff', '#00c8ff', '#14b8a6', '#06b6d4']
329
+ },
330
+ toast: {
331
+ background: 'rgba(15, 23, 42, 0.95)',
332
+ borderColor: '#22c55e',
333
+ textColor: '#e5e7eb',
334
+ shadow: '0 0 30px rgba(34, 197, 94, 0.5), inset 0 0 15px rgba(34, 197, 94, 0.2)',
335
+ borderRadius: '4px',
336
+ closeButtonOpacity: '0.8',
337
+ closeButtonHoverOpacity: '1',
338
+ iconColor: {
339
+ info: '#00c8ff',
340
+ success: '#22c55e',
341
+ warning: '#f59e0b',
342
+ error: '#ef4444'
343
+ },
344
+ icons: {
345
+ info: 'lightning-fill',
346
+ success: 'check-circle-fill',
347
+ warning: 'warning-diamond-fill',
348
+ error: 'fire-fill'
349
+ }
350
+ },
351
+ notificationMenu: {
352
+ button: {
353
+ background: 'transparent',
354
+ textColor: '#22c55e',
355
+ icon: 'bell',
356
+ badgeBackground: '#ef4444',
357
+ badgeTextColor: '#ffffff'
358
+ },
359
+ dropdown: {
360
+ background: '#0f172a',
361
+ borderColor: 'rgba(34, 197, 94, 0.5)',
362
+ shadow: '0 20px 60px rgba(0,0,0,0.9), 0 0 20px rgba(34, 197, 94, 0.2)',
363
+ width: '320px',
364
+ maxHeight: '420px',
365
+ borderRadius: '14px'
366
+ },
367
+ item: {
368
+ background: 'transparent',
369
+ hoverBackground: 'rgba(34, 197, 94, 0.15)',
370
+ textColor: '#e5e7eb',
371
+ descriptionColor: '#9ca3af',
372
+ dividerColor: 'rgba(255,255,255,0.1)',
373
+ unreadIndicator: '#22c55e'
374
+ }
375
+ }
376
+ }
377
+ },
378
+ componentAnimations: {
379
+ 'fy-button': {
380
+ hover: 'button-hover-soft',
381
+ click: 'button-click-press',
382
+ success: 'button-success-pulse',
383
+ error: 'button-error-shake'
384
+ },
385
+ 'fy-input': {
386
+ focus: 'input-focus-glow',
387
+ success: 'input-success-pulse',
388
+ error: 'input-error-shake'
389
+ },
390
+ 'fy-layout': {
391
+ enter: 'layout-fade-in'
392
+ },
393
+ 'fy-slot:header': {
394
+ open: 'header-menu-dropdown-in',
395
+ close: 'header-menu-dropdown-out'
396
+ },
397
+ 'fy-slot:sidebar': {
398
+ open: 'sidebar-slide-in',
399
+ close: 'sidebar-slide-out'
400
+ },
401
+ 'fy-notification-menu': {
402
+ open: 'dropdown-in',
403
+ close: 'dropdown-out'
404
+ },
405
+ 'fy-accordion': {
406
+ expand: 'accordion-expand',
407
+ collapse: 'accordion-collapse'
408
+ },
409
+ 'fy-card': {
410
+ enter: 'card-fade-in'
411
+ }
412
+ }
413
+ };
@@ -0,0 +1,2 @@
1
+ import { ThemeDefinition } from '@fylib/core';
2
+ export declare const fineyPuffy1Theme: ThemeDefinition;