tailwind.config.ts

import aspectRatio from "@tailwindcss/aspect-ratio";
import forms from "@tailwindcss/forms";
import typography from "@tailwindcss/typography";
import type { Config } from "tailwindcss";
import defaultTheme from "tailwindcss/defaultTheme";

export default {
    content:  [ "./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}" ],
    darkMode: "class",
    theme:    {
        extend: {
            fontFamily: {
                sans: [
                    "Nunito Variable",
                    ...defaultTheme.fontFamily.sans,
                ],
            },
            animation:  {
                "bounce-horizontal": `bounce-horizontal 2s infinite`,
            },
            keyframes:  {
                "bounce-horizontal": {
                    "0%, 100%": {
                        transform:               "translateX(-25%)",
                        animationTimingFunction: "cubic-bezier(0.8, 0, 1, 1)",
                    },
                    "50%":      {
                        transform:               "none",
                        animationTimingFunction: "cubic-bezier(0, 0, 0.2, 1)",
                    },
                },
            },
        },
    },
    plugins:  [
        forms,
        typography,
        aspectRatio,
    ],
} as Config;