/** @type {import('tailwindcss').Config} */
const plugin = require('tailwindcss/plugin');
const colors = require('tailwindcss/colors');

export default {
    content: ['./src/**/*.{html,js}', 'index.html'],
    theme: {
        extend: {
            // no result ... shit!!
            colors: {
                primary: { ...colors.green, DEFAULT: colors.green[300] },
            },
            boxShadow: {
                neon: "0 0 5px theme('colors.purple.300'), 0 0 25px theme('colors.purple.600')",
            },
        },
    },
    plugins: [
        plugin(({ theme, addUtilities }) => {
            const neonUtilities = {};
            const colors = theme('colors');
            const colorNames = Object.keys(colors);

            for (const color of colorNames) {
                const neonClassName = `.neon-${color}`;
                const neonStyle = {
                    boxShadow: `0 0 5px ${colors[color][300]}, 0 0 55px ${colors[color][600]}`,
                };
                neonUtilities[neonClassName] = neonStyle;
            }
            addUtilities(neonUtilities);
        }),
    ],
};