blog/tailwind.config.cjs at main · ideopunk/blog · GitHub

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
const { fontFamily } = require("tailwindcss/defaultTheme");

module.exports = {
	content: [
		"./pages/**/*.{js,ts,jsx,tsx}",
		"./components/**/*.{js,ts,jsx,tsx}",
		"./src/**/*.{html,js,svelte,ts}"
	],
	darkMode: "class",
	theme: {
		extend: {
			colors: {
				primary: "#137f94",
				secondary: "#df5c61",
				primaryLight: "hsl(190, 77%, 80%)",
				primaryXLight: "hsl(190, 67%, 92%)",
				primaryDark: "hsl(230, 15%, 70%)",
				secondaryDark: "hsl(358, 785%, 45%)",
				"secondary-grey": "hsl(358, 16%, 95%)",
			},
			fontFamily: {
				...fontFamily,
				serif: ["Merriweather", "serif"],
				sans: ["Merriweather Sans", "sans-serif"]
			},
			typography: (theme) => ({
				DEFAULT: {
					css: {
						color: theme("colors.black"),
						fontFamily: "Merriweather",
						code: {
							"&::before": {
								display: "none"
							},
							"&::after": {
								display: "none"
							}
						},
						// a: {
						// 	color: theme("colors.primary"),
						// 	"&:hover": {
						// 		color: theme("colors.secondaryDark")
						// 	},
						// 	fontWeight: 400
						// },
						em: {}
					}
				}
			})
		}
	},
	plugins: [require("@tailwindcss/typography")]
};