-
Notifications
You must be signed in to change notification settings - Fork 374
Expand file tree
/
Copy pathtailwind.base.config.js
More file actions
181 lines (180 loc) · 6.9 KB
/
tailwind.base.config.js
File metadata and controls
181 lines (180 loc) · 6.9 KB
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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
import lineageConfig from './tailwind.lineage.config'
import typography from '@tailwindcss/typography'
import scrollbar from 'tailwind-scrollbar'
export default {
presets: [lineageConfig],
theme: {
colors: {},
extend: {
colors: {
transparent: 'transparent',
white: 'var(--color-white)',
black: 'var(--color-black)',
dark: 'var(--color-dark)',
light: 'var(--color-light)',
brand: 'var(--color-brand)',
prose: 'var(--color-prose)',
focused: 'var(--color-focused)',
neutral: {
DEFAULT: 'var(--color-neutral)',
3: 'var(--color-neutral-3)',
5: 'var(--color-neutral-5)',
10: 'var(--color-neutral-10)',
15: 'var(--color-neutral-15)',
20: 'var(--color-neutral-20)',
25: 'var(--color-neutral-25)',
100: 'var(--color-neutral-100)',
125: 'var(--color-neutral-125)',
150: 'var(--color-neutral-150)',
200: 'var(--color-neutral-200)',
300: 'var(--color-neutral-300)',
400: 'var(--color-neutral-400)',
500: 'var(--color-neutral-500)',
525: 'var(--color-neutral-525)',
550: 'var(--color-neutral-550)',
600: 'var(--color-neutral-600)',
700: 'var(--color-neutral-700)',
725: 'var(--color-neutral-725)',
750: 'var(--color-neutral-750)',
800: 'var(--color-neutral-800)',
900: 'var(--color-neutral-900)',
},
typography: {
heading: 'var(--color-typography-headline)',
tagline: 'var(--color-typography-tagline)',
description: 'var(--color-typography-description)',
info: 'var(--color-typography-info)',
},
message: {
translucid: 'var(--color-message-translucid)',
},
link: {
underline: 'var(--color-link-underline)',
hover: 'var(--color-link-hover)',
active: 'var(--color-link-active)',
visited: 'var(--color-link-visited)',
},
'model-name': {
'grayscale-link-underline':
'var(--color-model-name-grayscale-link-underline)',
'grayscale-link-underline-hover':
'var(--color-model-name-grayscale-link-hover)',
'grayscale-catalog': 'var(--color-model-name-grayscale-catalog)',
'grayscale-schema': 'var(--color-model-name-grayscale-schema)',
'grayscale-model': 'var(--color-model-name-grayscale-model)',
'link-underline': 'var(--color-model-name-link-underline)',
'link-underline-hover':
'var(--color-model-name-link-underline-hover)',
catalog: 'var(--color-model-name-catalog)',
schema: 'var(--color-model-name-schema)',
model: 'var(--color-model-name-model)',
'copy-icon': 'var(--color-model-name-copy-icon)',
'copy-icon-hover': 'var(--color-model-name-copy-icon-hover)',
'copy-icon-background':
'var(--color-model-name-copy-icon-background)',
'copy-icon-background-hover':
'var(--color-model-name-copy-icon-background-hover)',
},
badge: {
background: 'var(--color-badge-background)',
foreground: 'var(--color-badge-foreground)',
},
'filterable-list': {
counter: {
background: 'var(--color-filterable-list-counter-background)',
foreground: 'var(--color-filterable-list-counter-foreground)',
},
input: {
background: 'var(--color-filterable-list-input-background)',
foreground: 'var(--color-filterable-list-input-foreground)',
placeholder: 'var(--color-filterable-list-input-placeholder)',
border: 'var(--color-filterable-list-input-border)',
},
},
input: {
'background-translucid': 'var(--color-input-background-translucid)',
background: 'var(--color-input-background)',
foreground: 'var(--color-input-foreground)',
placeholder: 'var(--color-input-placeholder)',
border: 'var(--color-input-border)',
},
button: {
primary: {
background: 'var(--color-button-primary-background)',
foreground: 'var(--color-button-primary-foreground)',
hover: 'var(--color-button-primary-hover)',
active: 'var(--color-button-primary-active)',
},
secondary: {
background: 'var(--color-button-secondary-background)',
foreground: 'var(--color-button-secondary-foreground)',
hover: 'var(--color-button-secondary-hover)',
active: 'var(--color-button-secondary-active)',
},
alternative: {
background: 'var(--color-button-alternative-background)',
foreground: 'var(--color-button-alternative-foreground)',
hover: 'var(--color-button-alternative-hover)',
active: 'var(--color-button-alternative-active)',
},
destructive: {
background: 'var(--color-button-destructive-background)',
foreground: 'var(--color-button-destructive-foreground)',
hover: 'var(--color-button-destructive-hover)',
active: 'var(--color-button-destructive-active)',
},
danger: {
background: 'var(--color-button-danger-background)',
foreground: 'var(--color-button-danger-foreground)',
hover: 'var(--color-button-danger-hover)',
active: 'var(--color-button-danger-active)',
},
transparent: {
background: 'var(--color-button-transparent-background)',
foreground: 'var(--color-button-transparent-foreground)',
hover: 'var(--color-button-transparent-hover)',
active: 'var(--color-button-transparent-active)',
},
},
tooltip: {
background: 'var(--color-tooltip-background)',
foreground: 'var(--color-tooltip-foreground)',
},
metadata: {
label: 'var(--color-metadata-label)',
value: 'var(--color-metadata-value)',
},
},
borderRadius: {
'2xs': 'var(--radius-xs)',
xs: 'calc(var(--radius-xs) + 1px)',
sm: 'calc(var(--radius-xs) + 2px)',
md: 'calc(var(--radius-s))',
lg: 'calc(var(--radius-s) + 1px)',
xl: 'calc(var(--radius-s) + 2px)',
'2xl': 'calc(var(--radius-m))',
},
fontSize: {
'2xs': 'var(--text-2xs)',
xs: 'var(--text-xs)',
s: 'var(--text-s)',
m: 'var(--text-m)',
l: 'var(--text-l)',
xl: 'var(--text-xl)',
'2xl': 'var(--text-2xl)',
'3xl': 'var(--text-3xl)',
'4xl': 'var(--text-4xl)',
},
fontFamily: {
mono: ['var(--font-mono)'],
},
},
},
plugins: [
typography,
scrollbar({
nocompatible: true,
preferredStrategy: 'pseudoelements',
}),
],
}