8000 feat: add theme · unocss/unocss@4e6a61f · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Commit 4e6a61f

Browse files
committed
feat: add theme
1 parent 381de3e commit 4e6a61f

File tree

7 files changed

+404
-4
lines changed

7 files changed

+404
-4
lines changed

src/default/index.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
1+
import { NanowindConfig } from '../types'
2+
import { defaultTheme } from './theme'
13
import { defaultRules } from './rules'
24
import { defaultVariants } from './variants'
35

46
export * from './rules'
57
export * from './variants'
68

7-
export const defaultConfig = {
9+
export const defaultConfig: NanowindConfig = {
810
rules: defaultRules,
911
variants: defaultVariants,
12+
theme: defaultTheme,
1013
}

src/default/theme/colors.ts

Lines changed: 297 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,297 @@
1+
// port form Tailwind CSS and Windi CSS
2+
// TODO: add more details
3+
4+
import { NanowindTheme } from '../../types'
5+
6+
export const colors: NanowindTheme['colors'] = {
7+
black: '#000',
8+
white: '#fff',
9+
rose: {
10+
50: '#fff1f2',
11+
100: '#ffe4e6',
12+
200: '#fecdd3',
13+
300: '#fda4af',
14+
400: '#fb7185',
15+
500: '#f43f5e',
16+
600: '#e11d48',
17+
700: '#be123c',
18+
800: '#9f1239',
19+
900: '#881337',
20+
},
21+
pink: {
22+
50: '#fdf2f8',
23+
100: '#fce7f3',
24+
200: '#fbcfe8',
25+
300: '#f9a8d4',
26+
400: '#f472b6',
27+
500: '#ec4899',
28+
600: '#db2777',
29+
700: '#be185d',
30+
800: '#9d174d',
31+
900: '#831843',
32+
},
33+
fuchsia: {
34+
50: '#fdf4ff',
35+
100: '#fae8ff',
36+
200: '#f5d0fe',
37+
300: '#f0abfc',
38+
400: '#e879f9',
39+
500: '#d946ef',
40+
600: '#c026d3',
41+
700: '#a21caf',
42+
800: '#86198f',
43+
900: '#701a75',
44+
},
45+
purple: {
46+
50: '#faf5ff',
47+
100: '#f3e8ff',
48+
200: '#e9d5ff',
49+
300: '#d8b4fe',
50+
400: '#c084fc',
51+
500: '#a855f7',
52+
600: '#9333ea',
53+
700: '#7e22ce',
54+
800: '#6b21a8',
55+
900: '#581c87',
56+
},
57+
violet: {
58+
50: '#f5f3ff',
59+
100: '#ede9fe',
60+
200: '#ddd6fe',
61+
300: '#c4b5fd',
62+
400: '#a78bfa',
63+
500: '#8b5cf6',
64+
600: '#7c3aed',
65+
700: '#6d28d9',
66+
800: '#5b21b6',
67+
900: '#4c1d95',
68+
},
69+
indigo: {
70+
50: '#eef2ff',
71+
100: '#e0e7ff',
72+
200: '#c7d2fe',
73+
300: '#a5b4fc',
74+
400: '#818cf8',
75+
500: '#6366f1',
76+
600: '#4f46e5',
77+
700: '#4338ca',
78+
800: '#3730a3',
79+
900: '#312e81',
80+
},
81+
blue: {
82+
50: '#eff6ff',
83+
100: '#dbeafe',
84+
200: '#bfdbfe',
85+
300: '#93c5fd',
86+
400: '#60a5fa',
87+
500: '#3b82f6',
88+
600: '#2563eb',
89+
700: '#1d4ed8',
90+
800: '#1e40af',
91+
900: '#1e3a8a',
92+
},
93+
sky: {
94+
50: '#f0f9ff',
95+
100: '#e0f2fe',
96+
200: '#bae6fd',
97+
300: '#7dd3fc',
98+
400: '#38bdf8',
99+
500: '#0ea5e9',
100+
600: '#0284c7',
101+
700: '#0369a1',
102+
800: '#075985',
103+
900: '#0c4a6e',
104+
},
105+
cyan: {
106+
50: '#ecfeff',
107+
100: '#cffafe',
108+
200: '#a5f3fc',
109+
300: '#67e8f9',
110+
400: '#22d3ee',
111+
500: '#06b6d4',
112+
600: '#0891b2',
113+
700: '#0e7490',
114+
800: '#155e75',
115+
900: '#164e63',
116+
},
117+
teal: {
118+
50: '#f0fdfa',
119+
100: '#ccfbf1',
120+
200: '#99f6e4',
121+
300: '#5eead4',
122+
400: '#2dd4bf',
123+
500: '#14b8a6',
124+
600: '#0d9488',
125+
700: '#0f766e',
126+
800: '#115e59',
127+
900: '#134e4a',
128+
},
129+
emerald: {
130+
50: '#ecfdf5',
131+
100: '#d1fae5',
132+
200: '#a7f3d0',
133+
300: '#6ee7b7',
134+
400: '#34d399',
135+
500: '#10b981',
136+
600: '#059669',
137+
700: '#047857',
138+
800: '#065f46',
139+
900: '#064e3b',
140+
},
141+
green: {
142+
50: '#f0fdf4',
143+
100: '#dcfce7',
144+
200: '#bbf7d0',
145+
300: '#86efac',
146+
400: '#4ade80',
147+
500: '#22c55e',
148+
600: '#16a34a',
149+
700: '#15803d',
150+
800: '#166534',
151+
900: '#14532d',
152+
},
153+
lime: {
154+
50: '#f7fee7',
155+
100: '#ecfccb',
156+
200: '#d9f99d',
157+
300: '#bef264',
158+
400: '#a3e635',
159+
500: '#84cc16',
160+
600: '#65a30d',
161+
700: '#4d7c0f',
162+
800: '#3f6212',
163+
900: '#365314',
164+
},
165+
yellow: {
166+
50: '#fefce8',
167+
100: '#fef9c3',
168+
200: '#fef08a',
169+
300: '#fde047',
170+
400: '#facc15',
171+
500: '#eab308',
172+
600: '#ca8a04',
173+
700: '#a16207',
174+
800: '#854d0e',
175+
900: '#713f12',
176+
},
177+
amber: {
178+
50: '#fffbeb',
179+
100: '#fef3c7',
180+
200: '#fde68a',
181+
300: '#fcd34d',
182+
400: '#fbbf24',
183+
500: '#f59e0b',
184+
600: '#d97706',
185+
700: '#b45309',
186+
800: '#92400e',
187+
900: '#78350f',
188+
},
189+
orange: {
190+
50: '#fff7ed',
191+
100: '#ffedd5',
192+
200: '#fed7aa',
193+
300: '#fdba74',
194+
400: '#fb923c',
195+
500: '#f97316',
196+
600: '#ea580c',
197+
700: '#c2410c',
198+
800: '#9a3412',
199+
900: '#7c2d12',
200+
},
201+
red: {
202+
50: '#fef2f2',
203+
100: '#fee2e2',
204+
200: '#fecaca',
205+
300: '#fca5a5',
206+
400: '#f87171',
207+
500: '#ef4444',
208+
600: '#dc2626',
209+
700: '#b91c1c',
210+
800: '#991b1b',
211+
900: '#7f1d1d',
212+
},
213+
warmGray: {
214+
50: '#fafaf9',
215+
100: '#f5f5f4',
216+
200: '#e7e5e4',
217+
300: '#d6d3d1',
218+
400: '#a8a29e',
219+
500: '#78716c',
220+
600: '#57534e',
221+
700: '#44403c',
222+
800: '#292524',
223+
900: '#1c1917',
224+
},
225+
trueGray: {
226+
50: '#fafafa',
227+
100: '#f5f5f5',
228+
200: '#e5e5e5',
229+
300: '#d4d4d4',
230+
400: '#a3a3a3',
231+
500: '#737373',
232+
600: '#525252',
233+
700: '#404040',
234+
800: '#262626',
235+
900: '#171717',
236+
},
237+
gray: {
238+
50: '#fafafa',
239+
100: '#f4f4f5',
240+
200: '#e4e4e7',
241+
300: '#d4d4d8',
242+
400: '#a1a1aa',
243+
500: '#71717a',
244+
600: '#52525b',
245+
700: '#3f3f46',
246+
800: '#27272a',
247+
900: '#18181b',
248+
},
249+
coolGray: {
250+
50: '#f9fafb',
251+
100: '#f3f4f6',
252+
200: '#e5e7eb',
253+
300: '#d1d5db',
254+
400: '#9ca3af',
255+
500: '#6b7280',
256+
600: '#4b5563',
257+
700: '#374151',
258+
800: '#1f2937',
259+
900: '#111827',
260+
},
261+
blueGray: {
262+
50: '#f8fafc',
263+
100: '#f1f5f9',
264+
200: '#e2e8f0',
265+
300: '#cbd5e1',
266+
400: '#94a3b8',
267+
500: '#64748b',
268+
600: '#475569',
269+
700: '#334155',
270+
800: '#1e293b',
271+
900: '#0f172a',
272+
},
273+
light: {
274+
50: '#fdfdfd',
275+
100: '#fcfcfc',
276+
200: '#fafafa',
277+
300: '#f8f9fa',
278+
400: '#f6f6f6',
279+
500: '#f2f2f2',
280+
600: '#f1f3f5',
281+
700: '#e9ecef',
282+
800: '#dee2e6',
283+
900: '#dde1e3',
284+
},
285+
dark: {
286+
50: '#4a4a4a',
287+
100: '#3c3c3c',
288+
200: '#323232',
289+
300: '#2d2d2d',
290+
400: '#222222',
291+
500: '#1f1f1f',
292+
600: '#1c1c1e',
293+
700: '#1b1b1b',
294+
800: '#181818',
295+
900: '#0f0f0f',
296+
},
297+
}

src/default/theme/font.ts

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
// port form Tailwind CSS and Windi CSS
2+
// TODO: add more details
3+
4+
import { NanowindTheme } from '../../types'
5+
6+
export const fontFamily = {
7+
sans: [
8+
'ui-sans-serif',
9+
'system-ui',
10+
'-apple-system',
11+
'BlinkMacSystemFont',
12+
'"Segoe UI"',
13+
'Roboto',
14+
'"Helvetica Neue"',
15+
'Arial',
16+
'"Noto Sans"',
17+
'sans-serif',
18+
'"Apple Color Emoji"',
19+
'"Segoe UI Emoji"',
20+
'"Segoe UI Symbol"',
21+
'"Noto Color Emoji"',
22+
].join(','),
23+
serif: [
24+
'ui-serif',
25+
'Georgia',
26+
'Cambria',
27+
'"Times New Roman&q 10000 uot;',
28+
'Times',
29+
'serif',
30+
].join(','),
31+
mono: [
32+
'ui-monospace',
33+
'SFMono-Regular',
34+
'Menlo',
35+
'Monaco',
36+
'Consolas',
37+
'"Liberation Mono"',
38+
'"Courier New"',
39+
'monospace',
40+
].join(','),
41+
}
42+
43+
export const fontSize: NanowindTheme['fontSize'] = {
44+
'xs': ['0.75rem', '1rem'],
45+
'sm': ['0.875rem', '1.25rem'],
46+
'base': ['1rem', '1.5rem'],
47+
'lg': ['1.125rem', '1.75rem'],
48+
'xl': ['1.25rem', '1.75rem'],
49+
'2xl': ['1.5rem', '2rem'],
50+
'3xl': ['1.875rem', '2.25rem'],
51+
'4xl': ['2.25rem', '2.5rem'],
52+
'5xl': ['3rem', '1'],
53+
'6xl': ['3.75rem', '1'],
54+
'7xl': ['4.5rem', '1'],
55+
'8xl': ['6rem', '1'],
56+
'9xl': ['8rem', '1'],
57+
}

src/default/theme/index.ts

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { NanowindTheme } from '../..'
2+
import { colors } from './colors'
3+
import { fontFamily, fontSize } from './font'
4+
5+
export * from './colors'
6+
7+
export const breakpoints = {
8+
'sm': '640px',
9+
'md': '768px',
10+
'lg': '1024px',
11+
'xl': '1280px',
12+
'2xl': '1536px',
13+
}
14+
15+
export const defaultTheme: NanowindTheme = {
16+
colors,
17+
fontFamily,
18+
fontSize,
19+
breakpoints,
20+
}

src/options.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { NanowindUserConfig } from './types'
2+
import { defaultConfig, NanowindConfig } from '.'
3+
4+
export function resolveConfig(config: NanowindUserConfig = {}): NanowindConfig {
5+
return Object.assign({}, defaultConfig, config)
6+
}

0 commit comments

Comments
 (0)
0