188 lines
4.7 KiB
JavaScript
188 lines
4.7 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: [
|
|
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
|
|
"./components/**/*.{js,ts,jsx,tsx,mdx}",
|
|
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
|
|
"./plugins/**/*.{js,ts,jsx,tsx,mdx}",
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
backgroundPrimary: {
|
|
100: "#FFFBE6",
|
|
},
|
|
primary: {
|
|
100: "#2189a818",
|
|
200: "#2189a8ce",
|
|
300: "#2ab0daa6",
|
|
400: "#279fc4",
|
|
500: "#2189A8",
|
|
600: "#1C7A96",
|
|
700: "#166B84",
|
|
800: "#105C72",
|
|
900: "#0A4D60",
|
|
},
|
|
|
|
secondary: {
|
|
100: "#FDE9D9",
|
|
200: "#FCCFB2",
|
|
300: "#FABF8B",
|
|
400: "#F8AE64",
|
|
500: "#F79D3E",
|
|
600: "#F68C17",
|
|
700: "#E27600",
|
|
800: "#B95B00",
|
|
900: "#8C4000",
|
|
},
|
|
|
|
textMain: {
|
|
100: "#444444",
|
|
},
|
|
mainDisable: {
|
|
100: "#888888",
|
|
},
|
|
info: {
|
|
100: "#2B91EF",
|
|
200: "#0061bd",
|
|
},
|
|
danger: {
|
|
100: "#FF2C2C",
|
|
},
|
|
body: {
|
|
100: "#EEEEEE",
|
|
},
|
|
},
|
|
|
|
typography: (theme) => ({
|
|
DEFAULT: {
|
|
css: {
|
|
color: theme("colors.gray.700"),
|
|
h1: {
|
|
color: theme("colors.gray.900"),
|
|
fontWeight: "700",
|
|
fontSize: "1rem",
|
|
marginBottom: "1rem",
|
|
},
|
|
h2: {
|
|
color: theme("colors.gray.800"),
|
|
fontWeight: "600",
|
|
fontSize: "1rem",
|
|
marginBottom: "1rem",
|
|
},
|
|
h3: {
|
|
color: theme("colors.gray.700"),
|
|
fontWeight: "600",
|
|
fontSize: "1.75rem",
|
|
marginBottom: "0.75rem",
|
|
},
|
|
h4: {
|
|
color: theme("colors.gray.600"),
|
|
fontWeight: "500",
|
|
fontSize: "1.5rem",
|
|
marginBottom: "0.5rem",
|
|
},
|
|
h5: {
|
|
color: theme("colors.gray.600"),
|
|
fontWeight: "500",
|
|
fontSize: "1.25rem",
|
|
marginBottom: "0.5rem",
|
|
},
|
|
h6: {
|
|
color: theme("colors.gray.600"),
|
|
fontWeight: "500",
|
|
fontSize: "1rem",
|
|
marginBottom: "0.5rem",
|
|
},
|
|
p: {
|
|
marginBottom: "1rem",
|
|
lineHeight: "1.75rem",
|
|
fontSize: "1rem",
|
|
},
|
|
a: {
|
|
color: theme("colors.blue.600"),
|
|
textDecoration: "underline",
|
|
"&:hover": {
|
|
color: theme("colors.blue.800"),
|
|
},
|
|
},
|
|
ul: {
|
|
listStyleType: "disc",
|
|
paddingLeft: "1.25rem",
|
|
marginBottom: "1rem",
|
|
},
|
|
ol: {
|
|
listStyleType: "decimal",
|
|
paddingLeft: "1.25rem",
|
|
marginBottom: "1rem",
|
|
},
|
|
blockquote: {
|
|
borderLeftColor: theme("colors.gray.300"),
|
|
borderLeftWidth: "4px",
|
|
fontStyle: "italic",
|
|
paddingLeft: "1rem",
|
|
color: theme("colors.gray.600"),
|
|
marginBottom: "1rem",
|
|
},
|
|
code: {
|
|
backgroundColor: theme("colors.gray.100"),
|
|
padding: "0.25rem 0.5rem",
|
|
borderRadius: "0.25rem",
|
|
fontSize: "0.875rem",
|
|
},
|
|
pre: {
|
|
backgroundColor: theme("colors.gray.800"),
|
|
color: theme("colors.gray.100"),
|
|
padding: "1rem",
|
|
borderRadius: "0.5rem",
|
|
overflowX: "auto",
|
|
},
|
|
// Add additional elements if needed...
|
|
},
|
|
},
|
|
}),
|
|
},
|
|
|
|
screens: {
|
|
xs: "290px",
|
|
sm: "640px",
|
|
// => @media (min-width: 640px) { ... }
|
|
|
|
md: "768px",
|
|
// => @media (min-width: 768px) { ... }
|
|
|
|
lg: "1024px",
|
|
// => @media (min-width: 1024px) { ... }
|
|
|
|
xl: "1440px",
|
|
// => @media (min-width: 1280px) { ... }
|
|
|
|
"2xl": "1536px",
|
|
// => @media (min-width: 1536px) { ... }
|
|
},
|
|
|
|
animation: {
|
|
"infinite-scroll": "infinite-scroll 200s linear infinite",
|
|
},
|
|
|
|
keyframes: {
|
|
"infinite-scroll": {
|
|
from: { transform: "translateX(0)" },
|
|
to: { transform: "translateX(-100%)" },
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
require("@tailwindcss/typography"),
|
|
// ...other plugins
|
|
],
|
|
corePlugins: {
|
|
backdropOpacity: false,
|
|
backgroundOpacity: false,
|
|
borderOpacity: false,
|
|
divideOpacity: false,
|
|
ringOpacity: false,
|
|
textOpacity: false,
|
|
},
|
|
};
|