@gomiui/theme-dovisual 0.0.1 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/dovisualTheme.ts +34 -23
package/package.json
CHANGED
package/src/dovisualTheme.ts
CHANGED
|
@@ -1,6 +1,26 @@
|
|
|
1
|
-
import {defineTheme} from '@gomiui/core/theme';
|
|
1
|
+
import {defineSyntaxTheme, defineTheme} from '@gomiui/core/theme';
|
|
2
2
|
import {dovisualIconRegistry} from './icons';
|
|
3
3
|
|
|
4
|
+
const doVisualSyntax = defineSyntaxTheme({
|
|
5
|
+
name: 'xds-dovisual',
|
|
6
|
+
tokens: {
|
|
7
|
+
keyword: '#b2a7c1', // Cathedral plum
|
|
8
|
+
string: '#9bb19a', // Forest moss
|
|
9
|
+
comment: '#5e5e5e', // Faded ink
|
|
10
|
+
number: '#dec074', // Aged gold
|
|
11
|
+
function: '#8aa1d8', // Midnight indigo
|
|
12
|
+
type: '#b2a7c1', // Cathedral plum
|
|
13
|
+
variable: '#E8F1F6', // Parchment
|
|
14
|
+
operator: '#96A0AB', // Mid neutral
|
|
15
|
+
constant: '#e6b85e', // Candlelight amber
|
|
16
|
+
tag: '#d97580', // Blood crimson
|
|
17
|
+
attribute: '#b6aa90', // Aged gold
|
|
18
|
+
property: '#94b2a0', // Verdigris
|
|
19
|
+
punctuation: '#ababb0', // Mid neutral
|
|
20
|
+
background: '#87E64B',
|
|
21
|
+
},
|
|
22
|
+
});
|
|
23
|
+
|
|
4
24
|
export const dovisualTheme = defineTheme({
|
|
5
25
|
name: 'dovisual',
|
|
6
26
|
|
|
@@ -24,6 +44,7 @@ export const dovisualTheme = defineTheme({
|
|
|
24
44
|
family: 'DM Sans',
|
|
25
45
|
fallbacks:
|
|
26
46
|
'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
|
|
47
|
+
weights: {3: 'bold', 4: 'bold'},
|
|
27
48
|
},
|
|
28
49
|
code: {
|
|
29
50
|
family: 'JetBrains Mono',
|
|
@@ -32,10 +53,12 @@ export const dovisualTheme = defineTheme({
|
|
|
32
53
|
},
|
|
33
54
|
},
|
|
34
55
|
|
|
56
|
+
syntax: doVisualSyntax,
|
|
57
|
+
|
|
35
58
|
tokens: {
|
|
36
59
|
'--color-accent': 'light-dark(#87E64B, #87E64B)',
|
|
37
60
|
'--color-accent-muted': 'light-dark(#25252a14, #f3f3f520)',
|
|
38
|
-
'--color-on-accent': 'light-dark(#
|
|
61
|
+
'--color-on-accent': 'light-dark(#25252A, #25252a)',
|
|
39
62
|
'--color-neutral': 'light-dark(#25252a0f, #f3f3f51a)',
|
|
40
63
|
'--color-background-surface': 'light-dark(#E0E0E0, #1b1b1f)',
|
|
41
64
|
'--color-background-body': 'light-dark(#F2F2F2, #111015)',
|
|
@@ -109,25 +132,9 @@ export const dovisualTheme = defineTheme({
|
|
|
109
132
|
'--color-border-yellow': 'light-dark(#e5d3a9, #463a18)',
|
|
110
133
|
'--color-icon-yellow': 'light-dark(#524622, #f4e1b7)',
|
|
111
134
|
'--color-text-yellow': 'light-dark(#524622, #f4e1b7)',
|
|
112
|
-
'--
|
|
113
|
-
'--
|
|
114
|
-
'--
|
|
115
|
-
'--spacing-2': '16px',
|
|
116
|
-
'--spacing-3': '24px',
|
|
117
|
-
'--spacing-4': '32px',
|
|
118
|
-
'--spacing-5': '40px',
|
|
119
|
-
'--spacing-6': '48px',
|
|
120
|
-
'--spacing-7': '56px',
|
|
121
|
-
'--spacing-8': '64px',
|
|
122
|
-
'--spacing-9': '72px',
|
|
123
|
-
'--spacing-10': '80px',
|
|
124
|
-
'--spacing-11': '88px',
|
|
125
|
-
'--spacing-12': '96px',
|
|
126
|
-
'--radius-inner': '8px',
|
|
127
|
-
'--radius-element': '16px',
|
|
128
|
-
'--radius-container': '24px',
|
|
129
|
-
'--radius-page': '56px',
|
|
130
|
-
'--radius-chat': '56px',
|
|
135
|
+
'--font-family-body': '"Poppins", -apple-system, sans-serif',
|
|
136
|
+
'--font-family-code': '"JetBrains Mono", "SF Mono", Monaco, Consolas, monospace',
|
|
137
|
+
'--font-family-heading': '"DM Sans", -apple-system, sans-serif',
|
|
131
138
|
'--text-display-3-leading': '1.3793',
|
|
132
139
|
'--shadow-low': '0 2px 4px #28282A0D, 0 4px 8px #28282A1A',
|
|
133
140
|
'--shadow-med': '0 2px 4px #28282A0D, 0 4px 12px #28282A1A',
|
|
@@ -260,7 +267,7 @@ export const dovisualTheme = defineTheme({
|
|
|
260
267
|
},
|
|
261
268
|
'button': {
|
|
262
269
|
'base': {
|
|
263
|
-
'borderRadius': 'var(--radius-
|
|
270
|
+
'borderRadius': 'var(--radius-container)',
|
|
264
271
|
},
|
|
265
272
|
'variant:secondary': {
|
|
266
273
|
'backgroundColor': 'transparent',
|
|
@@ -323,6 +330,9 @@ export const dovisualTheme = defineTheme({
|
|
|
323
330
|
'--color-text-secondary': 'var(--color-text-red)',
|
|
324
331
|
'--color-error': 'var(--color-text-red)',
|
|
325
332
|
},
|
|
333
|
+
'base': {
|
|
334
|
+
'borderRadius': 'var(--radius-element)',
|
|
335
|
+
},
|
|
326
336
|
},
|
|
327
337
|
'progressbar-fill': {
|
|
328
338
|
'variant:accent': {
|
|
@@ -460,7 +470,8 @@ export const dovisualTheme = defineTheme({
|
|
|
460
470
|
},
|
|
461
471
|
'card': {
|
|
462
472
|
'base': {
|
|
463
|
-
'padding': 'var(--spacing-
|
|
473
|
+
'padding': 'var(--spacing-2)',
|
|
474
|
+
'borderRadius': 'var(--radius-container)',
|
|
464
475
|
},
|
|
465
476
|
},
|
|
466
477
|
'section': {
|