98 lines
2.2 KiB
JavaScript
98 lines
2.2 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: [
|
|
"./themes/**/layouts/**/*.html",
|
|
"./content/**/layouts/**/*.html",
|
|
"./layouts/**/*.html",
|
|
"./content/**/*.html",
|
|
],
|
|
theme: {
|
|
fontFamily: {
|
|
custom: ["Inter", "sans-serif"],
|
|
},
|
|
colors: {
|
|
transparent: "transparent",
|
|
current: "currentColor",
|
|
salmon: "#FA765B",
|
|
forest: "#0A4D50",
|
|
"almost-white": "#F5F5F5",
|
|
grayish: "#F5F5F5",
|
|
white: "#FFFFFF",
|
|
black: "#000000",
|
|
},
|
|
maxWidth: {
|
|
"4xl": "960",
|
|
},
|
|
maxWidth: ({ theme, breakpoints }) => ({
|
|
none: "none",
|
|
0: "0rem",
|
|
xs: "20rem",
|
|
sm: "24rem",
|
|
md: "28rem",
|
|
lg: "32rem",
|
|
xl: "36rem",
|
|
"2xl": "42rem",
|
|
"3xl": "48rem",
|
|
"4xl": "60rem",
|
|
"5xl": "64rem",
|
|
"6xl": "72rem",
|
|
"7xl": "80rem",
|
|
full: "100%",
|
|
min: "min-content",
|
|
max: "max-content",
|
|
fit: "fit-content",
|
|
prose: "65ch",
|
|
...breakpoints(theme("screens")),
|
|
}),
|
|
typography: (theme) => ({
|
|
DEFAULT: {
|
|
css: {
|
|
color: theme("colors.forest"),
|
|
p: {
|
|
"margin-bottom": "1rem",
|
|
"line-height": "22.4px",
|
|
},
|
|
h1: {
|
|
"font-style": "normal",
|
|
"font-weight": 500,
|
|
"font-size": "28px",
|
|
"line-height": "130%",
|
|
"margin-bottom": "14px",
|
|
},
|
|
h2: {
|
|
"font-style": "normal",
|
|
"font-weight": 500,
|
|
"font-size": "24px",
|
|
"line-height": "130%",
|
|
"margin-bottom": "10px",
|
|
},
|
|
h3: {
|
|
"font-style": "normal",
|
|
"font-weight": 500,
|
|
"font-size": "20px",
|
|
"line-height": "120%",
|
|
"margin-bottom": "8px",
|
|
},
|
|
},
|
|
},
|
|
}),
|
|
extend: {},
|
|
},
|
|
"container-small": {
|
|
// you can configure the container to be centered
|
|
center: true,
|
|
|
|
// or have default horizontal padding
|
|
padding: "1rem",
|
|
|
|
// default breakpoints but with 40px removed
|
|
screens: {
|
|
sm: "600px",
|
|
md: "728px",
|
|
lg: "984px",
|
|
xl: "1140px",
|
|
},
|
|
},
|
|
plugins: [require("@tailwindcss/typography")],
|
|
};
|