-
Notifications
You must be signed in to change notification settings - Fork 0
/
tailwind.config.ts
77 lines (72 loc) · 2.57 KB
/
tailwind.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
70
71
72
73
74
75
76
77
import { type Config } from "tailwindcss";
import { fontFamily } from "tailwindcss/defaultTheme";
export default {
content: ["./src/**/*.tsx"],
theme: {
extend: {
screens: {
"2xl": { max: "1535px" },
// => @media (max-width: 1535px) { ... }
xl: { max: "1279px" },
// => @media (max-width: 1279px) { ... }
lg: { max: "1023px" },
// => @media (max-width: 1023px) { ... }
md: { max: "767px" },
// => @media (max-width: 767px) { ... }
sm: { max: "639px" },
// => @media (max-width: 639px) { ... }
},
colors: {
primary: "#a9d7a4", //b0d9bf ff3845 a9d7a4 cce454 1cd77c
secondary: "#0E0E17",
success: "#1ded83",
warning: "#f0b537",
error: "#ff3845",
},
fontFamily: {
main: ["var(--font-main)", ...fontFamily.serif],
complementary: ["var(--font-complementary)", ...fontFamily.serif],
},
dropShadow: {
"primary-md": "-3px -4px 1px rgb(var(--color-primary) / 0.2)",
"primary-lg": "-4px -4px 2px rgb(var(--color-primary) / 0.2)",
"success-md": "-3px -4px 1px rgb(var(--color-success) / 0.2)",
"success-lg": "-4px -4px 2px rgb(var(--color-success) / 0.2)",
"warning-md": "-3px -4px 1px rgb(var(--color-warning) / 0.2)",
"warning-lg": "-4px -4px 2px rgb(var(--color-warning) / 0.2)",
"error-md": "-3px -4px 1px rgb(var(--color-error) / 0.2)",
"error-lg": "-4px -4px 2px rgb(var(--color-error) / 0.2)",
},
backgroundImage: {
"gradient-scanlines":
"linear-gradient(hsla(0,6%,7%,0) 50%,rgba(0,0,0,.25) 0),linear-gradient(90deg,rgba(255,0,0,.06),rgba(0,255,0,.02),rgba(0,0,255,.06));",
},
backgroundSize: {
"size-scanlines": "100% 3px, 3px 100%;",
},
keyframes: {
"vertical-ticker": {
from: { transform: "translate3d(0, 0, 0)" },
to: { transform: "translate3d(0, -100%, 0)" },
},
"button-loading": {
from: { backgroundPosition: "-300px 0" },
to: { backgroundPosition: "300px 0" },
},
"accordion-down": {
from: { height: "0" },
to: { height: "var(--radix-accordion-content-height)" },
},
"accordion-up": {
from: { height: "var(--radix-accordion-content-height)" },
to: { height: "0" },
},
},
animation: {
"accordion-down": "accordion-down 0.2s ease-out",
"accordion-up": "accordion-up 0.2s ease-out",
},
},
},
plugins: [],
} satisfies Config;