-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtailwind.config.js
295 lines (293 loc) · 9.45 KB
/
tailwind.config.js
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
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
import themes from 'daisyui/src/theming/themes';
/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{html,js,svelte,ts}'],
theme: {
extend: {}
},
plugins: [require('daisyui')],
daisyui: {
themes: [
{
easyLook: {
primary: '#2360e8',
'primary-content': '#fff',
secondary: '#6C2BD9',
'secondary-content': '#fff',
accent: '#be185d',
'accent-content': '#fff',
neutral: '#0f0f0f',
'neutral-content': '#c8c8c8',
'base-100': '#fff',
'base-200': '#f0f0f4',
'base-300': '#cbcbcc',
'base-content': '#1c1b21',
info: '#0284c7',
'info-content': '#fff',
success: '#057A55',
'success-content': '#fff',
warning: '#d97706',
'warning-content': '#fff',
error: '#E02424',
'error-content': '#fff',
//
'--rounded-box': '0.25rem',
'--rounded-btn': '0.25rem',
'--rounded-badge': '2rem',
'--animation-btn': '0.2s',
'--animation-input': '0.2s',
'--btn-focus-scale': '0.95',
'--border-btn': '1px',
'--tab-border': '1px',
'--tab-radius': '0.25rem',
//
'--input-size-xs': '1rem',
'--input-size-sm': '1.75rem',
'--input-size-md': '2.25rem',
'--input-size-lg': '3rem',
'.btn,.btn-md': {
height: 'var(--input-size-md)',
'min-height': 'var(--input-size-md)'
},
'.btn-xs': {
height: 'calc(var(--input-size-xs)*1.5)',
'min-height': 'calc(var(--input-size-xs)*1.5)'
},
'.btn-sm': {
height: 'var(--input-size-sm)',
'min-height': 'var(--input-size-sm)'
},
'.btn-lg': {
height: 'var(--input-size-lg)',
'min-height': 'var(--input-size-lg)'
},
'.btn-square,.btn-circle': {
width: 'var(--input-size-md)'
},
'.btn-square.btn-xs,.btn-circle.btn-xs': {
width: 'var(--input-size-xs)'
},
'.btn-square.btn-sm,.btn-circle.btn-sm': {
width: 'var(--input-size-sm)'
},
'.btn-square.btn-lg,.btn-circle.btn-lg': {
width: 'var(--input-size-lg)'
},
'.file-input,.select,.input': {
padding: '0 0.75rem',
height: 'var(--input-size-md)'
},
'.file-input.file-input-xs,.select.select-xs,.input.input-xs': {
height: 'calc(var(--input-size-xs)*1.5)',
'min-height': 'calc(var(--input-size-xs)*1.5)'
},
'.file-input.file-input-sm,.select.select-sm,.input.input-sm': {
height: 'var(--input-size-sm)'
},
'.file-input.file-input-lg,.select.select-lg,.input.input-lg': {
height: 'var(--input-size-lg)'
},
'.toggle': {
height: 'calc(var(--input-size-md)/1.5)',
width: 'calc(var(--input-size-md)*1.25)',
'--handleoffset': 'calc(var(--input-size-md)/1.8)',
'border-radius': '0.25rem!important'
},
'.toggle.toggle-xs': {
height: 'calc(var(--input-size-xs)/1.5)',
width: 'calc(var(--input-size-xs)*1.25)',
'--handleoffset': 'calc(var(--input-size-xs)/2.25)'
},
'.toggle.toggle-sm': {
height: 'calc(var(--input-size-sm)/1.5)',
width: 'calc(var(--input-size-sm)*1.25)',
'--handleoffset': 'calc(var(--input-size-sm)/1.9)'
},
'.toggle.toggle-lg': {
height: 'calc(var(--input-size-lg)/1.5)',
width: 'calc(var(--input-size-lg)*1.25)',
'--handleoffset': 'calc(var(--input-size-lg)/1.75)'
},
'.checkbox,.radio': {
height: 'calc(var(--input-size-md)/1.5)',
width: 'calc(var(--input-size-md)/1.5)',
'border-radius': '0.25rem!important',
background: 'var(--fallback-bc,oklch(var(--b2)/0.25))'
},
'.radio': {
'border-radius': '100%!important'
},
'.checkbox.checkbox-xs,.radio.radio-xs': {
height: 'calc(var(--input-size-xs)/1.25)',
width: 'calc(var(--input-size-xs)/1.25)'
},
'.checkbox.checkbox-sm,.radio.radio-sm': {
height: 'calc(var(--input-size-sm)/1.5)',
width: 'calc(var(--input-size-sm)/1.5)'
},
'.checkbox.checkbox-lg,.radio.radio-lg': {
height: 'calc(var(--input-size-lg)/1.5)',
width: 'calc(var(--input-size-lg)/1.5)'
},
'.input-bordered:not(.input-primary,.input-secondary,.input-accent,.input-info,.input-success,.input-warning,.input-error)':
{
'border-color': 'var(--fallback-bc,oklch(var(--bc)/0.2))'
},
'.input:focus': {
'outline-width': '0.5px',
'outline-offset': '0'
},
'.link:focus-visible': {
'outline-style': 'dashed',
'outline-width': '1px',
'outline-offset': '0'
},
'.btn:focus-visible,.toggle:focus-visible,.checkbox:focus-visible,.radio:focus-visible': {
'outline-offset': '2px',
'outline-width': '2px'
},
'.badge': {
height: '1.5rem',
'font-weight': '500',
'font-size': '0.8rem'
},
'.badge-xs': {
height: '1rem',
'font-size': '0.65rem'
},
'.badge-sm': {
height: '1.25rem',
'font-size': '0.75rem'
},
'.badge-lg': {
height: '1.5rem',
'font-size': '0.9rem'
},
'.badge-primary': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-p,oklch(var(--p)))',
'border-color': 'var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity)))',
background: 'var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)))'
},
'.badge-secondary': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-s,oklch(var(--s)))',
'border-color': 'var(--fallback-s,oklch(var(--s)/var(--tw-border-opacity)))',
background: 'var(--fallback-s,oklch(var(--s)/var(--tw-bg-opacity)))'
},
'.badge-accent': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-a,oklch(var(--a)))',
'border-color': 'var(--fallback-a,oklch(var(--a)/var(--tw-border-opacity)))',
background: 'var(--fallback-a,oklch(var(--a)/var(--tw-bg-opacity)))'
},
'.badge-info': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-in,oklch(var(--in)))',
'border-color': 'var(--fallback-in,oklch(var(--in)/var(--tw-border-opacity)))',
background: 'var(--fallback-in,oklch(var(--in)/var(--tw-bg-opacity)))'
},
'.badge-success': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-su,oklch(var(--su)))',
'border-color': 'var(--fallback-su,oklch(var(--su)/var(--tw-border-opacity)))',
background: 'var(--fallback-su,oklch(var(--su)/var(--tw-bg-opacity)))'
},
'.badge-warning': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-wa,oklch(var(--wa)))',
'border-color': 'var(--fallback-wa,oklch(var(--wa)/var(--tw-border-opacity)))',
background: 'var(--fallback-wa,oklch(var(--wa)/var(--tw-bg-opacity)))'
},
'.badge-error': {
'--tw-bg-opacity': '0.15',
'--tw-border-opacity': '0.3',
color: 'var(--fallback-er,oklch(var(--er)))',
'border-color': 'var(--fallback-er,oklch(var(--er)/var(--tw-border-opacity)))',
background: 'var(--fallback-er,oklch(var(--er)/var(--tw-bg-opacity)))'
},
'.progress': {
height: '1rem'
},
'.alert': {
'--alert-bg': 'var(--fallback-in,oklch(var(--b2)/0.3))',
'--alert-border-color': 'var(--fallback-in,oklch(var(--bc)/0.1))',
border: '1px solid var(--alert-border-color)',
padding: '0.5rem 0.75rem',
gap: '1rem 0.5rem'
},
'.alert.alert-info': {
'--alert-bg': 'var(--fallback-in,oklch(var(--in)/0.1))',
'--alert-border-color': 'var(--fallback-in,oklch(var(--in)/0.4))',
color: 'var(--fallback-in,oklch(var(--in)/1))'
},
'.alert.alert-success': {
'--alert-bg': 'var(--fallback-su,oklch(var(--su)/0.1))',
'--alert-border-color': 'var(--fallback-su,oklch(var(--su)/0.4))',
color: 'var(--fallback-su,oklch(var(--su)/1))'
},
'.alert.alert-warning': {
'--alert-bg': 'var(--fallback-wa,oklch(var(--wa)/0.05))',
'--alert-border-color': 'var(--fallback-wa,oklch(var(--wa)/0.4))',
color: 'var(--fallback-wa,oklch(var(--wa)/1))'
},
'.alert.alert-error': {
'--alert-bg': 'var(--fallback-er,oklch(var(--er)/0.1))',
'--alert-border-color': 'var(--fallback-er,oklch(var(--er)/0.4))',
color: 'var(--fallback-er,oklch(var(--er)/1))'
},
'.link': {
'text-decoration': 'none'
},
'.link:hover': {
'text-decoration': 'underline'
},
'.btn': {
'box-shadow': 'none'
}
},
easyLookDark: {
...themes['easyLook'],
primary: '#1e40af',
'primary-content': '#dbeafe',
secondary: '#6b21a8',
'secondary-content': '#f3e8ff',
accent: '#9d174d',
'accent-content': '#fce7f3',
neutral: '#0f0f0f',
'neutral-content': '#c8c8c8',
'base-100': '#18181a',
'base-200': '#222225',
'base-300': '#38383d',
'base-content': '#a4a4a6',
info: '#0369a1',
'info-content': '#e0f2fe',
success: '#15803d',
'success-content': '#dcfce7',
warning: '#a16207',
'warning-content': '#fefce8',
error: '#991b1b',
'error-content': '#fee2e2',
//
'--rounded-box': '0.25rem',
'--rounded-btn': '0.25rem',
'--rounded-badge': '2rem',
'--animation-btn': '0.2s',
'--animation-input': '0.2s',
'--btn-focus-scale': '0.95',
'--border-btn': '1px',
'--tab-border': '1px',
'--tab-radius': '0.25rem'
}
}
],
darkTheme: 'easyLookDark',
logs: false
}
};