Ajoutez Overdog FN à votre projet via Yarn ou NPM
yarn add @overdog/fn
Ajoutez les variants nécessaires à votre fichier de config Tailwind CSS
module.exports = {
// ...
plugins: [
plugin(function ({ addVariant }) {
// Required - Fn states variants
addVariant("is-open", "&[data-fn-is-open]")
addVariant("parent-is-open", "[data-fn-is-open] &")
addVariant("is-loading", "[data-fn-is-loading] &")
// Optionnal - Fn nav and side-panel (Edit for your needs)
addVariant("nav-open-1", "[data-fn-nav-open='1'] &")
addVariant("nav-open-2", "[data-fn-nav-open='2'] &")
addVariant("nav-open-3", "[data-fn-nav-open='3'] &")
addVariant("nav-open-sidepanel", "[data-fn-nav-open='sidepanel'] &")
})
]
}
Ajoutez des éléments
Ajoutez ensuite les éléments que vous désirez à votre projet et copiez la section Template Twig !