nextjs-starter-medusa

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
}
163