/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./**/**.rs",
    "./public/*.html",
  ],
  safelist: [
    "backdrop-blur-sm",
  ],
  theme: {
    extend: {
      animation: {
        'bounce-twice': 'bounce 1s 1.5',
      },
      width: {
        '128': '32rem',
        '192': '48rem',
        '256': '64rem',
      }
    },
  },
  darkMode: 'class',
  plugins: [require("@tailwindcss/typography"), require("daisyui")],
  daisyui: {
    // fd7014 (logo color)
    themes: ["halloween"], // false: only light + dark | true: all themes | array: specific themes like this ["light", "dark", "cupcake"]
    darkTheme: "halloween", // name of one of the included themes for dark mode
    base: true, // applies background color and foreground color for root element by default
    styled: true, // include daisyUI colors and design decisions for all components
    utils: true, // adds responsive and modifier utility classes
    prefix: "", // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors)
    logs: false,
    themeRoot: ":root", // The element that receives theme color CSS variables
  },
}