/** @type {import('tailwindcss').Config} */
export default {
  content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
  theme: {
    extend: {
      colors: {
        customColor: "#1c1c1e",
      },
    },
  },
  plugins: [
    // 配置自定义Tailwind CSS实用程序类的函数
    function ({ addUtilities }) {
      // 定义隐藏滚动条的实用程序类
      // 定义用于Tailwind CSS的自定义工具类对象
      const scrollbarUtilities = {
        // 定义.no-scrollbar类，不显示滚动条
        ".no-scrollbar": {
          "-ms-overflow-style": "none", // 适用于Internet Explorer和Edge浏览器的样式
          "scrollbar-width": "none", // 适用于Firefox浏览器的样式
        },
        // 定义.no-scrollbar元素下的伪元素，适用于WebKit内核的浏览器
        ".no-scrollbar::-webkit-scrollbar": {
          display: "none", // 隐藏滚动条
        },
      };
      // 将自定义工具类添加到Tailwind CSS中，并启用响应式和hover状态
      addUtilities(scrollbarUtilities, ["responsive", "hover"]);
    },
  ],
};