fix: restore animations and replace tailwind.config.ts

- tailwind.config.ts is not actually being used so removed
- moved animate-fade-in to globals.css
- added tw-animate-css package to make animate-in work
- added a definition for animate-shake as it doesn't exist in tw-animate-css

app/globals.css

@@ -1,4 +1,5 @@
 @import "tailwindcss";
+@import "tw-animate-css";
 
 @custom-variant dark (&:where(.dark, .dark *));
 
@@ -558,6 +559,40 @@ body {
   overscroll-behavior: none;
 }
 
+/* Shake animation (for rejected input) */
+@keyframes shake {
+  0%,
+  100% {
+    transform: translateX(0);
+  }
+  20%,
+  60% {
+    transform: translateX(-4px);
+  }
+  40%,
+  80% {
+    transform: translateX(4px);
+  }
+}
+
+.animate-shake {
+  animation: shake 0.4s ease-in-out;
+}
+
+/* Fade in animation (for popovers) */
+@keyframes fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.animate-fade-in {
+  animation: fade-in 0.2s ease-out;
+}
+
 /* Slide in from right animation (for mobile views) */
 @keyframes slide-in-from-right {
   from {

package-lock.json

@@ -73,6 +73,7 @@
         "husky": "^9.1.7",
         "jsdom": "^28.1.0",
         "tailwindcss": "^4.2.4",
+        "tw-animate-css": "^1.4.0",
         "typescript": "^5.9.3",
         "vitest": "^4.1.5"
       }
@@ -6279,7 +6280,6 @@
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
       "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
@@ -7976,17 +7976,6 @@
         }
       }
     },
-    "node_modules/next-intl/node_modules/@swc/helpers": {
-      "version": "0.5.23",
-      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.23.tgz",
-      "integrity": "sha512-5lSsMOTXURePglDfvuAQUqkGek9Hg2kksOYay2m0+XR++b2NWYL/4sWyuvVBIs8oKnJaxkdi9whaL/sqN13afw==",
-      "license": "Apache-2.0",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "tslib": "^2.8.0"
-      }
-    },
     "node_modules/next/node_modules/postcss": {
       "version": "8.4.31",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz",
@@ -9666,6 +9655,16 @@
       "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
       "license": "0BSD"
     },
+    "node_modules/tw-animate-css": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/tw-animate-css/-/tw-animate-css-1.4.0.tgz",
+      "integrity": "sha512-7bziOlRqH0hJx80h/3mbicLW7o8qLsH5+RaLR2t+OHM3D0JlWGODQKQ4cxbK7WlvmUxpcj6Kgu6EKqjrGFe3QQ==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/Wombosvideo"
+      }
+    },
     "node_modules/type-check": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",

package.json

@@ -97,6 +97,7 @@
     "husky": "^9.1.7",
     "jsdom": "^28.1.0",
     "tailwindcss": "^4.2.4",
+    "tw-animate-css": "^1.4.0",
     "typescript": "^5.9.3",
     "vitest": "^4.1.5"
   },

tailwind.config.ts

@@ -1,40 +0,0 @@
-import type { Config } from "tailwindcss";
-
-export default {
-  darkMode: 'class',
-  content: [
-    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
-    "./components/**/*.{js,ts,jsx,tsx,mdx}",
-    "./app/**/*.{js,ts,jsx,tsx,mdx}",
-    "./stores/**/*.{js,ts,jsx,tsx}",
-  ],
-  theme: {
-    extend: {
-      fontFamily: {
-        sans: [
-          "-apple-system",
-          "BlinkMacSystemFont",
-          "Inter",
-          "system-ui",
-          "sans-serif",
-        ],
-        mono: ["JetBrains Mono", "monospace"],
-      },
-      animation: {
-        "fade-in": "fade-in 0.2s ease-out",
-        "slide-in": "slide-in 0.3s ease-out",
-      },
-      keyframes: {
-        "fade-in": {
-          "0%": { opacity: "0" },
-          "100%": { opacity: "1" },
-        },
-        "slide-in": {
-          "0%": { transform: "translateY(-10px)", opacity: "0" },
-          "100%": { transform: "translateY(0)", opacity: "1" },
-        },
-      },
-    },
-  },
-  plugins: [],
-} satisfies Config;