first commit

tailwind.config.ts

@@ -0,0 +1,75 @@
+import type { Config } from "tailwindcss";
+import animate from "tailwindcss-animate";
+
+export default {
+  darkMode: ["class"],
+  content: ["./index.html", "./src/**/*.{ts,tsx}"],
+  theme: {
+    container: {
+      center: true,
+      padding: "1.5rem",
+      screens: {
+        "2xl": "1400px",
+      },
+    },
+    extend: {
+      colors: {
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        card: "hsl(var(--card))",
+        "card-foreground": "hsl(var(--card-foreground))",
+        popover: "hsl(var(--popover))",
+        "popover-foreground": "hsl(var(--popover-foreground))",
+        primary: "hsl(var(--primary))",
+        "primary-foreground": "hsl(var(--primary-foreground))",
+        secondary: "hsl(var(--secondary))",
+        "secondary-foreground": "hsl(var(--secondary-foreground))",
+        muted: "hsl(var(--muted))",
+        "muted-foreground": "hsl(var(--muted-foreground))",
+        accent: "hsl(var(--accent))",
+        "accent-foreground": "hsl(var(--accent-foreground))",
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        pastel: {
+          peach: "#ffc5b5",
+          pink: "#ffb8d2",
+          cream: "#fff8f0",
+          mint: "#d2f4df",
+          lavender: "#e5dcff",
+          lemon: "#fff0ab",
+          coral: "#ff8b7b",
+          berry: "#7848ff"
+        }
+      },
+      borderRadius: {
+        xl: "1.25rem",
+        "2xl": "1.75rem",
+        "3xl": "2rem"
+      },
+      boxShadow: {
+        candy: "0 20px 45px rgba(245, 139, 167, 0.14)",
+        float: "0 18px 35px rgba(103, 78, 167, 0.12)"
+      },
+      fontFamily: {
+        sans: ["Aptos", "Trebuchet MS", "Segoe UI", "sans-serif"],
+        display: ["Comic Sans MS", "Trebuchet MS", "sans-serif"]
+      },
+      keyframes: {
+        bob: {
+          "0%, 100%": { transform: "translateY(0px)" },
+          "50%": { transform: "translateY(-4px)" }
+        },
+        pop: {
+          "0%": { transform: "scale(0.98)", opacity: "0.8" },
+          "100%": { transform: "scale(1)", opacity: "1" }
+        }
+      },
+      animation: {
+        bob: "bob 4.8s ease-in-out infinite",
+        pop: "pop 260ms ease-out"
+      }
+    }
+  },
+  plugins: [animate]
+} satisfies Config;