/** @type {import('tailwindcss').Config} */
export default {
    content: ["./src/**/*.{njk,html,md}"],
    theme: {
        fontFamily: {
            sans: ['Cantarell', 'sans-serif'],
            serif: ['Junicode', 'serif'],
            heading: ['Darumadrop One', 'cursive'],
            body: ['Pangolin', 'sans']
        },
        extend: {
            keyframes: {
                bounce: {
                    '50%': {
                        transform: 'translateY(-25%)',
                        'animation-timing-function': 'cubic-bezier(0.8, 0, 1, 1)',
                    },
                    '0%, 100%': {
                        transform: 'translateY(0)',
                        'animation-timing-function': 'cubic-bezier(0, 0, 0.2, 1)'
                    }
                },
                'wiggle-strong': {
                    '0%, 100%': {
                        transform: 'rotate(-5deg)'
                    },
                    '50%': {
                        transform: 'rotate(5deg)'
                    }
                },
                'wiggle-soft': {
                    '0%, 100%': {
                        transform: 'rotate(-1deg)'
                    },
                    '50%': {
                        transform: 'rotate(1deg)'
                    }
                },
                'text-shadow-pop': {
                    '0%': {
                        'text-shadow': '0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555',
                        '-webkit-transform': 'translateX(0) translateY(0)',
                                transform: 'translateX(0) translateY(0)',
                      },
                      '100%': {
                        'text-shadow': '1px -1px #555555, 2px -2px #555555, 3px -3px #555555, 4px -4px #555555, 5px -5px #555555, 6px -6px #555555, 7px -7px #555555, 8px -8px #555555',
                        '-webkit-transform': 'translateX(-8px) translateY(8px)',
                                'transform': 'translateX(-8px) translateY(8px)',
                      }
                },
                'text-shadow-pop-sm': {
                    '0%': {
                        'text-shadow': '0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555',
                        '-webkit-transform': 'translateX(0) translateY(0)',
                                transform: 'translateX(0) translateY(0)',
                      },
                      '100%': {
                        'text-shadow': '1px -1px #555555, 2px -2px #555555, 3px -3px #555555, 4px -4px #555555',
                        '-webkit-transform': 'translateX(-4px) translateY(4px)',
                                'transform': 'translateX(-4px) translateY(4px)',
                      }
                },
            },
            animation: {
                'wiggle-strong': 'wiggle-strong 0.3s ease-in-out infinite',
                'wiggle-soft': 'wiggle-soft 0.263s ease-in-out infinite',
                bounce: 'bounce 0.8s infinite',
                'text-shadow-pop': 'text-shadow-pop 0.6s both',
                'text-shadow-pop-sm': 'text-shadow-pop-sm 0.6s both'
            },
            colors: {
                'deep-purple': '#1b0035',
                'off-white': '#fff7fa',
                'sun': '#f5ac2e',
            },
        },
    },
    plugins: [
        require('@tailwindcss/typography'),
    ],
}