feat: added reject image and migrated to tailwindcss

feat: made it smartphone friendly

nextjs/tailwind.config.ts

@@ -0,0 +1,47 @@
+import type { Config } from 'tailwindcss';
+
+const config: Config = {
+  content: ['./src/**/*.{js,ts,jsx,tsx,mdx}'],
+  theme: {
+    extend: {
+      fontFamily: {
+        indie: ['var(--font-indie)', 'cursive'],
+        mplus: ['var(--font-mplus)', 'sans-serif'],
+      },
+      keyframes: {
+        moveforever: {
+          '0%': { transform: 'translate3d(-90px, 0, 0)' },
+          '100%': { transform: 'translate3d(85px, 0, 0)' },
+        },
+        bounce: {
+          '0%, 20%, 60%, 100%': { transform: 'translateY(0)' },
+          '40%': { transform: 'translateY(-20px)' },
+          '80%': { transform: 'translateY(-10px)' },
+        },
+        slideInFromLeft: {
+          '0%': { transform: 'translateX(-100%)' },
+          '100%': { opacity: '1', transform: 'translateX(0)' },
+        },
+        slideInFromRight: {
+          '0%': { transform: 'translateX(100%)' },
+          '100%': { opacity: '1', transform: 'translateX(0)' },
+        },
+        upAndDown: {
+          '0%, 100%': { transform: 'translateY(0)' },
+          '50%': { transform: 'translateY(-5%)' },
+        },
+      },
+      animation: {
+        'up-down': 'upAndDown 10s linear infinite',
+        'wave-1': 'moveforever 2s cubic-bezier(0.55, 0.5, 0.45, 0.5) -2s infinite',
+        'wave-2': 'moveforever 5s cubic-bezier(0.55, 0.5, 0.45, 0.5) -4s infinite',
+        bounce: 'bounce 1s',
+        'slide-in-l': 'slideInFromLeft 1s forwards',
+        'slide-in-r': 'slideInFromRight 1s forwards',
+      },
+    },
+  },
+  plugins: [],
+};
+
+export default config;