-
Notifications
You must be signed in to change notification settings - Fork 7
/
tailwind.config.cjs
51 lines (51 loc) · 1.58 KB
/
tailwind.config.cjs
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
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{astro,html,js,jsx,md,mdx,ts,tsx}"],
plugins: [
require("@tailwindcss/forms"),
function ({ addVariant, addComponents, addUtilities, theme, apply }) {
addVariant("scrollbar", "&::-webkit-scrollbar");
addVariant("scrollbar-thumb", "&::-webkit-scrollbar-thumb");
addComponents({
".chat": {
"@apply grid grid-cols-12 gap-y-2 my-4 py-4 border border-gray-200 rounded shadow": {},
},
".chat .avatar": {
"@apply flex items-center justify-center self-start h-10 w-10 rounded-full bg-indigo-500 flex-shrink-0 text-white":
{},
},
".chat p": {
"@apply flex flex-row items-center text-center col-start-1 col-end-11 md:col-end-10 p-3 rounded my-0 py-0":
{},
},
".chat em, .chat strong": {
"@apply ml-3 text-left font-normal align-middle py-2 px-4 shadow rounded-lg bg-gray-100 text-black": {},
},
".chat strong": {
"@apply bg-indigo-100": {},
},
".chat .me": {
"@apply col-start-2 md:col-start-3 col-end-13 flex-row-reverse": {},
},
".chat .me strong": {
"@apply mr-3": {},
},
});
},
],
theme: {
extend: {
colors: {
normal: "#888888",
fine: "#2DC50E",
superior: "#A02EF7",
epic: "#A02EF7",
legendary: "#CCAA1A",
health: "#EE5555",
magicka: "#7777FF",
stamina: "#00BB00",
ultimate: "#AAAA00",
},
},
},
};