mirror of
https://github.com/HugeFrog24/shakethefrog.git
synced 2026-03-02 00:14:33 +00:00
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
import type { Config } from 'tailwindcss'
|
|
|
|
const config: Config = {
|
|
content: [
|
|
'./pages/**/*.{js,ts,jsx,tsx,mdx}',
|
|
'./components/**/*.{js,ts,jsx,tsx,mdx}',
|
|
'./app/**/*.{js,ts,jsx,tsx,mdx}',
|
|
],
|
|
darkMode: 'class',
|
|
theme: {
|
|
extend: {
|
|
keyframes: {
|
|
shake: {
|
|
'0%, 100%': { transform: 'rotate(0deg)' },
|
|
'25%': { transform: 'rotate(-5deg)' },
|
|
'75%': { transform: 'rotate(5deg)' }
|
|
},
|
|
float: {
|
|
'0%': {
|
|
transform: 'translate(calc(-50% + var(--start-x)), calc(-50% + var(--start-y))) scale(var(--scale))',
|
|
opacity: '1'
|
|
},
|
|
'100%': {
|
|
transform: 'translate(calc(-50% + var(--start-x) + (cos(var(--angle)) * 500px)), calc(-50% + var(--start-y) + (sin(var(--angle)) * 500px))) scale(var(--scale))',
|
|
opacity: '0'
|
|
}
|
|
},
|
|
fadeOut: {
|
|
'0%': { opacity: '1' },
|
|
'100%': { opacity: '0' }
|
|
}
|
|
},
|
|
animation: {
|
|
'shake': 'shake 0.2s ease-in-out infinite',
|
|
'float-heart': 'float 2s cubic-bezier(0.2, 0, 0.8, 1) forwards',
|
|
'fade-out': 'fadeOut 2s ease-out forwards'
|
|
}
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|
|
export default config
|