Add cursor hiding effect for improved user experience

app/globals.css

@@ -59,3 +59,8 @@ body {
 .window-shadow {
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.1);
 }
+
+.hide-native-cursor,
+.hide-native-cursor * {
+  cursor: none;
+}

components/cursor-effect.tsx

@@ -2,19 +2,39 @@
 
 import { useEffect } from "react";
 
+const HIDE_CURSOR_CLASS = "hide-native-cursor";
+const JANUARY = 0;
+const FEBRUARY = 1;
+const DECEMBER = 11;
+
 export default function CursorEffect() {
   useEffect(() => {
     let cursor: any;
     let isMounted = true;
 
-    import("cursor-effects").then((mod) => {
+    const currentMonth = new Date().getMonth();
-      if (isMounted && mod?.trailingCursor) {
+    const isWinter =
-        const TrailingCursor = mod.trailingCursor as any;
+      currentMonth === DECEMBER ||
+      currentMonth === JANUARY ||
+      currentMonth === FEBRUARY;
+
+    import("cursor-effects").then((effects) => {
+      if (!isMounted) return;
+
+      if (!isWinter && effects?.trailingCursor) {
+        document.body.classList.add(HIDE_CURSOR_CLASS);
+        const TrailingCursor = effects.trailingCursor as any;
         cursor = new TrailingCursor();
+      } else if (isWinter && effects?.snowflakeCursor) {
+        document.body.classList.remove(HIDE_CURSOR_CLASS);
+        const SnowflakeCursor = effects.snowflakeCursor as any;
+        cursor = new SnowflakeCursor();
       }
     });
+
     return () => {
       isMounted = false;
+      document.body.classList.remove(HIDE_CURSOR_CLASS);
       if (cursor && typeof cursor.destroy === "function") {
         cursor.destroy();
       }