commerce/tailwind.config.js
leonmargaritis feaa87a9c8
feat: init commercetools setup (#1)
* feat: init commercetools setup

---------

Co-authored-by: Anja-Janina Stiefermann <anja.stiefermann@kernpunkt.de>
2023-11-17 11:39:54 +01:00

55 lines
1.3 KiB
JavaScript

const plugin = require("tailwindcss/plugin");
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./app/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}"],
theme: {
extend: {
fontFamily: {
sans: ["var(--font-geist-sans)"]
},
keyframes: {
fadeIn: {
from: { opacity: 0 },
to: { opacity: 1 }
},
marquee: {
"0%": { transform: "translateX(0%)" },
"100%": { transform: "translateX(-100%)" }
},
blink: {
"0%": { opacity: 0.2 },
"20%": { opacity: 1 },
"100% ": { opacity: 0.2 }
}
},
animation: {
fadeIn: "fadeIn .3s ease-in-out",
carousel: "marquee 60s linear infinite",
blink: "blink 1.4s both infinite"
}
}
},
future: {
hoverOnlyWhenSupported: true
},
plugins: [
require("@tailwindcss/container-queries"),
require("@tailwindcss/typography"),
plugin(({ matchUtilities, theme }) => {
matchUtilities(
{
"animation-delay": (value) => {
return {
"animation-delay": value
};
}
},
{
values: theme("transitionDelay")
}
);
})
]
};