-
Notifications
You must be signed in to change notification settings - Fork 72
/
uno.config.ts
69 lines (66 loc) · 2.31 KB
/
uno.config.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
// uno.config.ts
import {
defineConfig,
presetAttributify,
presetIcons,
presetTypography,
presetUno,
transformerDirectives,
transformerVariantGroup,
} from 'unocss'
function convert(color: string) {
return `color-mix(in srgb, ${color} calc(100% * <alpha-value>), transparent)`
}
export default defineConfig({
shortcuts: [
['btn', 'px-4 py-1 rounded inline-block bg-teal-600 text-white cursor-pointer hover:bg-teal-700 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'],
],
theme: {
colors: {
'primary': convert('var(--p-primary-color)'),
'primary-emphasis': convert('var(--p-primary-hover-color)'),
'primary-emphasis-alt': convert('var(--p-primary-active-color)'),
'primary-contrast': convert('var(--p-primary-contrast-color)'),
'primary-50': convert('var(--p-primary-50)'),
'primary-100': convert('var(--p-primary-100)'),
'primary-200': convert('var(--p-primary-200)'),
'primary-300': convert('var(--p-primary-300)'),
'primary-400': convert('var(--p-primary-400)'),
'primary-500': convert('var(--p-primary-500)'),
'primary-600': convert('var(--p-primary-600)'),
'primary-700': convert('var(--p-primary-700)'),
'primary-800': convert('var(--p-primary-800)'),
'primary-900': convert('var(--p-primary-900)'),
'primary-950': convert('var(--p-primary-950)'),
'surface-0': convert('var(--p-surface-0)'),
'surface-50': convert('var(--p-surface-50)'),
'surface-100': convert('var(--p-surface-100)'),
'surface-200': convert('var(--p-surface-200)'),
'surface-300': convert('var(--p-surface-300)'),
'surface-400': convert('var(--p-surface-400)'),
'surface-500': convert('var(--p-surface-500)'),
'surface-600': convert('var(--p-surface-600)'),
'surface-700': convert('var(--p-surface-700)'),
'surface-800': convert('var(--p-surface-800)'),
'surface-900': convert('var(--p-surface-900)'),
'surface-950': convert('var(--p-surface-950)'),
},
breakpoints: {
sm: '640px',
md: '768px',
lg: '1024px',
xl: '1280px',
xxl: '1536px',
},
},
presets: [
presetUno(),
presetAttributify(),
presetIcons(),
presetTypography(),
],
transformers: [
transformerDirectives(),
transformerVariantGroup(),
],
})