jamessessford / tailwindcss-ripple

Ripple effect (materialize) for Tailwindcss
MIT License
66 stars 3 forks source link

Is it possible to use tailwindcss-ripple with daisyui? #22

Closed samiulalimsaad closed 2 years ago

jamessessford commented 2 years ago

Hiya!

I haven't played with daisyui so can't be 100% certain but if you have access to a tailwind config file, this should definitely work!

If you give it a try and it doesn't, let me know and I can take a look!

Cheers, James

samiulalimsaad commented 2 years ago

This is my tailwind.config.js configuration

module.exports = {
    content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
    theme: {
        ripple: (theme) => ({
            colors: theme("colors"),
        }),
    },
    plugins: [require("daisyui"), require("tailwindcss-ripple")()],
};

according to tailwindcss-ripple if i use

plugins: [require("daisyui"), require("tailwindcss-ripple")()],

it's not working also showing this error

image

and if i don't call then it's also not working.

plugins: [require("daisyui"), require("tailwindcss-ripple")],

this is my repo link you can check this out.

jamessessford commented 2 years ago

Hiya,

I tried this out this morning and was able to get it working by using the following config

// tailwind.config.js
const colors = require('tailwindcss/colors')

module.exports = {
    content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
    theme: {
        ripple: () => ({
            colors,
        }),
    },
    plugins: [require("daisyui"), require('tailwindcss-ripple')()],
};

I think the problem is the change in how the colors are listed in version 3 of Tailwind. Can you give this a shot and let me know if it works for you?

Cheers

samiulalimsaad commented 2 years ago

Works. Thanks 👍

jamessessford commented 2 years ago

You're welcome, glad I could help!