init

tailwind.config.js

@@ -0,0 +1,46 @@
+import { heroui } from '@heroui/theme';
+import animate from 'tailwindcss-animate';
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
+    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
+    './node_modules/@heroui/theme/dist/**/*.{js,ts,jsx,tsx}',
+  ],
+  theme: {
+    extend: {
+      fontFamily: {
+        sans: ['var(--font-sans)'],
+        mono: ['var(--font-mono)'],
+      },
+      backgroundImage: {
+        modalMark:
+          'linear-gradient(to top, rgba(0, 0, 0) 0%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.8) 68%, rgba(255, 255, 255, 0.65) 82%, rgba(255, 255, 255, 0) 100%)',
+      },
+    },
+  },
+  darkMode: ['class'],
+  plugins: [
+    heroui({
+      addCommonColors: true,
+      // defaultTheme: "light", // default theme from the themes object
+      // defaultExtendTheme: "light", // default theme to extend on custom themes
+      themes: {
+        light: {
+          colors: {
+            primary: { DEFAULT: '#EC4342' },
+            background: { DEFAULT: '#18181B' },
+          },
+        },
+        dark: {
+          colors: {
+            primary: { DEFAULT: '#EC4342' },
+            background: { DEFAULT: '#18181B' },
+          },
+        },
+      },
+    }),
+    animate,
+  ],
+};