1  const path = require("path")
  2  
  3  module.exports = {
  4    darkMode: "class",
  5    presets: [require("@medusajs/ui-preset")],
  6    content: [
  7      "./src/app/**/*.{js,ts,jsx,tsx}",
  8      "./src/pages/**/*.{js,ts,jsx,tsx}",
  9      "./src/components/**/*.{js,ts,jsx,tsx}",
 10      "./src/modules/**/*.{js,ts,jsx,tsx}",
 11      "./node_modules/@medusajs/ui/dist/**/*.{js,jsx,ts,tsx}",
 12    ],
 13    theme: {
 14      extend: {
 15        transitionProperty: {
 16          width: "width margin",
 17          height: "height",
 18          bg: "background-color",
 19          display: "display opacity",
 20          visibility: "visibility",
 21          padding: "padding-top padding-right padding-bottom padding-left",
 22        },
 23        colors: {
 24          grey: {
 25            0: "#FFFFFF",
 26            5: "#F9FAFB",
 27            10: "#F3F4F6",
 28            20: "#E5E7EB",
 29            30: "#D1D5DB",
 30            40: "#9CA3AF",
 31            50: "#6B7280",
 32            60: "#4B5563",
 33            70: "#374151",
 34            80: "#1F2937",
 35            90: "#111827",
 36          },
 37        },
 38        borderRadius: {
 39          none: "0px",
 40          soft: "2px",
 41          base: "4px",
 42          rounded: "8px",
 43          large: "16px",
 44          circle: "9999px",
 45        },
 46        maxWidth: {
 47          "8xl": "100rem",
 48        },
 49        screens: {
 50          "2xsmall": "320px",
 51          xsmall: "512px",
 52          small: "1024px",
 53          medium: "1280px",
 54          large: "1440px",
 55          xlarge: "1680px",
 56          "2xlarge": "1920px",
 57        },
 58        fontSize: {
 59          "3xl": "2rem",
 60        },
 61        fontFamily: {
 62          sans: [
 63            "Inter",
 64            "-apple-system",
 65            "BlinkMacSystemFont",
 66            "Segoe UI",
 67            "Roboto",
 68            "Helvetica Neue",
 69            "Ubuntu",
 70            "sans-serif",
 71          ],
 72        },
 73        keyframes: {
 74          ring: {
 75            "0%": { transform: "rotate(0deg)" },
 76            "100%": { transform: "rotate(360deg)" },
 77          },
 78          "fade-in-right": {
 79            "0%": {
 80              opacity: "0",
 81              transform: "translateX(10px)",
 82            },
 83            "100%": {
 84              opacity: "1",
 85              transform: "translateX(0)",
 86            },
 87          },
 88          "fade-in-top": {
 89            "0%": {
 90              opacity: "0",
 91              transform: "translateY(-10px)",
 92            },
 93            "100%": {
 94              opacity: "1",
 95              transform: "translateY(0)",
 96            },
 97          },
 98          "fade-out-top": {
 99            "0%": {
100              height: "100%",
101            },
102            "99%": {
103              height: "0",
104            },
105            "100%": {
106              visibility: "hidden",
107            },
108          },
109          "accordion-slide-up": {
110            "0%": {
111              height: "var(--radix-accordion-content-height)",
112              opacity: "1",
113            },
114            "100%": {
115              height: "0",
116              opacity: "0",
117            },
118          },
119          "accordion-slide-down": {
120            "0%": {
121              "min-height": "0",
122              "max-height": "0",
123              opacity: "0",
124            },
125            "100%": {
126              "min-height": "var(--radix-accordion-content-height)",
127              "max-height": "none",
128              opacity: "1",
129            },
130          },
131          enter: {
132            "0%": { transform: "scale(0.9)", opacity: 0 },
133            "100%": { transform: "scale(1)", opacity: 1 },
134          },
135          leave: {
136            "0%": { transform: "scale(1)", opacity: 1 },
137            "100%": { transform: "scale(0.9)", opacity: 0 },
138          },
139          "slide-in": {
140            "0%": { transform: "translateY(-100%)" },
141            "100%": { transform: "translateY(0)" },
142          },
143        },
144        animation: {
145          ring: "ring 2.2s cubic-bezier(0.5, 0, 0.5, 1) infinite",
146          "fade-in-right":
147            "fade-in-right 0.3s cubic-bezier(0.5, 0, 0.5, 1) forwards",
148          "fade-in-top": "fade-in-top 0.2s cubic-bezier(0.5, 0, 0.5, 1) forwards",
149          "fade-out-top":
150            "fade-out-top 0.2s cubic-bezier(0.5, 0, 0.5, 1) forwards",
151          "accordion-open":
152            "accordion-slide-down 300ms cubic-bezier(0.87, 0, 0.13, 1) forwards",
153          "accordion-close":
154            "accordion-slide-up 300ms cubic-bezier(0.87, 0, 0.13, 1) forwards",
155          enter: "enter 200ms ease-out",
156          "slide-in": "slide-in 1.2s cubic-bezier(.41,.73,.51,1.02)",
157          leave: "leave 150ms ease-in forwards",
158        },
159      },
160    },
161    plugins: [require("tailwindcss-radix")()],
162  }